/* Filterstore v7 — iOS-inspired controls, NOT skeuomorphic gloss. */
:root {
  --ios-blue: #1766DC;
  --ios-blue-hover: #125AC8;
  --ios-blue-pressed: #104FAF;
  --ios-text: #17273C;
  --ios-outline: rgba(161,183,211,.60);
  --ios-glass: rgba(255,255,255,.72);
  --ios-ease: cubic-bezier(.25,.1,.25,1);
}

/* Each interactive surface has the same optical proportions. */
.button,
.whatsapp-link,
.category-pill,
.icon-button,
.qty button,
.mobile-menu {
  -webkit-appearance: none;
  appearance: none;
  font-family: inherit;
  font-weight: 650 !important;
  letter-spacing: -.012em;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .22s var(--ios-ease), border-color .22s var(--ios-ease),
    color .22s var(--ios-ease), box-shadow .22s var(--ios-ease), transform .22s var(--ios-ease) !important;
}
.button {
  min-height: 44px;
  padding: 11px 19px;
  border-radius: 14px !important;
  font-size: 13px !important;
  line-height: 1.35;
  gap: 9px;
  text-shadow:none !important;
  isolation:isolate;
}
.button::before,
.button::after,
.cart-trigger::before,
.cart-trigger::after,
.glossy-button::before,
.glossy-button::after,
.footer-wa-button::before,
.footer-wa-button::after {
  content: none !important;
  display: none !important;
}
/* Primary action: a flat, luminous blue — no beveled edge or gradient stripe. */
.button-primary,
.product-details .button-primary,
.drawer-foot .button-primary,
#submitOrder.button-primary,
.button-primary.glossy-button {
  background: var(--ios-blue) !important;
  color: #fff !important;
  border: 1px solid rgba(19,92,207,.56) !important;
  box-shadow: 0 2px 5px rgba(14,72,166,.12), 0 7px 18px rgba(16,76,166,.13) !important;
}
.button-primary:hover,
.product-details .button-primary:hover,
.drawer-foot .button-primary:hover,
#submitOrder.button-primary:hover {
  background: var(--ios-blue-hover) !important;
  box-shadow: 0 4px 8px rgba(14,72,166,.12), 0 10px 20px rgba(16,76,166,.16) !important;
  transform: translateY(-1px);
}
.button-primary:active,
.product-details .button-primary:active {
  background: var(--ios-blue-pressed) !important;
  box-shadow: 0 2px 6px rgba(16,76,166,.12) !important;
  transform: scale(.98);
}
/* White material with a hairline edge; blur is contained to actual controls. */
.button-outline,
.whatsapp-link,
.icon-button,
.mobile-menu {
  background: rgba(255,255,255,.75) !important;
  color: #244566 !important;
  border: 1px solid var(--ios-outline) !important;
  box-shadow: 0 1px 2px rgba(31,61,100,.035), 0 5px 14px rgba(24,63,110,.055) !important;
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
}
.button-outline:hover,
.whatsapp-link:hover,
.icon-button:hover,
.mobile-menu:hover {
  background: rgba(242,248,255,.94) !important;
  border-color: rgba(135,171,214,.82) !important;
  box-shadow: 0 2px 7px rgba(31,61,100,.09) !important;
  transform: translateY(-1px);
}
.button-outline:active,
.whatsapp-link:active,
.icon-button:active {
  transform: scale(.98);
  background: rgba(225,236,250,.96) !important;
}
.button-large { min-height: 50px; padding: 14px 22px; font-size: 14px !important; border-radius:16px !important; }
.whatsapp-link { display:inline-flex; min-height:44px; align-items:center; border-radius:13px; padding:10px 15px; font-size:13px; font-weight:650; }

