/* Polish pass: header / mega / hero / cats / products / columns */

/* ===== Header polish 1366–1440 ===== */
@media (min-width: 1200px) {
  body.xl-redesign .xl-wrap {
    /* width neutralized -> xl-unity */ width: 100% !important; max-width: var(--xl-shell-max, 1400px) !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  body.xl-redesign .xl-brandrow .xl-wrap {
    gap: 28px !important;
    min-height: 96px !important;
  }
  body.xl-redesign .xl-perks {
    gap: 24px !important;
  }
  body.xl-redesign .xl-navrow .xl-wrap {
    gap: 20px !important;
    min-height: 68px !important;
  }
  body.xl-redesign .xl-menu {
    gap: 22px !important;
  }
  body.xl-redesign .xl-phone-block {
    padding-right: 24px !important;
  }
  body.xl-redesign .xl-actions {
    gap: 10px !important;
  }
}
@media (min-width: 1440px) {
  body.xl-redesign .xl-brandrow .xl-wrap {
    gap: 32px !important;
  }
  body.xl-redesign .xl-perks {
    gap: 28px !important;
  }
}

/* 16+ always visible in desktop header */
body.xl-redesign .xl-age--header {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: var(--xl-graphite-900) !important;
  color: #fff !important;
  font-weight: 800;
}

/* Catalog is button-only — never looks like a link jump */
body.xl-redesign button.xl-catalog {
  cursor: pointer;
}
body.xl-redesign button.xl-catalog.is-open {
  background: var(--xl-graphite-800) !important;
  box-shadow: inset 0 0 0 2px rgba(232, 102, 34, .6);
}

/* ===== Mega menu polish ===== */
body.xl-redesign .xl-nav__panel-inner {
  border-radius: 0 0 20px 20px !important;
  box-shadow: 0 28px 60px rgba(23, 21, 19, 0.28) !important;
}
body.xl-redesign .xl-nav__featured {
  padding: 26px 26px 22px !important;
}
body.xl-redesign .xl-nav__cards {
  gap: 12px !important;
}
body.xl-redesign .xl-nav__card {
  min-height: 140px !important;
  padding: 16px 10px 14px !important;
  border-radius: 16px !important;
}
body.xl-redesign .xl-nav__card img {
  width: 78px !important;
}
body.xl-redesign .xl-nav__cols {
  padding: 26px 22px !important;
  gap: 12px 20px !important;
}
body.xl-redesign .xl-nav__links a {
  padding: 10px 12px !important;
  font-size: 14px !important;
}
body.xl-redesign .xlopni-nav__overlay {
  backdrop-filter: blur(3px);
  background: rgba(23, 21, 19, 0.55) !important;
}

/* ===== Hero: emotional first screen ===== */
body.xl-redesign .xl-hero {
  position: relative;
  margin: 0 0 28px !important;
  padding: 48px 48px 48px !important;
  min-height: 320px !important;
  border-radius: 20px !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  background-color: #171513 !important;
  background-image:
    linear-gradient(105deg, rgba(23,21,19,.92) 0%, rgba(23,21,19,.72) 42%, rgba(23,21,19,.35) 100%),
    url("/images/sparkler-677774_1280.jpg") !important;
  background-size: cover !important;
  background-position: center right !important;
  box-shadow: 0 16px 40px rgba(23, 21, 19, 0.18);
}
body.xl-redesign .xl-hero__eyebrow {
  font-size: 13px !important;
  letter-spacing: 0.1em !important;
  color: #f0d59a !important;
}
body.xl-redesign .xl-hero__title {
  max-width: 680px !important;
  font-size: 42px !important;
  line-height: 1.1 !important;
  margin: 0 0 14px !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
body.xl-redesign .xl-hero__text {
  max-width: 540px !important;
  font-size: 16px !important;
  margin: 0 0 24px !important;
  color: rgba(255,255,255,.9) !important;
}
body.xl-redesign .xl-hero__actions .xl-btn--primary {
  height: 48px !important;
  padding: 0 26px !important;
  font-size: 15px !important;
  background: var(--xl-orange-500) !important;
}
body.xl-redesign .xl-hero__actions .xl-btn--primary:hover {
  background: var(--xl-red-600) !important;
}
body.xl-redesign .xl-hero__actions .xl-btn--ghost {
  height: 48px !important;
  padding: 0 22px !important;
  border-color: rgba(255,255,255,.55) !important;
  color: #fff !important;
}

/* ===== Categories: larger, livelier ===== */
body.xl-redesign #icSet2.catalog,
body.xl-redesign table#icSet2 {
  gap: 16px !important;
  margin-bottom: 28px !important;
}
body.xl-redesign #icSet2 a {
  min-height: 176px !important;
  padding: 20px 12px 16px !important;
  border-radius: 16px !important;
  background:
    linear-gradient(180deg, #fff 0%, #faf7f2 100%) !important;
  border: 1px solid #ebe3d8 !important;
}
body.xl-redesign #icSet2 a:hover {
  background: #fff !important;
  border-color: rgba(232,102,34,.5) !important;
}
body.xl-redesign #icSet2 img {
  width: 96px !important;
  height: 96px !important;
  filter: drop-shadow(0 8px 14px rgba(32,29,26,.12));
  transition: transform .18s ease;
}
body.xl-redesign #icSet2 a:hover img {
  transform: scale(1.06) translateY(-2px);
}
body.xl-redesign #icSet2 span {
  font-size: 14px !important;
  font-weight: 800 !important;
}
/* hierarchy: first row / key cats a bit stronger via nth - optional accent on first 2 */
body.xl-redesign #icSet2 tr:first-child td:first-child a,
body.xl-redesign #icSet2 tr:first-child td:nth-child(2) a {
  box-shadow: 0 8px 22px rgba(232,102,34,.1) !important;
  border-color: rgba(232,102,34,.22) !important;
}

