/* EKOTEKS 12.13 — Trend Active landing page only.
 * All selectors are anchored to .trend-exact or .trend-exact-* classes,
 * and this stylesheet loads only on is_page('trend-active').
 * WooCommerce product data, category links, cart and checkout remain native.
 */

/* 1 — Calm premium green-and-cream hero, aligned with approved Ecover styling. */
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact {
  display:flex;
  position:relative;
  align-items:center;
  isolation:isolate;
  overflow:hidden;
  min-height:304px;
  border:1px solid #e4e9dc;
  border-radius:27px;
  background:linear-gradient(108deg,#eff6ea 0%,#edf4e8 55%,#f5f0e7 100%);
}
/* The original photo already contains soft greenery; do not add a second
   leaf image, which creates visible seams on smaller screen widths. */
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact::before{display:none!important;content:none!important}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact::after{
  content:"";
  display:block;
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,
    #eff6ea 0%,
    rgba(239,246,234,.99) 23%,
    rgba(239,246,234,.88) 34%,
    rgba(239,246,234,.49) 45%,
    rgba(239,246,234,.06) 59%,
    transparent 72%);
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy{
  position:relative;
  z-index:4;
  display:block;
  flex:0 0 auto;
  width:51%;
  max-width:680px;
  min-width:0;
  padding:34px 38px 37px 45px;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy .eyebrow{display:none!important}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy h1{
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(48px,4.65vw,67px);
  font-weight:500;
  line-height:1.04;
  letter-spacing:-.052em;
  color:#153f30;
  margin:0 0 15px;
  max-width:none;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy p{
  color:#315345;
  font-size:15px;
  line-height:1.56;
  max-width:495px;
  margin:0 0 22px;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-hero-visual{
  position:absolute;
  z-index:1;
  inset:0 0 0 auto;
  width:68%;
  height:100%;
  background:transparent;
  overflow:hidden;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-hero-visual img{
  display:block;
  width:100%;height:100%;
  object-fit:cover;
  object-position:right center;
  max-width:none;max-height:none;
  border:0;
  padding:0;margin:0;
  mix-blend-mode:normal;
  opacity:1;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .btn.primary.trend-cta{
  display:inline-flex;
  min-height:53px;
  padding:13px 25px;
  border:0;
  border-radius:999px;
  background:linear-gradient(112deg,#73b52c,#368b1e);
  box-shadow:0 8px 20px rgba(56,113,36,.18);
  font-size:14px;
  font-weight:780;
  line-height:1.2;
  color:white;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .btn.primary.trend-cta:hover{background:linear-gradient(112deg,#85c73c,#4a9c2c)}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .btn.primary.trend-cta svg{width:17px;height:17px}

/* 2 — The existing filters remain functional; only their visuals/spacing change. */
.brand-hero.trend-exact + .ek127-brand-filter-wrap{margin-top:10px;margin-bottom:0}
.brand-hero.trend-exact + .ek127-brand-filter-wrap .ekshop-filters{
  min-height:65px;
  border-radius:19px;
  background:linear-gradient(93deg,#f1f6e9,#edf4e7 58%,#f2f5eb);
}

/* 3 — Three genuine WooCommerce categories, consistent art direction. */
.ek-subcats.trend-exact-subcats.section{padding-top:21px;padding-bottom:0}
.ek-subcats.trend-exact-subcats .section-head{margin-bottom:19px}
.ek-subcats.trend-exact-subcats .section-head h2{
  font-size:clamp(33px,3.25vw,44px);
  font-weight:520;
  line-height:1.04;
  letter-spacing:-.05em;
  margin-top:5px;
}
.ek-subcats.trend-exact-subcats .section-head .eyebrow{
  color:#376b40;
  letter-spacing:.15em;
  font-size:10px;
  font-weight:840;
}
.ek-subcats.trend-exact-subcats .subcategory-grid{gap:16px}
.ek-subcats.trend-exact-subcats .subcategory-card{
  display:flex;
  align-items:center;
  min-height:190px;
  position:relative;
  overflow:hidden;
  border:1px solid #e4e9dd;
  border-radius:22px;
  background:linear-gradient(110deg,#f5f8ec 0%,#f0f4e9 58%,#f3f4e8 100%);
  box-shadow:0 4px 15px rgba(27,65,39,.055);
  transition:transform .2s,box-shadow .2s;
}
.ek-subcats.trend-exact-subcats .subcategory-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 23px rgba(27,65,39,.09);
}
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-cloths{
  background:linear-gradient(106deg,#f5f8eb 0%,#eff5e8 48%,#e8f0e4 100%);
}
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-brushes{
  background:linear-gradient(112deg,#f8f7ef 0%,#f1f5ec 56%,#eaf0e8 100%);
}
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-cleaners{
  background:linear-gradient(112deg,#f6f9f1 0%,#f0f5ee 62%,#eaf2ec 100%);
}
/* Soft blend instead of white rectangular image boundaries. */
.ek-subcats.trend-exact-subcats .subcategory-card::after{
  content:"";
  display:block;
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,
    rgba(246,249,240,1) 0%,
    rgba(246,249,240,.95) 29%,
    rgba(246,249,240,.56) 44%,
    rgba(246,249,240,.03) 67%,
    transparent 84%);
}
.ek-subcats.trend-exact-subcats .subcategory-card img{
  display:block;
  position:absolute;
  top:0;right:0;
  height:100%;
  width:56%;
  max-width:none;
  margin:0;
  padding:11px 12px 9px 12px;
  object-fit:contain;
  object-position:center center;
  mix-blend-mode:multiply;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 100%);
  z-index:0;
  pointer-events:none;
}
/* The lifestyle cloth photo is horizontal: show it full-height instead of shrinking it. */
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-cloths img{
  width:61%;
  height:100%;
  padding:0;
  mix-blend-mode:normal;
  object-fit:cover;
  object-position:center center;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.82) 21%,#000 45%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.82) 21%,#000 45%);
}
/* Upright brush and cleaner images are not cropped at their tops and bottoms. */
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-brushes img,
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-cleaners img{object-fit:contain}
.ek-subcats.trend-exact-subcats .subcategory-card .subcopy{
  position:relative;
  z-index:2;
  max-width:56%;
  padding:22px 16px 17px 25px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
}
.ek-subcats.trend-exact-subcats .subcategory-card .subcopy .eyebrow{
  font-size:10px;
  letter-spacing:.09em;
  color:#3b784f;
  font-weight:850;
  margin-bottom:7px;
}
.ek-subcats.trend-exact-subcats .subcategory-card .subcopy strong{
  font:520 clamp(24px,2.4vw,30px)/1.04 Georgia,'Times New Roman',serif;
  letter-spacing:-.045em;
  color:#19432f;
  margin-bottom:12px;
}
.ek-subcats.trend-exact-subcats .subcategory-card .subcopy small{
  font-size:12px;
  line-height:1.3;
  color:#526f55;
}
.ek-subcats.trend-exact-subcats .subcategory-card .category-arrow{
  display:grid;
  place-items:center;
  width:37px;height:37px;
  margin-top:12px;
  background:#dbefb5;
  color:#235934;
  border-radius:50%;
  font-size:21px;
  line-height:1;
}

/* 4 — Make product names and purchase controls readable, keep native Woo. */
.trend-products-section.section{padding-top:27px;padding-bottom:10px}
.trend-products-section .section-head{margin-bottom:16px;align-items:end}
.trend-products-section .section-head h2{
  font-size:clamp(32px,3.3vw,43px);
  font-weight:520;
  letter-spacing:-.048em;
  line-height:1.06;
  margin:3px 0 0;
}
.trend-products-section .section-head .eyebrow{font-size:10px;color:#316d43;letter-spacing:.14em}
.trend-products-section .section-head .text-link{
  font-size:12.5px;
  font-weight:770;
  color:#17432e;
  margin-bottom:8px;
}
.trend-products-section .woocommerce ul.products,
.trend-products-section .ek-products ul.products{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  margin-bottom:10px!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card{
  min-height:205px!important;
  grid-template-columns:minmax(0,40%) minmax(0,60%)!important;
  border-radius:19px!important;
  background:#fffdfa!important;
  border-color:#e9e8de!important;
  box-shadow:0 5px 15px rgba(31,65,42,.05)!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-image{
  min-height:194px!important;
  padding:10px 5px 15px 9px!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-image img{
  height:141px!important;
  object-fit:contain!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-copy{
  padding:16px 11px 42px 5px!important;
  position:static!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-name{
  font-size:12.8px!important;
  line-height:1.32!important;
  -webkit-line-clamp:4!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-excerpt{display:none!important}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-bottom{
  position:absolute;
  left:16px;right:13px;bottom:13px;
  width:auto;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:7px!important;
  flex-wrap:nowrap!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-price{
  font-size:15.5px!important;
  font-weight:820!important;
  white-space:nowrap!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-add a.button{
  min-height:33px!important;
  min-width:116px!important;
  border-radius:30px!important;
  padding:7px 12px!important;
  font-size:10.5px!important;
  color:#1d5032!important;
  background:#e2f1b7!important;
}
.trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-add a.button::before{
  content:"";
  display:inline-block;
  width:14px;height:14px;
  flex:none;
  margin-right:5px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23265038' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 3 2 2h2l3 11h10l3-9H7'/%3E%3Ccircle cx='10' cy='21' r='1'/%3E%3Ccircle cx='18' cy='21' r='1'/%3E%3C/svg%3E") center / contain no-repeat;
}
.trend-products-section .ekshop-pagination{padding-top:15px}

/* Tablets and mobile remain independent of Ecover and all other pages. */
@media (min-width:741px) and (max-width:1180px){
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy{width:54%;padding:29px 26px 31px 32px}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy h1{font-size:clamp(43px,4.6vw,59px)}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-hero-visual{width:71%}
  .ek-subcats.trend-exact-subcats .subcategory-card .subcopy{padding:19px 11px 16px 18px}
  .ek-subcats.trend-exact-subcats .subcategory-card .subcopy strong{font-size:clamp(22px,2.3vw,28px)}
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-name{font-size:11.5px!important}
}
@media (max-width:740px){
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact{
    display:flex;flex-direction:column;align-items:stretch;min-height:0;height:auto;
  }
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact::after{display:none}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy{
    order:1;width:100%;max-width:none;padding:26px 23px 19px;
  }
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy h1{
    font-size:clamp(40px,9vw,52px);margin-bottom:13px;
  }
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy p{font-size:14px;line-height:1.52}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-hero-visual{
    position:relative;inset:auto;order:2;width:100%;height:205px;
  }
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .btn.primary.trend-cta{
    min-height:47px;padding:11px 19px;font-size:13px;
  }
  .brand-hero.trend-exact + .ek127-brand-filter-wrap{margin-top:9px}
  .ek-subcats.trend-exact-subcats.section{padding-top:15px}
  .ek-subcats.trend-exact-subcats .subcategory-grid{grid-template-columns:1fr!important;gap:12px}
  .ek-subcats.trend-exact-subcats .subcategory-card{min-height:164px}
  .ek-subcats.trend-exact-subcats .subcategory-card .subcopy{max-width:56%;padding:18px 14px 14px 19px}
  .ek-subcats.trend-exact-subcats .subcategory-card .subcopy strong{font-size:26px}
  .ek-subcats.trend-exact-subcats .subcategory-card img{width:55%}
  .trend-products-section.section{padding-top:19px}
  .trend-products-section .section-head h2{font-size:28px}
  .trend-products-section .woocommerce ul.products{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .trend-products-section .woocommerce ul.products li.product.ek-product-card{
    display:flex!important;flex-direction:column!important;min-height:0!important;
  }
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-image{
    min-height:123px!important;padding:8px 10px!important;
  }
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-image img{height:113px!important}
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-copy{padding:8px 10px 50px!important}
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-bottom{
    left:10px;right:10px;bottom:11px;flex-wrap:wrap!important;
  }
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-add a.button{
    min-width:0!important;font-size:10px!important;padding:7px 9px!important;
  }
}

@media (max-width:355px){
  .trend-products-section .woocommerce ul.products{grid-template-columns:1fr!important}
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-image{min-height:150px!important}
  .trend-products-section .woocommerce ul.products li.product.ek-product-card .ek-product-image img{height:138px!important}
}


/* EKOTEKS v12.14 — approved mint/blue cloth banner and supplied category images.
 * Visual patch only for Trend Active; no product/price/cart modifications. */
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact{
  min-height:282px;
  border:1px solid #e0e8d9;
  border-radius:25px;
  background:linear-gradient(108deg,#eff7e9 0%,#eaf3e8 68%,#f6f5ee 100%);
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-hero-visual{
  width:69%;
  background:linear-gradient(100deg,#f0f7e9,#f3f4ec);
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-hero-visual img{
  object-position:right center;
  object-fit:cover;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact::after{
  background:linear-gradient(90deg,
    #eff7e9 0%,
    rgba(239,247,233,.99) 22%,
    rgba(239,247,233,.93) 31%,
    rgba(239,247,233,.61) 39%,
    rgba(239,247,233,.13) 51%,
    transparent 66%);
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy{
  width:52%;padding:31px 35px 32px 43px;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy .eyebrow{
  display:block!important;
  margin:0 0 13px;
  font-size:10px;
  letter-spacing:.15em;
  font-weight:850;
  color:#3b7836;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy h1{
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(43px,4.4vw,62px);
  line-height:1.04;
  letter-spacing:-.052em;
  margin:0 0 15px;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy p{
  font-size:14px;line-height:1.5;max-width:440px;margin:0 0 20px;
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .btn.primary.trend-cta{
  min-height:46px;padding:11px 23px;font-size:13px;
  background:linear-gradient(115deg,#49ad14 0%,#18870f 100%);
  box-shadow:0 9px 20px rgba(38,118,28,.17);
}
.brand-hero.ek-simple-brand.is-photo.trend.trend-exact .btn.primary.trend-cta:hover{
  background:linear-gradient(115deg,#59b923 0%,#249a1b 100%);
}
/* The first tile uses the original user-supplied mint-blue textile product photo. */
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-cloths img{
  width:61%;height:100%;padding:0;object-fit:cover;object-position:center center;
  mix-blend-mode:multiply;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%,rgba(0,0,0,.8) 28%,#000 53%);
  mask-image:linear-gradient(90deg, transparent 0%,rgba(0,0,0,.8) 28%,#000 53%);
}
/* Supplied white Sanira cleaning kit for Valikliai, with the full kit visible. */
.ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-cleaners img{
  width:62%;height:100%;padding:4px 7px 4px 0;
  object-fit:contain;object-position:right center;
  mix-blend-mode:multiply;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%,rgba(0,0,0,.86) 25%,#000 48%);
  mask-image:linear-gradient(90deg, transparent 0%,rgba(0,0,0,.86) 25%,#000 48%);
}
@media(min-width:741px) and (max-width:1180px){
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy{width:54%;padding:26px 24px 27px 31px}
}
@media(max-width:740px){
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact{display:flex;flex-direction:column;min-height:0;height:auto}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy{width:100%;padding:25px 23px 19px}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy .eyebrow{margin-bottom:10px}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-copy h1{font-size:clamp(38px,9vw,49px)}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact .brand-hero-visual{position:relative;inset:auto;width:100%;height:210px}
  .brand-hero.ek-simple-brand.is-photo.trend.trend-exact::after{display:none!important}
  .ek-subcats.trend-exact-subcats .subcategory-card.trend-tile-cleaners img{width:59%}
}