/* Cart is a restrained floating-glass control, not a shiny blue pill. */
.cart-trigger.button-primary,
.cart-trigger.button-primary:hover,
.cart-trigger.button-primary:active {
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:47px;
  padding:10px 14px;
  border-radius:15px !important;
  font-size:13px !important;
  color:#1352A0 !important;
  border:1px solid rgba(143,178,220,.57) !important;
  background:rgba(229,239,253,.76) !important;
  box-shadow: 0 2px 4px rgba(25,73,134,.035),0 7px 22px rgba(29,76,139,.09) !important;
  backdrop-filter:blur(20px) saturate(155%);
  -webkit-backdrop-filter:blur(20px) saturate(155%);
}
.cart-trigger.button-primary:hover {
  background:rgba(212,230,253,.88) !important;
  border-color:rgba(116,157,210,.7) !important;
  transform:translateY(-1px);
}
.cart-trigger.button-primary:active { background:rgba(203,223,249,.95) !important; transform:scale(.98); }
.cart-vector {display:block;flex-shrink:0;transition:transform .22s var(--ios-ease)}
.cart-trigger:hover .cart-vector {transform:translateY(-1px)}
.cart-label {white-space:nowrap}
.cart-count {
  display:inline-flex;align-items:center;justify-content:center;
  min-width:22px;height:22px;padding:0 5px;
  color:#1252A4;
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(137,174,223,.4) !important;
  border-radius:8px;
  font-size:11px;font-weight:700;
}
/* Category filters behave like iOS segmented chips. */
.category-pill {
  min-height:39px;
  padding:9px 15px;
  border-radius:999px;
  font-size:12px;
  color:#4d637c;
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(199,214,234,.8) !important;
  box-shadow:none !important;
}
.category-pill:hover {background:#eef5ff !important;color:#1a549e;border-color:#b9cfe9 !important}
.category-pill.active,
.category-pill.active:hover {
  background:var(--ios-blue) !important;
  color:white !important;
  border-color:var(--ios-blue) !important;
  box-shadow:0 3px 10px rgba(23,102,220,.14) !important;
}
/* Fine-grained controls. */
.icon-button {width:42px;height:42px;border-radius:13px;font-weight:450 !important;}
.qty button {width:32px;height:32px;border-radius:10px;font-size:17px;font-weight:500 !important;background:rgba(235,242,252,.85);color:#24558b;border:1px solid rgba(190,211,237,.5);}
.qty button:hover {background:rgba(217,233,255,.96)}
#loadMore.button-outline {min-width:186px}
.product-details .button {font-size:12px !important;min-height:43px;border-radius:12px !important}
/* Dark section: the WhatsApp CTA should look like a soft frosted sheet. */
.footer-wa-button.button-primary,
.footer-wa-button.button-primary:hover {
  color:#eaf4ff !important;
  background:rgba(218,234,255,.12) !important;
  border:1px solid rgba(198,221,255,.29) !important;
  box-shadow:0 6px 14px rgba(4,15,34,.09) !important;
  backdrop-filter:blur(18px) saturate(135%);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
}
.footer-wa-button.button-primary:hover {background:rgba(218,234,255,.2) !important;border-color:rgba(198,221,255,.44) !important}
/* Remove costly unneeded blurred cards; glass stays focused on controls. */
.product-card,.help-card,.benefit-grid>div,.delivery-main,.delivery-side,.about-panels>div {
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
/* Keyboard and accessibility, including low-motion preference. */
.button:focus-visible,.cart-trigger:focus-visible,.whatsapp-link:focus-visible,
.category-pill:focus-visible,.icon-button:focus-visible,.qty button:focus-visible {
  outline:3px solid rgba(53,129,239,.68) !important;
  outline-offset:3px;
}
.button:disabled,.category-pill:disabled {opacity:.5;cursor:not-allowed;transform:none !important;box-shadow:none !important;}
@media(max-width:720px){
  .cart-trigger.button-primary {min-width:52px;min-height:46px;padding:10px 12px;gap:6px;}
  .cart-label {display:none;}
  .cart-vector{width:21px;height:21px;}
  .button-large{min-height:48px;}
  .whatsapp-link{min-height:44px;}
}
@media(prefers-reduced-motion:reduce){
  .button,.cart-trigger,.whatsapp-link,.category-pill,.icon-button,.qty button{transition:none!important;animation:none!important;transform:none!important}
}


/* v17: Photo-first hero. Tall enough for the portrait product composition,
   with no stretching, cropping or decorative overlays across the machines. */
.hero .hero-visual {
  min-height: 605px;
  padding: 12px 0 55px;
  align-content: center;
}
.hero .product-spotlight {
  width: min(100%, 530px);
  height: auto;
  aspect-ratio: 1209 / 1301;
  max-height: 575px;
  border-radius: 30px;
  background: #f8fbff;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(205,221,238,.9);
  box-shadow: 0 22px 64px rgba(28,66,108,.12), 0 5px 14px rgba(19,49,86,.04);
}
.hero .product-spotlight::before,
.hero .product-spotlight::after {display:none;}
.hero .product-spotlight img[src*="hero-machines-owner-v16"],
.hero .product-spotlight img.hero-owner-v16 {
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  display:block;
  padding: 0 !important;
  transform:none !important;
  mix-blend-mode:normal !important;
  filter:none !important;
}
.hero .spotlight-tag {
  top: 14px;
  left: 14px;
  z-index: 3;
  color: #415d7c;
  font-size: 11px;
  font-weight: 750;
  background: rgba(255,255,255,.93);
  border: 1px solid rgba(218,230,245,.9);
  border-radius: 999px;
  padding: 7px 12px;
  box-shadow: 0 5px 15px rgba(25,56,90,.06);
}
.hero .spotlight-footer {display:none;}
.hero .floating-benefits {
  left: auto;
  right: 8px;
  bottom: 8px;
  padding: 14px 18px;
  border-radius: 18px;
  box-shadow: 0 12px 33px rgba(27,57,88,.10);
}
@media (max-width: 1024px) {
  .hero .hero-visual {min-height: 0; padding: 10px 0 55px;}
  .hero .product-spotlight {width:100%;height:auto;aspect-ratio:1209/1301;max-height:none;}
  .hero .floating-benefits {left:auto;right:4px;bottom:4px;}
}
@media (max-width: 720px) {
  .hero .hero-visual {display:flex;flex-direction:column;align-items:center;min-height:0;padding:0;gap:0;}
  .hero .hero-visual-glow {inset:0;}
  .hero .product-spotlight {width:100%;height:auto;aspect-ratio:1209/1301;max-height:none;border-radius:26px;}
  .hero .spotlight-tag {top:12px;left:12px;font-size:10px;padding:6px 10px;}
  .hero .floating-benefits {
    position:relative;
    left:auto;right:auto;bottom:auto;
    width:calc(100% - 24px);
    margin-top:-22px;
    padding:12px 16px;
    z-index:4;
  }
}