/* ===== Product cards: photo + price focus ===== */
body.xl-redesign .xl-product-grid .pageItem,
body.xl-redesign #content .page .pageItem {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}
@media (min-width: 1280px) {
  body.xl-redesign .xl-product-grid .pageItem,
  body.xl-redesign #content .page .pageItem {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
body.xl-redesign .xl-product-grid dl.itemNewProductsDefault,
body.xl-redesign #content .page .pageItem dl.itemNewProductsDefault {
  padding: 16px !important;
  border-radius: 18px !important;
}
body.xl-redesign .xl-product-grid dt.itemImage,
body.xl-redesign #content dl.itemNewProductsDefault dt.itemImage {
  aspect-ratio: 1 / 1 !important;
  min-height: 220px;
  margin-bottom: 14px !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #f3eee7, #fff) !important;
}
body.xl-redesign .xl-product-grid dt.itemImage img,
body.xl-redesign #content dl.itemNewProductsDefault dt.itemImage > a img {
  max-width: 92% !important;
  max-height: 92% !important;
}
body.xl-redesign .xl-product-grid dd.itemDescription > a,
body.xl-redesign #content dl.itemNewProductsDefault dd.itemDescription > a {
  font-size: 16px !important;
  min-height: 3.9em !important;
}
body.xl-redesign .xl-product-grid dd.itemDescriptionPrice,
body.xl-redesign #content dl.itemNewProductsDefault dd.itemDescriptionPrice {
  font-size: 24px !important;
  margin-top: 12px !important;
  color: var(--xl-graphite-950) !important;
}
body.xl-redesign .xl-product-grid dt.itemImage a.button,
body.xl-redesign #content dl.itemNewProductsDefault a.button {
  height: 40px !important;
  padding: 0 18px !important;
  border-radius: 10px !important;
  background: var(--xl-orange-500) !important;
}
body.xl-redesign .xl-product-grid dt.itemImage a.button:hover {
  background: var(--xl-red-600) !important;
}

/* ===== Left column: lighter ===== */
body.xl-redesign #left .boxStyle {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 10px !important;
}
body.xl-redesign #left .boxStyle p.hD,
body.xl-redesign #left .boxStyle h5 {
  height: 40px !important;
  padding: 0 12px !important;
  background: #f4f0ea !important;
  color: var(--xl-text) !important;
  font-size: 12px !important;
  letter-spacing: 0.04em;
  border: 1px solid var(--xl-line) !important;
  border-radius: 10px !important;
}
body.xl-redesign #left .boxStyle.active p.hD {
  background: #fff !important;
  box-shadow: inset 3px 0 0 var(--xl-orange-500);
  border-color: #e7ded3 !important;
}
body.xl-redesign #left .boxStyle p.hD a {
  color: var(--xl-text) !important;
}
body.xl-redesign #left .bPg {
  background: rgba(32,29,26,.08) !important;
}
body.xl-redesign #left .bPg::after {
  border-color: var(--xl-muted) !important;
}
body.xl-redesign #left .boxStyle > div,
body.xl-redesign #left .boxStyle .boxcontent {
  background: #fff !important;
  border: 1px solid var(--xl-line) !important;
  border-top: 0 !important;
  border-radius: 0 0 10px 10px !important;
  margin-top: -4px !important;
  padding: 6px 8px !important;
}
body.xl-redesign #left .boxStyle ul li {
  border-bottom-color: #f3eee7 !important;
}
body.xl-redesign #left .boxStyle ul li a,
body.xl-redesign #left #CatNavi li a {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  padding: 7px 8px !important;
  color: #4a453f !important;
}
body.xl-redesign #left #boxCategories p.hD {
  background: var(--xl-graphite-900) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.xl-redesign #left #boxCategories p.hD,
