/* Qish mavsumi: muzrang fon, qor qahramon va katalog orqa qatlamida. */
:root { --gold: #8ebbc5; --cream: #edf5f6; }
body { background: #f4f9fa; }
header {
  z-index: 15;
  background: rgba(242, 250, 252, .96);
  border-bottom-color: #c7dfe4;
  box-shadow: 0 5px 24px rgba(48, 91, 101, .09);
}
.hero {
  background: radial-gradient(ellipse at 82% 20%, #ffffff 0, rgba(255,255,255,.2) 34%, transparent 55%),
              linear-gradient(118deg, #dceef2 0%, #f5f9f7 48%, #d7e9ed 100%) !important;
}
body.page-home .hero {
  background: radial-gradient(ellipse at 82% 18%, #ffffff 0, rgba(255,255,255,.42) 30%, transparent 54%),
              linear-gradient(118deg, #deeff2 0%, #f5f9f7 48%, #d5e8ed 100%) !important;
}
.hero-grid { position: relative; z-index: 1; }
.winter-snow {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: .66;
  background: url("winter-snow.svg") repeat;
  background-size: 280px 320px;
  animation: winter-fall 15s linear infinite;
}
.winter-snow::before,
.winter-snow::after {
  content: "";
  position: absolute;
  inset: -440px 0 0;
  background: url("winter-snow.svg") repeat;
  background-size: 390px 440px;
  opacity: .72;
  animation: winter-fall-slow 23s linear infinite;
}
.winter-snow::after {
  inset: -240px 0 0;
  background-size: 210px 240px;
  opacity: .46;
  animation: winter-fall-fast 11s linear infinite;
}
#products {
  background-color: #eff7f8;
  background-image: url("winter-snow.svg"), linear-gradient(180deg, #eff7f8, #f9fcfc);
  background-repeat: repeat, no-repeat;
  background-size: 360px 410px, 100% 100%;
  background-position: 0 0, 0 0;
  animation: winter-groundfall 36s linear infinite;
}
.card, .horeca-card, .info-card {
  border-color: #d6e6e9;
  background-color: #fbfeff;
  box-shadow: 0 7px 22px rgba(63, 107, 116, .075);
}
.card img { background: linear-gradient(180deg, #f7fbfc, #e7f1f3); }
.product-image-trigger {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
  touch-action: manipulation;
}
.product-image-trigger:focus-visible { outline: 3px solid #5c8f98; outline-offset: -3px; }
.product-lightbox {
  width: min(94vw, 1000px);
  max-width: none;
  max-height: 94vh;
  padding: 48px 16px 16px;
  border: 1px solid #d6e6e9;
  border-radius: 18px;
  background: #f7fbfc;
  box-shadow: 0 24px 80px rgba(10, 32, 37, .38);
  overflow: auto;
}
.product-lightbox::backdrop { background: rgba(13, 26, 31, .82); }
.product-lightbox img {
  display: block;
  width: 100%;
  max-height: calc(94vh - 76px);
  object-fit: contain;
  border-radius: 10px;
}
.product-lightbox-close {
  position: absolute;
  top: 9px;
  right: 10px;
  width: 36px;
  height: 36px;
  border: 1px solid #c9dce0;
  border-radius: 50%;
  color: #273d41;
  background: #fff;
  font: 26px/1 sans-serif;
  cursor: pointer;
}
.info, .business-promo { background: linear-gradient(180deg, #edf5f6, #f9fcfc); }
@keyframes winter-fall { to { background-position: 0 320px; } }
@keyframes winter-fall-slow { to { background-position: 0 440px; } }
@keyframes winter-fall-fast { to { background-position: 0 240px; } }
@keyframes winter-groundfall { to { background-position: 0 410px, 0 0; } }
@media (max-width: 600px) { .winter-snow { opacity: .58; } }
@media (prefers-reduced-motion: reduce) {
  .winter-snow,
  .winter-snow::before,
  .winter-snow::after,
  #products { animation: none; }
}