/* DILSHOP v36 — спокойный минималистичный интерфейс и Ozon-first продажи. */
:root {
  --v36-ink: var(--heading-color, #101828);
  --v36-muted: var(--muted, #667085);
  --v36-soft: #f2f4f7;
  --v36-bg: var(--bg, #f8f9fb);
  --v36-line: var(--line, #e4e7ec);
  --v36-blue: var(--button-bg, #005bff);
  --v36-blue-hover: var(--button-hover-bg, #0047cc);
  --v36-shadow: 0 16px 42px rgba(16, 24, 40, .07);
}

html { scroll-behavior: smooth; }
body {
  background: var(--v36-bg) !important;
  color: var(--v36-ink) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
main { min-height: 58vh; }
a, button { transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease; }

.container { width: min(var(--container-width, 1240px), calc(100% - 40px)) !important; }
.section { padding-top: var(--section-spacing, 64px) !important; padding-bottom: 12px !important; }
.section-head,
.v30-section-head { align-items: flex-end !important; margin-bottom: 24px !important; }
.section-head h1,
.section-head h2,
.v30-section-head h2 {
  color: var(--v36-ink) !important;
  font-size: clamp(26px, 3vw, var(--font-h2-size, 42px)) !important;
  line-height: 1.08 !important;
  letter-spacing: -.035em !important;
  margin: 0 !important;
}
.section-head a,
.v30-section-head a { color: var(--v36-muted) !important; font-weight: 700 !important; }
.section-head a:hover,
.v30-section-head a:hover { color: var(--v36-blue) !important; }

/* Header */
.site-header.v30-header {
  background: var(--header-bg, #fff) !important;
  border-bottom: 1px solid var(--v36-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}
.v30-topbar { background: var(--topbar-bg, #101828) !important; color: var(--topbar-text, #fff) !important; }
.v30-topbar-inner { min-height: 36px !important; font-size: var(--font-topbar-size, 12px) !important; letter-spacing: .01em; }
.v30-topbar-left,
.v30-topbar-right { gap: 22px !important; }
.v30-iconline { color: var(--topbar-text, #fff) !important; font-weight: 600 !important; opacity:.84; }
.v30-iconline:hover { color: var(--topbar-text, #fff) !important; opacity:1; }
.v30-ico { color: #84adff !important; }
.v30-header-main {
  grid-template-columns: minmax(220px, 300px) minmax(280px, 1fr) auto !important;
  gap: 28px !important;
  min-height: 124px;
  padding: 12px 0 !important;
}
.v30-header-main.v38-header-main--ozon {
  grid-template-columns: minmax(220px, 300px) minmax(280px, 1fr) !important;
}
.logo.v30-logo {
  width: min(var(--header-logo-width, 280px), 100%) !important;
  min-height: 96px;
  justify-content: flex-start !important;
}
.logo.v30-logo img {
  width: 100% !important;
  height: 108px !important;
  max-width: var(--header-logo-width, 280px) !important;
  max-height: 108px !important;
  object-fit: contain !important;
  object-position: left center;
}
.v30-logo-fallback b { color: var(--v36-ink) !important; letter-spacing: -.03em !important; }
.v30-logo-fallback span { color: var(--v36-blue) !important; letter-spacing: .2em !important; }
.search.v30-search {
  min-height: 52px;
  background: #f9fafb !important;
  border: 1px solid var(--v36-line) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
.search.v30-search:focus-within { border-color: #98a2b3 !important; box-shadow: 0 0 0 4px rgba(152, 162, 179, .12) !important; }
.v30-search input { color: var(--v36-ink) !important; font-size: 15px !important; }
.v30-search button {
  background: var(--button-bg, var(--v36-ink)) !important;
  border-color: var(--button-bg, var(--v36-ink)) !important;
  border-radius: 11px !important;
  min-width: 92px;
}
.v30-search button:hover { background: var(--button-hover-bg, #344054) !important; }
.top-nav.v30-nav {
  min-height: 52px;
  align-items: center !important;
  gap: 30px !important;
  padding: 0 !important;
  border-top: 1px solid #f2f4f7;
  color: #344054 !important;
  font-size: var(--font-nav-size, 14px);
  font-weight: 700 !important;
}
.top-nav.v30-nav > a { padding: 16px 0 !important; }
.top-nav.v30-nav > a:hover { color: var(--v36-blue) !important; }
.v30-catalog-menu {
  min-width: auto !important;
  gap: 12px;
  background: transparent !important;
  color: var(--v36-ink) !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.v30-catalog-menu span:last-child { display: none; }

/* Buttons */
.btn,
.search button,
.cart-link {
  border-radius: var(--radius-button, 12px) !important;
  min-height: var(--button-height, 46px);
  padding-inline: var(--button-padding-x, 18px);
  font-size: var(--font-button-size, 13px);
  box-shadow: none !important;
}
.btn.primary { background: var(--button-bg, var(--v36-ink)) !important; border-color: var(--button-bg, var(--v36-ink)) !important; color:var(--button-text-color,#fff)!important; }
.btn.primary:hover { background: var(--button-hover-bg, #344054) !important; border-color: var(--button-hover-bg, #344054) !important; transform: translateY(-1px); }
.v36-ozon-button {
  min-height: var(--button-height, 46px) !important;
  gap: 10px;
  background: var(--v36-blue) !important;
  border: 1px solid var(--v36-blue) !important;
  color: var(--button-text-color, #fff) !important;
  font-size: var(--font-button-size, 13px) !important;
  font-weight: 800;
}
.v36-ozon-button:hover { background: var(--v36-blue-hover) !important; border-color: var(--v36-blue-hover) !important; transform: translateY(-1px); }
.v36-ozon-button.is-disabled { opacity: .55; pointer-events: none; background: #98a2b3 !important; border-color: #98a2b3 !important; }

/* New-arrivals carousel */
.v33-hero-shell { display: none !important; }
.v36-new-arrivals {
  padding: 54px 0 46px;
  background: #fff;
  border-bottom: 1px solid var(--v36-line);
}
.v36-arrivals-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.v36-arrivals-heading span { color: var(--v36-blue); font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.v36-arrivals-heading h1 { max-width: 720px; margin: 7px 0 0; font-size: clamp(32px, 5vw, var(--font-h1-size, 62px)); line-height: .98; letter-spacing: -.055em; }
.v36-carousel-controls { display: flex; gap: 8px; }
.v36-carousel-controls button {
  width: 48px;
  height: 48px;
  border: 1px solid var(--v36-line);
  border-radius: 50%;
  background: #fff;
  color: var(--v36-ink);
  font-size: 20px;
  cursor: pointer;
}
.v36-carousel-controls button:hover { border-color: var(--v36-ink); background: var(--v36-ink); color: #fff; }
.v36-carousel { position: relative; overflow: hidden; isolation: isolate; }
.v36-carousel .product-grid {
  display: flex !important;
  align-items: stretch;
  gap: 18px !important;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding: 2px 0 14px;
}
.v36-carousel .product-grid::before,
.v36-carousel .product-grid::after { content: none !important; display: none !important; }
.v36-carousel .product-grid::-webkit-scrollbar { display: none; }
.v36-carousel .product-card {
  flex: 0 0 calc((100% - 54px) / 4);
  min-width: 235px;
  scroll-snap-align: start;
}
.v36-all-products { display: inline-flex; gap: 8px; margin-top: 18px; color: var(--v36-ink); font-weight: 800; }
.v36-all-products:hover { color: var(--v36-blue); }

/* Product cards */
.product-grid.v26-product-grid,
.product-grid {
  gap: var(--grid-gap, 20px) !important;
}
.product-card.v26-product-card,
.product-card {
  overflow: hidden !important;
  background: var(--card, #fff) !important;
  border: 1px solid var(--v36-line) !important;
  border-radius: var(--radius-card, 18px) !important;
  box-shadow: none !important;
}
.product-card:hover { transform: translateY(-3px); border-color: #d0d5dd !important; box-shadow: var(--v36-shadow) !important; }
.product-img {
  display: block;
  aspect-ratio: var(--product-card-image-ratio, 3 / 4) !important;
  background: var(--v36-soft) !important;
  border-radius: 0 !important;
  overflow: hidden;
}
.product-img img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.product-badges { top: 12px !important; left: 12px !important; gap: 6px !important; }
.badge { border-radius: 999px !important; padding: 6px 9px !important; font-size: 10px !important; letter-spacing: .03em; box-shadow: none !important; }
.product-body { display: flex; flex-direction: column; min-height: 235px; padding: var(--product-card-padding, 18px) !important; }
.product-title {
  min-height: 44px;
  color: var(--v36-ink) !important;
  font-size: var(--font-product-title-size, 15px) !important;
  font-weight: 750 !important;
  line-height: 1.42 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.price-row { margin-top: auto !important; padding-top: 14px; }
.price-row b { color: var(--price-color, var(--v36-ink)) !important; font-size: var(--font-price-size, 22px) !important; letter-spacing: -.03em; }
.price-row span { color: #98a2b3 !important; }
.stock { font-size: 12px !important; font-weight: 700 !important; }
.stock.yes { color: var(--success-color, #067647) !important; }
.stock.no { color: #b42318 !important; }
.product-body .v36-ozon-button { margin-top: 12px; }

/* Categories and content cards */
.v30-categories { padding-top: 64px !important; }
.v30-category-grid { gap: 14px !important; }
.v30-category-card {
  background: #fff !important;
  border: 1px solid var(--v36-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}
.v30-category-card:hover { transform: translateY(-2px); border-color: #c7d7fe !important; box-shadow: var(--v36-shadow) !important; }
.v30-category-image { border-radius: 12px !important; background: var(--v36-soft) !important; }
.v30-category-image img { object-fit: cover !important; }
.v30-benefits { margin-top: 74px !important; padding: 64px 0 !important; background: #101828 !important; }
.v30-benefits-grid > div { background: transparent !important; border: 0 !important; color: #fff !important; padding: 0 22px !important; box-shadow: none !important; }
.v30-benefits-grid p { color: #98a2b3 !important; }
.v30-benefits-grid > div > span { color: #84adff !important; }
.article-card,
.post-card,
.tabs,
.checkout-form,
.success-box {
  background: #fff !important;
  border: 1px solid var(--v36-line) !important;
  border-radius: var(--radius-card, 18px) !important;
  box-shadow: none !important;
}

/* Product detail */
.product-detail { gap: clamp(28px, 5vw, 72px) !important; align-items: start; }
.gallery,
.product-info {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.gallery { position: sticky; top: 184px; }
.main-photo-button,
.main-photo,
.no-img.big {
  width: 100% !important;
  aspect-ratio: 3 / 4 !important;
  height: auto !important;
  border-radius: 18px !important;
  background: #fff !important;
  border: 1px solid var(--v36-line) !important;
  object-fit: contain !important;
}
.thumbs { gap: 9px !important; margin-top: 12px !important; }
.thumb-btn { width: 68px !important; height: 82px !important; border-radius: 10px !important; background: #fff !important; border: 1px solid var(--v36-line) !important; }
.thumb-btn.active { border-color: var(--v36-blue) !important; box-shadow: 0 0 0 2px rgba(0, 91, 255, .12) !important; }
.thumb-btn img { width: 100%; height: 100%; object-fit: cover; }
.product-info .eyebrow { color: var(--v36-muted) !important; font-size: 12px !important; text-transform: uppercase; letter-spacing: .08em; }
.product-info h1 { margin: 10px 0 18px !important; font-size: clamp(30px, 4vw, var(--font-h1-size, 52px)) !important; line-height: 1.03 !important; letter-spacing: -.045em !important; }
.big-price { color: var(--v36-ink) !important; font-size: clamp(30px, 3vw, 42px) !important; letter-spacing: -.04em; }
.big-price span { color: #98a2b3 !important; font-size: 16px !important; }
.v36-ozon-buybox { display: block !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
.v36-ozon-buybox .v36-ozon-button { width: 100%; min-height: var(--button-height, 46px) !important; font-size: var(--font-button-size, 13px) !important; }
.variants-box {
  margin-top: 30px !important;
  padding: 20px !important;
  background: #fff !important;
  border: 1px solid var(--v36-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}
.variants-head { margin-bottom: 14px !important; }
.variants-head b { color: var(--v36-ink) !important; font-size: 16px !important; }
.variants-head span { display: block; margin-top: 3px; color: var(--v36-muted) !important; font-size: 12px !important; }
.variant-strip { display: flex !important; gap: 10px !important; overflow-x: auto !important; padding: 2px 2px 8px !important; scroll-snap-type: x proximity; }
.variant-item {
  flex: 0 0 86px !important;
  width: 86px !important;
  min-width: 86px !important;
  max-width: 86px !important;
  aspect-ratio: 3 / 4 !important;
  height: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--v36-line) !important;
  border-radius: 11px !important;
  background: var(--v36-soft) !important;
  scroll-snap-align: start;
}
.variant-item:hover { border-color: #98a2b3 !important; transform: translateY(-2px); }
.variant-item.active { border: 2px solid var(--v36-blue) !important; box-shadow: 0 0 0 3px rgba(0, 91, 255, .12) !important; }
.variant-item img { width: 100% !important; height: 100% !important; aspect-ratio: 3 / 4 !important; object-fit: cover !important; border-radius: 9px !important; }
.variant-item em { display: none !important; }
.tabs { margin-top: 72px !important; padding: clamp(24px, 5vw, 54px) !important; }
.tabs h2 { color: var(--v36-ink); font-size: clamp(25px, 3vw, 34px); letter-spacing: -.035em; }
.chars th,
.chars td { border-color: var(--v36-line) !important; padding: 14px 10px !important; }
.chars th { color: var(--v36-muted) !important; font-weight: 600 !important; }

/* Catalog, articles, forms */
.catalog-layout { gap: 34px !important; }
.filters,
.filter-panel,
.catalog-sidebar { background: #fff !important; border: 1px solid var(--v36-line) !important; box-shadow: none !important; }
.filter input,
.filter select,
.checkout-form input,
.checkout-form select,
.checkout-form textarea,
.promo-form input { border-color: var(--v36-line) !important; background: #fff !important; }
.text-content { color: #344054; line-height: 1.75; }
.text-content h2,
.text-content h3 { color: var(--v36-ink); letter-spacing: -.025em; }
.messages .message { border-radius: 12px !important; }

/* Footer */
.site-footer.v30-footer { margin-top: 88px !important; background: var(--footer-bg, #fff) !important; color: var(--v36-ink) !important; border-top: 1px solid var(--v36-line) !important; }
.v30-footer-inner { gap: 38px !important; padding: 62px 0 44px !important; }
.v30-footer h3 { color: var(--v36-ink) !important; font-size: 13px !important; text-transform: uppercase; letter-spacing: .08em; }
.v30-footer p,
.v30-footer a { color: var(--v36-muted) !important; font-size: 13px !important; }
.v30-footer a:hover { color: var(--v36-blue) !important; }
.v30-footer-bottom { border-color: var(--v36-line) !important; color: #98a2b3 !important; }

@media (min-width: 1121px) {
  .product-grid.v26-product-grid,
  .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}

@media (max-width: 1100px) {
  .v30-header-main { grid-template-columns: 220px minmax(260px, 1fr) auto !important; }
  .v30-header-main.v38-header-main--ozon { grid-template-columns: 220px minmax(260px, 1fr) !important; }
  .top-nav.v30-nav { gap: 22px !important; overflow-x: auto; scrollbar-width: none; }
  .top-nav.v30-nav::-webkit-scrollbar { display: none; }
  .v36-carousel .product-card { flex-basis: calc((100% - 36px) / 3); min-width: 230px; }
  .gallery { position: static; }
}

@media (max-width: 760px) {
  .container { width: min(100% - 28px, var(--container-width, 1240px)) !important; }
  .section { padding-top: 46px !important; }
  .site-header.v30-header { position: relative !important; }
  .v30-topbar-inner { justify-content: center !important; min-height: 34px !important; white-space: nowrap; overflow: hidden; }
  .v30-topbar-left { display: flex !important; }
  .v30-topbar-left .v30-iconline:nth-child(2),
  .v30-topbar-right { display: none !important; }
  .v30-header-main,
  .v30-header-main.v38-header-main--ozon { grid-template-columns: 1fr !important; gap: 14px !important; min-height: auto; padding: 15px 0 !important; }
  .logo.v30-logo { width: min(var(--header-logo-width, 280px), 190px) !important; min-height: 66px; justify-content: flex-start !important; }
  .logo.v30-logo img { width: 100% !important; height: 72px !important; max-width: 190px !important; max-height: 72px !important; }
  .v30-search { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  .top-nav.v30-nav { white-space: nowrap; min-height: 46px; gap: 20px !important; }
  .top-nav.v30-nav > a { padding: 14px 0 !important; }
  .v36-new-arrivals { padding: 38px 0 34px; }
  .v36-arrivals-heading { align-items: center; }
  .v36-arrivals-heading h1 { font-size: 38px; }
  .v36-carousel-controls { display: none; }
  .v36-carousel { margin-right: -14px; }
  .v36-carousel .product-grid { gap: 12px !important; }
  .v36-carousel .product-card { flex-basis: 76vw; min-width: 224px; }
  .product-body { min-height: 225px; }
  .v30-category-grid { grid-template-columns: 1fr !important; }
  .product-detail { display: block !important; }
  .product-info { margin-top: 28px; }
  .product-info h1 { font-size: 34px !important; }
  .main-photo-button,
  .main-photo,
  .no-img.big { max-height: none !important; }
  .variant-item { flex-basis: 78px !important; width: 78px !important; min-width: 78px !important; max-width: 78px !important; }
  .tabs { margin-top: 48px !important; padding: 22px !important; }
  .v30-benefits-grid { gap: 30px !important; }
  .v30-benefits-grid > div { padding: 0 !important; }
  .site-footer.v30-footer { margin-top: 60px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Compact product carousels around articles */
.article-product-carousel {
  margin: 26px 0;
  padding: 18px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--v36-line);
  border-radius: var(--radius-card, 18px);
}
.article-product-carousel--top { margin-bottom: 32px; }
.article-product-carousel--bottom { margin-top: 32px; }
.article-product-carousel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.article-product-carousel__head h2 {
  margin: 0;
  color: var(--v36-ink);
  font-size: clamp(19px, 2.4vw, 25px);
  line-height: 1.1;
  letter-spacing: -.025em;
}
.article-product-carousel__controls { display: flex; gap: 7px; }
.article-product-carousel__controls button {
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--v36-line);
  border-radius: 50%;
  background: #fff;
  color: var(--v36-ink);
  font-size: 17px;
  cursor: pointer;
}
.article-product-carousel__controls button:hover {
  background: var(--v36-ink);
  border-color: var(--v36-ink);
  color: #fff;
}
.article-product-carousel .article-product-track {
  gap: 12px !important;
  padding: 1px 0 3px;
}
.article-product-card {
  flex: 0 0 250px;
  min-width: 250px;
  overflow: hidden;
  background: var(--v36-soft);
  border: 1px solid var(--v36-line);
  border-radius: 14px;
  scroll-snap-align: start;
  transition: border-color .2s ease, transform .2s ease;
}
.article-product-card:hover {
  border-color: #b9c8e7;
  transform: translateY(-2px);
}
.article-product-card > a {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  min-height: 98px;
  color: inherit;
}
.article-product-card__image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: #fff;
}
.article-product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.article-product-card__image > span {
  color: var(--v36-blue);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
}
.article-product-card__body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  padding: 11px 12px;
}
.article-product-card__body b {
  display: -webkit-box;
  overflow: hidden;
  color: var(--v36-ink);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.article-product-card__body small {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 7px;
  color: var(--success-color, #067647);
  font-size: 11px;
  font-weight: 750;
}
.article-product-card__body small span { color: var(--v36-blue); font-size: 14px; }

@media (max-width: 760px) {
  .article-product-carousel {
    margin-right: -14px;
    margin-left: -14px;
    padding: 15px 14px;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }
  .article-product-carousel__controls { display: none; }
  .article-product-card { flex-basis: min(78vw, 250px); min-width: min(78vw, 250px); }
}
