/* Soel ana sayfa vitrini. Fotoğraflar WordPress ortam kitaplığındadır. */
.soel-storefront {
  --soel-buta-photo: url("soel-buta.webp");
  --soel-king-photo: url("soel-narkotik-king.webp");
  --soel-narkotik-photo: url("soel-narkotik.webp");
  --soel-mega-photo: url("soel-mega-lux.webp");
  --soel-rana-photo: url("soel-rana.webp");
  --soel-love-photo: url("soel-love-gift.webp");
  --soel-king-outline: polygon(62.3% 34.7%, 67% 34.4%, 73.3% 34.4%, 77.3% 35%, 78.5% 36.3%, 78.2% 37.8%, 76.5% 40%, 75.6% 41%, 75.6% 43.7%, 78.8% 44.5%, 81.1% 46.2%, 81.2% 65.1%, 79.7% 67.1%, 79.3% 68.1%, 81.1% 70.5%, 81% 72.6%, 79.7% 74%, 60.4% 74%, 58.7% 73.3%, 58.4% 71.6%, 59.2% 69.7%, 60.3% 68.1%, 60.2% 67.2%, 58.2% 65.4%, 58.2% 46.7%, 59.5% 45.2%, 62.1% 44.2%, 63.5% 43.5%, 63.4% 41%, 61.6% 39.1%, 61.2% 37%, 61.6% 35.7%);
  --soel-love-outline: polygon(12.7% 51.3%, 15% 50.5%, 18% 50.3%, 25% 50.3%, 28.7% 51%, 29.7% 51.7%, 28.2% 53.7%, 26.2% 55.6%, 25.4% 56.3%, 26.1% 58%, 26.3% 60.3%, 28.8% 60.7%, 31.4% 63.4%, 31.2% 66%, 28.4% 87.2%, 27.5% 87.8%, 14.5% 87.8%, 13.6% 87.1%, 9.5% 65.2%, 9.6% 62.6%, 12.3% 61%, 15.5% 60.4%, 15.6% 58.4%, 15.5% 56.9%, 14.2% 55.4%, 13.4% 53.6%);
}

.soel-storefront .hero,
.soel-storefront .category-grid .category-card {
  isolation: isolate;
}

.soel-storefront .hero-image {
  object-position: center 62%;
}