body.xl-redesign #left #boxCategories p.hD a {
  color: #fff !important;
}
body.xl-redesign #left #boxCategories .bPg {
  background: rgba(255,255,255,.15) !important;
}
body.xl-redesign #left #boxCategories .bPg::after {
  border-color: #fff !important;
}

/* ===== Right column: modern cards ===== */
body.xl-redesign #right .boxStyle,
body.xl-redesign #right #boxWhatsNew,
body.xl-redesign #right #boxBestsellers,
body.xl-redesign #right #boxReviews {
  margin: 0 0 14px !important;
  padding: 0 !important;
  border-radius: 16px !important;
  overflow: hidden;
  background: #fff !important;
  border: 1px solid var(--xl-line) !important;
  box-shadow: 0 6px 18px rgba(32,29,26,.05) !important;
}
body.xl-redesign #right .boxWhatsNewHeader,
body.xl-redesign #right #boxWhatsNew .boxWhatsNewHeader,
body.xl-redesign #right #boxBestsellers h5,
body.xl-redesign #right #boxReviews h5,
body.xl-redesign #right .boxStyle p.hD,
body.xl-redesign #right .boxStyle h5 {
  margin: 0 !important;
  padding: 0 14px !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  background: #fff !important;
  background-image: none !important;
  color: var(--xl-text) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--xl-line) !important;
  font-family: var(--xl-font-sans) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em;
  text-align: left !important;
  filter: none !important;
}
body.xl-redesign #right #boxWhatsNewContent,
body.xl-redesign #right #boxBestsellersContent,
body.xl-redesign #right #boxReviewsContent,
body.xl-redesign #right .boxStyle > div {
  padding: 12px 14px !important;
  background: #fff !important;
  border: 0 !important;
}
body.xl-redesign #right #boxWhatsNewContent img,
body.xl-redesign #right .boxStyle img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  margin: 0 auto 10px;
}
body.xl-redesign #right #boxWhatsNewContent a,
body.xl-redesign #right #boxBestsellersContent a,
body.xl-redesign #right #boxReviewsContent a {
  color: var(--xl-text) !important;
  font-weight: 700;
  text-decoration: none !important;
  font-size: 13px;
}
body.xl-redesign #right #boxWhatsNewContent a:hover,
body.xl-redesign #right #boxBestsellersContent a:hover {
  color: var(--xl-red-600) !important;
}
body.xl-redesign #right #boxBestsellersContent p {
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-size: 13px;
  line-height: 1.35;
}
body.xl-redesign #right #boxBestsellersContent .BestsellersContentRight {
  margin-bottom: 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #f0ebe4;
}
body.xl-redesign #right #boxBestsellersContent .BestsellersContentRight span {
  font-size: 15px;
  font-weight: 800;
  color: var(--xl-graphite-950);
}
body.xl-redesign #right .xl-svc {
  border-radius: 16px;
}
/* hide heavy VK widget in redesign right column */
body.xl-redesign #right #vk_groups {
  display: block !important;
}

/* Promo & trust spacing */
body.xl-redesign .xl-promo {
  margin-bottom: 28px !important;
}
body.xl-redesign .xl-trust__item {
  border-radius: 16px !important;
  padding: 18px !important;
}
body.xl-redesign .xl-section__title {
  font-size: 24px !important;
}

@media (max-width: 900px) {
  body.xl-redesign .xl-hero {
    min-height: 240px !important;
    padding: 28px 20px !important;
    background-position: center center !important;
  }
  body.xl-redesign .xl-hero__title {
    font-size: 28px !important;
  }
}