.soel-storefront .hero-shade {
  background: linear-gradient(90deg, #f8ecdded 0%, #f8ecddbf 34%, #f8ecdd00 61%);
}

.soel-storefront .hero.soel-campaign::before,
.soel-storefront .hero.soel-campaign::after,
.soel-storefront .category-grid .category-card.soel-campaign::before,
.soel-storefront .category-grid .category-card.soel-campaign::after,
.soel-storefront .category-grid .category-card.soel-campaign > div::after {
  content: "";
  position: absolute;
  top: auto;
  right: auto;
  width: auto;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
}

.soel-storefront .hero.soel-campaign::before {
  z-index: 1;
  left: 59%;
  bottom: 12%;
  height: 63%;
  aspect-ratio: 1;
  transform: translateX(-50%);
  background-image: var(--soel-buta-photo);
  background-size: contain;
  filter: drop-shadow(12px 12px 11px #40250e36);
}

.soel-storefront .hero.soel-campaign::after {
  z-index: 1;
  left: 77%;
  bottom: 12%;
  height: 179%;
  aspect-ratio: 650 / 920;
  transform: translate(-69.8%, 26%);
  clip-path: var(--soel-king-outline);
  background-image: var(--soel-king-photo);
  background-size: 100% 100%;
}

.soel-storefront .hero-content,
.soel-storefront .hero-index {
  z-index: 2;
}

.soel-storefront .category-grid .category-card img {
  object-position: center 84%;
}

.soel-storefront .category-grid .soel-mega-card img { object-position: 83% center; }

.soel-storefront .category-grid .category-card.soel-campaign::before {
  z-index: 1;
  left: 55%;
  bottom: 12%;
  height: 59%;
  aspect-ratio: 1;
  transform: translateX(-50%);
  background-size: contain;
  filter: drop-shadow(5px 8px 7px #29171342);
}

.soel-storefront .category-grid .category-light.soel-campaign::before { background-image: var(--soel-rana-photo); }
.soel-storefront .category-grid .category-dark.soel-campaign::before { background-image: var(--soel-narkotik-photo); }

.soel-storefront .category-grid .category-card.soel-campaign::after {
  z-index: 3;
  left: 70%;
  bottom: 10%;
  background-size: 100% 100%;
}

.soel-storefront .category-grid .category-light.soel-campaign::after {
  height: 143%;
  aspect-ratio: 613 / 920;
  transform: translate(-20.4%, 12.2%);
  clip-path: var(--soel-love-outline);
  background-image: var(--soel-love-photo);
}

.soel-storefront .category-grid .category-dark.soel-campaign::after {
  height: 151%;
  aspect-ratio: 650 / 920;
  transform: translate(-69.8%, 26%);
  clip-path: var(--soel-king-outline);
  background-image: var(--soel-king-photo);
}

.soel-storefront .category-grid .category-card.soel-campaign > div {
  min-height: inherit;
  background: linear-gradient(90deg, #f8e5dfd9 0%, #f8e5df9c 28%, transparent 56%);
}

.soel-storefront .category-grid .category-dark.soel-campaign > div {
  background: linear-gradient(90deg, #1c110cf0 0%, #1c110c70 35%, transparent 58%);
}

.soel-storefront .category-grid .category-card.soel-campaign > div::after {
  z-index: 1;
  left: 87%;
  bottom: 11%;
  height: 48%;
  aspect-ratio: 1;
  transform: translateX(-50%);
  background-size: contain;
  filter: drop-shadow(5px 8px 7px #2917134d);
}

.soel-storefront .category-grid .category-light.soel-campaign > div::after { background-image: var(--soel-buta-photo); }
.soel-storefront .category-grid .category-dark.soel-campaign > div::after { background-image: var(--soel-mega-photo); }
.soel-storefront .category-grid .category-card.soel-campaign > div > * { position: relative; z-index: 2; }
.soel-storefront .category-grid .category-card h2 { max-width: 48%; font-size: clamp(25px, 2.7vw, 40px); }

@media (min-width: 768px) and (max-width: 1023px) {
  .soel-storefront .hero :is(h1,.soel-hero-title) { max-width: 43%; font-size: clamp(44px, 6.3vw, 64px); }
  .soel-storefront .hero.soel-campaign::before { left: 62%; height: 52%; }
  .soel-storefront .hero.soel-campaign::after { left: 80%; height: 151%; }
}

@media (max-width: 767px) {
  .soel-storefront .hero.soel-campaign { height: 550px; }
  .soel-storefront .hero.soel-campaign .hero-image { object-position: 66% 50%; }
  .soel-storefront .hero-shade {
    background: linear-gradient(180deg, #faeee3ed 0%, #faeee3a6 31%, transparent 64%);
  }
  .soel-storefront .hero-content { padding: 29px 0 0; text-align: center; }
  .soel-storefront .hero :is(h1,.soel-hero-title) { max-width: none; font-size: clamp(39px, 10vw, 57px); letter-spacing: -1.4px; }
  .soel-storefront .hero .eyebrow { margin-bottom: 12px; }
  .soel-storefront .hero-description { max-width: 310px; margin: 13px auto 15px; }
  .soel-storefront .hero-footnote,
  .soel-storefront .hero-index { display: none; }
  .soel-storefront .hero.soel-campaign::before { left: 35%; bottom: 11%; height: 44%; }
  .soel-storefront .hero.soel-campaign::after { left: 66%; bottom: 11%; height: 129%; }

  .soel-storefront .category-grid .category-card { min-height: clamp(365px, 108vw, 455px); }
  .soel-storefront .category-grid .category-card.soel-campaign > div { padding: 23px 23px 0; }
  .soel-storefront .category-grid .category-card h2 { max-width: none; font-size: clamp(27px, 7.5vw, 37px); }
  .soel-storefront .category-grid .category-card .eyebrow { margin-bottom: 8px; }
  .soel-storefront .category-grid .category-card span { margin-top: 8px; min-height: 27px; }
  .soel-storefront .category-grid .category-card.soel-campaign::before { left: 23%; height: 47%; bottom: 12%; }
  .soel-storefront .category-grid .category-card.soel-campaign::after { left: 50%; bottom: 10%; }
  .soel-storefront .category-grid .category-light.soel-campaign::after { height: 132%; }
  .soel-storefront .category-grid .category-dark.soel-campaign::after { height: 132%; }
  .soel-storefront .category-grid .category-card.soel-campaign > div::after { left: 78%; bottom: 11%; height: 43%; }
  .soel-storefront .category-grid .category-card.soel-campaign > div {
    background: linear-gradient(180deg, #f8e5dfeb 0%, #f8e5df99 27%, transparent 58%);
  }
  .soel-storefront .category-grid .category-dark.soel-campaign > div {
    background: linear-gradient(180deg, #1c110ced 0%, #1c110c70 35%, transparent 65%);
  }
  .soel-catalog-categories { flex-wrap: wrap; overflow: visible; }
}

@media (max-width: 420px) {
  .soel-storefront .hero.soel-campaign::before { bottom: 9.5%; height: 38%; }
  .soel-storefront .hero.soel-campaign::after { bottom: 9.5%; height: 100%; }
}