/*
 * Catalog UI v20260731-3.
 * Deliberately separate from the Nord Чеб catalog visual system.
 * CACHE-BUSTING: run ../../tools/bump-cache-version.sh after every change.
 */

@font-face {
  font-family: CatalogFallback;
  src: local("Arial");
  font-display: swap;
}

:root {
  --ink: #10233f;
  --ink-soft: #232b35;
  --paper: #f7fbff;
  --paper-deep: #edf7ff;
  --white: #fff;
  --muted: #69717a;
  --line: #d9d5cc;
  --accent: #0a84ff;
  --accent-dark: #0065dc;
  --blue: #2867f0;
  --green: #218b61;
  --radius: 22px;
  --shadow: 0 18px 50px rgba(26, 30, 35, .08);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 96px;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, "Segoe UI", CatalogFallback, sans-serif;
  line-height: 1.5;
  overflow-x: hidden;
}

body.filters-open {
  overflow: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select {
  font: inherit;
}

button,
select {
  cursor: pointer;
}

img {
  display: block;
  max-width: 100%;
}

.catalog-container {
  width: min(1380px, calc(100% - 56px));
  margin-inline: auto;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 10000;
  padding: 11px 16px;
  border-radius: 10px;
  color: var(--ink);
  background: var(--white);
  box-shadow: var(--shadow);
  transform: translateY(-160%);
}

.skip-link:focus {
  transform: none;
}

.catalog-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  color: #fff;
  background: rgba(18, 24, 32, .94);
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.header-row {
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 40px;
}

.catalog-logo {
  flex: 0 0 auto;
}

.catalog-logo img {
  width: 180px;
  height: auto;
}

.catalog-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-inline: auto;
}

.catalog-nav a {
  padding: 10px 14px;
  border-radius: 999px;
  color: #b8c0c9;
  font-size: 13px;
  font-weight: 760;
  transition: color .2s, background .2s;
}

.catalog-nav a:hover,
.catalog-nav a:focus-visible {
  color: #fff;
  background: rgba(255, 255, 255, .08);
}

.catalog-nav a.is-current {
  color: var(--ink);
  background: #fff;
}

.header-phone {
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  font-size: 14px;
}

.header-phone > span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #5ee0a8;
  box-shadow: 0 0 0 5px rgba(94, 224, 168, .12);
}

.catalog-hero {
  position: relative;
  color: #fff;
  background:
    radial-gradient(circle at 78% 16%, rgba(40, 103, 240, .28), transparent 28%),
    radial-gradient(circle at 84% 80%, rgba(255, 100, 56, .16), transparent 24%),
    var(--ink);
  overflow: hidden;
}

.catalog-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .16;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(90deg, #000, transparent 55%);
}

.hero-layout {
  position: relative;
  min-height: 590px;
  padding-block: 96px 84px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr);
  gap: 100px;
  align-items: center;
}

.hero-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 24px;
  color: #aeb8c4;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.hero-kicker span {
  width: 38px;
  height: 2px;
  background: var(--accent);
}

.hero-copy h1 {
  max-width: 820px;
  margin: 0;
  font-size: clamp(50px, 6.1vw, 88px);
  line-height: .96;
  letter-spacing: -.058em;
}

.hero-copy h1 em {
  color: var(--accent);
  font-style: normal;
}

.hero-lead {
  max-width: 700px;
  margin: 30px 0 0;
  color: #aeb7c1;
  font-size: 18px;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 35px;
}

.catalog-button {
  min-height: 52px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 850;
  transition: transform .2s, box-shadow .2s, background .2s, color .2s;
}

.catalog-button:hover,
.catalog-button:focus-visible {
  transform: translateY(-2px);
}

.button-accent {
  color: #fff;
  background: var(--accent);
  box-shadow: 0 15px 32px rgba(255, 100, 56, .22);
}

.button-accent:hover {
  background: #ff7149;
  box-shadow: 0 18px 38px rgba(255, 100, 56, .3);
}

.button-quiet {
  color: #fff;
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
}

.button-quiet:hover {
  background: rgba(255,255,255,.11);
}

.hero-console {
  position: relative;
  padding: 28px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 28px;
  background: rgba(255,255,255,.065);
  box-shadow: 0 30px 80px rgba(0,0,0,.2);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.hero-console::after {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  right: -34px;
  top: -34px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 50%;
}

.console-top {
  display: flex;
  align-items: center;
  gap: 11px;
  padding-bottom: 24px;
  color: #cad1d9;
  border-bottom: 1px solid rgba(255,255,255,.12);
  font-size: 13px;
  font-weight: 720;
}

.live-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #5ee0a8;
  box-shadow: 0 0 0 6px rgba(94, 224, 168, .11);
}

.console-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  margin-block: 26px;
  background: rgba(255,255,255,.12);
}

.console-metrics div {
  display: flex;
  flex-direction: column;
  padding: 8px 20px;
  background: #252c35;
}

.console-metrics div:first-child {
  padding-left: 0;
}

.console-metrics strong {
  font-size: clamp(37px, 5vw, 62px);
  line-height: 1;
  letter-spacing: -.05em;
}

.console-metrics span {
  margin-top: 8px;
  color: #929ca7;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.console-note {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 13px;
  align-items: start;
}

.console-note > span {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: var(--accent);
  background: rgba(10,132,255,.12);
  font-size: 22px;
}

.console-note p {
  margin: 0;
  color: #aab3bd;
  font-size: 12px;
}

.catalog-section {
  padding: 95px 0 110px;
}

.section-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 54px;
}

.section-index {
  margin: 0 0 10px;
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.section-intro h2,
.help-card h2 {
  margin: 0;
  font-size: clamp(38px, 4.5vw, 63px);
  line-height: 1;
  letter-spacing: -.05em;
}

.section-intro > p {
  max-width: 580px;
  margin: 0;
  color: var(--muted);
  font-size: 17px;
}

.results-toolbar {
  min-height: 66px;
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 12px 14px 12px 22px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.55);
}

.results-count {
  margin: 0;
  color: #3f4750;
  font-size: 14px;
  font-weight: 750;
}

.sort-control {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.sort-control span {
  color: var(--muted);
  font-size: 12px;
}

.sort-control select {
  min-height: 40px;
  padding: 0 36px 0 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--ink);
  background-color: #fff;
}

.mobile-filter-button {
  display: none;
}

.catalog-layout {
  display: grid;
  grid-template-columns: 294px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.filter-panel {
  position: sticky;
  top: 100px;
  padding: 22px;
  border: 1px solid #ccc7bd;
  border-radius: var(--radius);
  background: #edf8ff;
}

.filter-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}

.filter-panel-head div {
  display: flex;
  flex-direction: column;
}

.filter-panel-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.filter-panel-head strong {
  font-size: 24px;
  letter-spacing: -.025em;
}

.filter-panel-head button {
  display: none;
  width: 38px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  font-size: 24px;
}

.filter-field {
  display: block;
  margin-bottom: 15px;
}

.filter-field > span:first-child,
.price-filter legend {
  display: block;
  margin-bottom: 7px;
  color: #555e66;
  font-size: 11px;
  font-weight: 800;
}

.filter-field input,
.filter-field select,
.price-inputs input {
  width: 100%;
  height: 47px;
  padding: 0 40px 0 13px;
  border: 1px solid #d0cbc1;
  border-radius: 11px;
  color: var(--ink);
  background-color: #fff;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}

.filter-field input:focus,
.filter-field select:focus,
.price-inputs input:focus,
.sort-control select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(40,103,240,.13);
}

.filter-field select:disabled {
  color: #9ca0a4;
  background-color: #f3f1ec;
  cursor: not-allowed;
}

.input-shell {
  position: relative;
  display: block;
}

.input-shell > span {
  position: absolute;
  z-index: 1;
  left: 13px;
  top: 50%;
  color: var(--muted);
  font-size: 22px;
  transform: translateY(-53%);
  pointer-events: none;
}

.filter-search input {
  padding-left: 40px;
  padding-right: 12px;
}

.filter-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.price-filter {
  padding: 0;
  margin: 0 0 17px;
  border: 0;
}

.price-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.price-inputs label {
  position: relative;
}

.price-inputs label span {
  position: absolute;
  left: 12px;
  top: 50%;
  z-index: 1;
  color: #8b9095;
  font-size: 11px;
  transform: translateY(-50%);
  pointer-events: none;
}

.price-inputs input {
  padding: 0 8px 0 31px;
  appearance: textfield;
  -moz-appearance: textfield;
}

.price-inputs input::-webkit-inner-spin-button,
.price-inputs input::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
}

.reset-button,
.apply-button {
  width: 100%;
  min-height: 44px;
  border-radius: 11px;
  font-weight: 820;
}

.reset-button {
  color: #424a52;
  border: 1px solid #cbc6bc;
  background: transparent;
}

.reset-button:hover {
  background: rgba(255,255,255,.6);
}

.apply-button {
  display: none;
  margin-top: 9px;
  color: #fff;
  border: 0;
  background: var(--accent);
}

.products-column {
  min-width: 0;
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.product-card {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #dedad1;
  border-radius: var(--radius);
  background: #fff;
  box-shadow: 0 8px 22px rgba(34, 38, 42, .035);
  transition: transform .25s, box-shadow .25s, border-color .25s;
}

.product-card:hover {
  transform: translateY(-4px);
  border-color: #c5c0b5;
  box-shadow: var(--shadow);
}

.product-image-link {
  position: relative;
  min-height: 285px;
  display: grid;
  place-items: center;
  padding: 25px;
  background:
    linear-gradient(135deg, #eeece6, #faf9f6);
  overflow: hidden;
}

.product-image-link::before {
  content: "";
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(16,35,63,.055);
  border-radius: 50%;
  transform: scale(1.25);
}

.product-image {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 235px;
  object-fit: contain;
  mix-blend-mode: multiply;
  transition: transform .35s;
}

.product-card:hover .product-image {
  transform: scale(1.025);
}

.availability {
  position: absolute;
  z-index: 2;
  top: 15px;
  left: 15px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border: 1px solid rgba(33,139,97,.16);
  border-radius: 999px;
  color: #146747;
  background: rgba(236,250,244,.9);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .055em;
  backdrop-filter: blur(8px);
}

.availability::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2cab78;
}

.product-type {
  position: absolute;
  z-index: 2;
  top: 15px;
  right: 15px;
  max-width: 52%;
  padding: 8px 10px;
  overflow: hidden;
  border: 1px solid rgba(16,35,63,.08);
  border-radius: 999px;
  color: #4c555e;
  background: rgba(255,255,255,.82);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
  text-overflow: ellipsis;
  backdrop-filter: blur(8px);
}

.product-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 23px;
}

.product-overline {
  margin: 0 0 9px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 880;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.product-title {
  margin: 0;
  font-size: 18px;
  line-height: 1.3;
  letter-spacing: -.018em;
}

.product-title a {
  transition: color .2s;
}

.product-title a:hover {
  color: var(--accent-dark);
}

.product-specs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 20px 0 22px;
}

.product-specs div {
  min-width: 0;
  padding: 9px 8px;
  border-radius: 9px;
  background: #f5f3ee;
}

.product-specs span,
.product-specs strong {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.product-specs span {
  color: #858b90;
  font-size: 9px;
  font-weight: 760;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.product-specs strong {
  margin-top: 3px;
  color: #313940;
  font-size: 11px;
}

.product-footer {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid #e5eff7;
}

.product-price {
  color: var(--ink);
  font-size: clamp(23px, 2.4vw, 31px);
  line-height: 1;
  letter-spacing: -.045em;
  white-space: nowrap;
}

.details-link {
  min-height: 42px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  color: #fff;
  background: var(--ink);
  font-size: 12px;
  font-weight: 830;
  transition: background .2s, transform .2s;
}

.details-link:hover {
  background: var(--accent);
  transform: translateY(-1px);
}

.load-more {
  width: 100%;
  min-height: 58px;
  margin-top: 22px;
  border: 1px solid #c9c4ba;
  border-radius: 14px;
  color: var(--ink);
  background: transparent;
  font-weight: 850;
  transition: background .2s, border-color .2s;
}

.load-more:hover {
  border-color: var(--ink);
  background: #fff;
}

.catalog-error,
.empty-state {
  grid-column: 1 / -1;
  padding: 55px 28px;
  border: 1px dashed #c9c4ba;
  border-radius: var(--radius);
  text-align: center;
  background: rgba(255,255,255,.55);
}

.empty-state h3 {
  margin: 0 0 8px;
  font-size: 25px;
}

.empty-state p,
.catalog-error {
  color: var(--muted);
}

.empty-state button,
.catalog-error button {
  margin-top: 14px;
  padding: 11px 16px;
  border: 0;
  border-radius: 10px;
  color: #fff;
  background: var(--ink);
  font-weight: 800;
}

.skeleton-card {
  min-height: 540px;
  border-radius: var(--radius);
  background: linear-gradient(100deg, #e5e1d8 20%, #f4f2ec 40%, #e5e1d8 60%);
  background-size: 200% 100%;
  animation: skeleton 1.3s ease-in-out infinite;
}

.catalog-help {
  color: #fff;
  background: var(--accent);
}

.help-card {
  min-height: 430px;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 80px;
  align-items: center;
  padding-block: 78px;
}

.help-card .section-index {
  color: rgba(255,255,255,.72);
}

.help-card h2 {
  max-width: 850px;
  color: #fff;
}

.help-card p:not(.section-index) {
  max-width: 760px;
  margin: 24px 0 0;
  color: rgba(255,255,255,.83);
  font-size: 17px;
}

.help-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
}

.button-light {
  color: var(--ink);
  background: #fff;
  box-shadow: 0 18px 40px rgba(101,36,18,.15);
}

.help-phone {
  padding-left: 3px;
  font-size: 25px;
  font-weight: 900;
  letter-spacing: -.025em;
}

.catalog-footer {
  color: #fff;
  background: var(--ink);
}

.footer-main {
  min-height: 180px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 45px;
  align-items: center;
}

.footer-main img {
  width: 180px;
}

.footer-main p {
  color: #98a2ad;
}

.footer-main nav {
  display: flex;
  gap: 20px;
  color: #b7c0c9;
  font-size: 12px;
}

.footer-main nav a:hover {
  color: #fff;
}

.footer-bottom {
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: #79838e;
  border-top: 1px solid rgba(255,255,255,.09);
  font-size: 11px;
}

.floating-phone {
  position: fixed;
  z-index: 900;
  right: 20px;
  bottom: 20px;
  min-height: 52px;
  padding: 0 18px 0 10px;
  display: flex;
  align-items: center;
  gap: 9px;
  border-radius: 999px;
  color: #fff;
  background: var(--ink);
  box-shadow: 0 18px 50px rgba(16,35,63,.25);
  font-size: 12px;
}

.floating-phone span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--ink);
  background: #fff;
}

.filter-backdrop {
  display: none;
}

:focus-visible {
  outline: 3px solid rgba(40,103,240,.35);
  outline-offset: 3px;
}

@keyframes skeleton {
  to {
    background-position: -200% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 1120px) {
  .catalog-container {
    width: min(100% - 40px, 1380px);
  }

  .header-row {
    gap: 24px;
  }

  .catalog-nav {
    display: none;
  }

  .header-phone {
    margin-left: auto;
  }

  .hero-layout {
    gap: 55px;
  }

  .catalog-layout {
    grid-template-columns: 265px minmax(0, 1fr);
  }

  .product-grid {
    grid-template-columns: 1fr;
  }

  .product-card {
    display: grid;
    grid-template-columns: minmax(270px, .75fr) minmax(0, 1.25fr);
  }

  .product-image-link {
    min-height: 100%;
  }
}

@media (max-width: 860px) {
  .catalog-container {
    width: min(100% - 30px, 1380px);
  }

  .hero-layout {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 52px;
    padding-block: 76px 70px;
  }

  .hero-console {
    max-width: 650px;
  }

  .section-intro {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .mobile-filter-button {
    min-height: 42px;
    padding: 0 13px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    background: var(--ink);
    font-size: 12px;
    font-weight: 800;
  }

  .mobile-filter-button b {
    min-width: 19px;
    height: 19px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--accent);
    font-size: 10px;
  }

  .results-toolbar {
    padding-left: 12px;
  }

  .sort-control span {
    display: none;
  }

  .catalog-layout {
    display: block;
  }

  .filter-panel {
    position: fixed;
    z-index: 2100;
    inset: 0 0 0 auto;
    top: 0;
    width: min(390px, 92vw);
    height: 100dvh;
    padding: 24px;
    overflow-y: auto;
    border: 0;
    border-radius: 24px 0 0 24px;
    box-shadow: -25px 0 70px rgba(0,0,0,.22);
    transform: translateX(105%);
    transition: transform .28s cubic-bezier(.2,.8,.2,1);
  }

  body.filters-open .filter-panel {
    transform: none;
  }

  .filter-panel-head button,
  .apply-button {
    display: block;
  }

  .filter-backdrop {
    position: fixed;
    z-index: 2050;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: rgba(10,14,18,.55);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s, visibility .25s;
  }

  body.filters-open .filter-backdrop {
    display: block;
    opacity: 1;
    visibility: visible;
  }

  .help-card {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .footer-main {
    grid-template-columns: 1fr;
    gap: 17px;
    padding-block: 45px;
    text-align: center;
  }

  .footer-main > * {
    justify-self: center;
  }
}

@media (max-width: 620px) {
  .catalog-container {
    width: min(100% - 24px, 1380px);
  }

  .header-row {
    min-height: 72px;
  }

  .catalog-logo img {
    width: 155px;
  }

  .header-phone b {
    display: none;
  }

  .header-phone {
    width: 42px;
    height: 42px;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255,255,255,.08);
  }

  .header-phone > span {
    width: 10px;
    height: 10px;
  }

  .hero-layout {
    padding-block: 62px 55px;
  }

  .hero-copy h1 {
    font-size: clamp(44px, 14vw, 63px);
  }

  .hero-lead {
    font-size: 16px;
  }

  .hero-actions {
    display: grid;
  }

  .hero-console {
    padding: 22px;
  }

  .console-metrics div {
    padding: 7px 13px;
  }

  .catalog-section {
    padding: 68px 0 80px;
  }

  .section-intro {
    margin-bottom: 34px;
  }

  .section-intro h2,
  .help-card h2 {
    font-size: 40px;
  }

  .section-intro > p {
    font-size: 15px;
  }

  .results-toolbar {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    padding: 10px;
  }

  .results-count {
    grid-column: 1 / -1;
    grid-row: 2;
    padding: 2px 3px;
    font-size: 12px;
  }

  .sort-control {
    margin-left: 0;
  }

  .sort-control select {
    max-width: 170px;
    font-size: 12px;
  }

  .product-grid {
    grid-template-columns: 1fr;
  }

  .product-card {
    display: flex;
  }

  .product-image-link {
    min-height: 245px;
    padding: 18px;
  }

  .product-image {
    height: 205px;
  }

  .product-body {
    padding: 19px;
  }

  .product-title {
    font-size: 17px;
  }

  .product-specs {
    margin-block: 17px;
  }

  .product-footer {
    align-items: center;
  }

  .product-price {
    font-size: 25px;
  }

  .details-link {
    padding-inline: 12px;
  }

  .help-card {
    min-height: auto;
    padding-block: 60px;
  }

  .help-card p:not(.section-index) {
    font-size: 15px;
  }

  .button-light {
    width: 100%;
  }

  .help-phone {
    font-size: 22px;
  }

  .footer-main nav {
    flex-direction: column;
    gap: 9px;
  }

  .footer-bottom {
    padding-block: 22px;
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }

  .floating-phone {
    right: 12px;
    bottom: 12px;
    width: 52px;
    height: 52px;
    padding: 0;
    justify-content: center;
  }

  .floating-phone span {
    width: 38px;
    height: 38px;
  }

  .floating-phone b {
    display: none;
  }
}

/* Product detail */
.product-page {
  background: #f7fbff;
}

.product-breadcrumbs {
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #7c8288;
  font-size: 12px;
}

.product-breadcrumbs a {
  color: #444c54;
  font-weight: 720;
}

.product-breadcrumbs a:hover {
  color: var(--accent-dark);
}

.product-breadcrumbs span:last-child {
  max-width: 42vw;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.product-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.03fr) minmax(420px, .97fr);
  gap: 70px;
  padding-block: 25px 88px;
  align-items: center;
}

.product-gallery {
  position: relative;
  min-height: 570px;
  display: grid;
  place-items: center;
  padding: 65px;
  overflow: hidden;
  border: 1px solid #e0dcd3;
  border-radius: 32px;
  background:
    radial-gradient(circle at 50% 45%, #fff 0 34%, transparent 35%),
    linear-gradient(135deg, #e5eff7, #f8fcff);
}

.product-gallery::before,
.product-gallery::after {
  content: "";
  position: absolute;
  width: 390px;
  height: 390px;
  border: 1px solid rgba(16,35,63,.055);
  border-radius: 50%;
}

.product-gallery::after {
  width: 520px;
  height: 520px;
}

.product-gallery img {
  position: relative;
  z-index: 1;
  width: 100%;
  max-height: 440px;
  object-fit: contain;
  mix-blend-mode: multiply;
}

.summary-availability {
  position: absolute;
  z-index: 2;
  top: 20px;
  left: 20px;
  padding: 9px 12px;
  border-radius: 999px;
  color: #665a34;
  background: #fff4c9;
  font-size: 10px;
  font-weight: 880;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.summary-availability.is-available {
  color: #146747;
  background: #e9f9f1;
}

.product-no-image {
  position: relative;
  z-index: 1;
  color: #898e93;
  font-weight: 750;
}

.product-summary-overline {
  margin: 0 0 16px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 880;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.product-summary-copy h1 {
  margin: 0;
  font-size: clamp(37px, 4vw, 58px);
  line-height: 1.04;
  letter-spacing: -.048em;
}

.product-summary-type {
  margin: 18px 0 0;
  color: #757d84;
  font-size: 14px;
}

.quick-specs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 31px 0;
}

.quick-specs div {
  min-width: 0;
  padding: 12px;
  border: 1px solid #e1ddd5;
  border-radius: 12px;
  background: #fff;
}

.quick-specs dt,
.quick-specs dd {
  margin: 0;
}

.quick-specs dt {
  color: #8b9095;
  font-size: 9px;
  font-weight: 820;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.quick-specs dd {
  margin-top: 4px;
  overflow: hidden;
  color: #30373d;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.product-buybox {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  align-items: center;
  padding: 23px;
  border-radius: 18px;
  color: #fff;
  background: var(--ink);
}

.product-buybox > div {
  display: flex;
  flex-direction: column;
}

.product-buybox strong {
  font-size: clamp(30px, 3.1vw, 43px);
  line-height: 1;
  letter-spacing: -.045em;
  white-space: nowrap;
}

.product-buybox span {
  margin-top: 7px;
  color: #aab3bc;
  font-size: 11px;
}

.price-note {
  margin: 13px 0 0;
  color: #7a8187;
  font-size: 11px;
}

.product-content {
  padding: 88px 0 110px;
  border-top: 1px solid #dedad1;
  background: #fff;
}

.product-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  gap: 80px;
  align-items: start;
}

.product-description {
  margin-bottom: 78px;
}

.product-description h2,
.specification-block > h2,
.product-side-note h2 {
  margin: 0;
  font-size: clamp(35px, 4vw, 55px);
  line-height: 1.04;
  letter-spacing: -.045em;
}

.product-description > p:last-child {
  max-width: 920px;
  margin: 26px 0 0;
  color: #59636c;
  font-size: 17px;
  line-height: 1.75;
}

.specification-block > h2 {
  margin-bottom: 30px;
}

.spec-group {
  border-top: 1px solid #dedbd3;
}

.spec-group:last-child {
  border-bottom: 1px solid #dedbd3;
}

.spec-group summary {
  position: relative;
  min-height: 72px;
  padding: 0 54px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  cursor: pointer;
  font-size: 19px;
  font-weight: 850;
}

.spec-group summary::-webkit-details-marker {
  display: none;
}

.spec-group summary::after {
  content: "+";
  position: absolute;
  right: 9px;
  top: 50%;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--ink);
  font-size: 20px;
  font-weight: 500;
  transform: translateY(-50%);
}

.spec-group[open] summary::after {
  content: "−";
  background: var(--accent);
}

.spec-group summary span {
  margin-left: auto;
  margin-right: 12px;
  color: #9ca1a6;
  font-size: 11px;
}

.spec-group dl {
  margin: 0;
  padding: 0 0 23px;
}

.spec-group dl > div {
  display: grid;
  grid-template-columns: minmax(220px, .9fr) minmax(0, 1.1fr);
  gap: 30px;
  padding: 11px 0;
  border-top: 1px solid #f0eee9;
}

.spec-group dt,
.spec-group dd {
  margin: 0;
  font-size: 13px;
}

.spec-group dt {
  color: #858c92;
}

.spec-group dd {
  color: #30373d;
  font-weight: 720;
}

.product-side-note {
  position: sticky;
  top: 108px;
  padding: 30px;
  border-radius: 25px;
  color: #fff;
  background: var(--ink);
  box-shadow: 0 26px 65px rgba(16,35,63,.16);
}

.product-side-note .section-index {
  color: var(--accent);
}

.product-side-note h2 {
  color: #fff;
  font-size: 33px;
}

.product-side-note > p:not(.section-index) {
  margin: 20px 0 26px;
  color: #abb4bd;
  font-size: 14px;
}

.product-side-note .catalog-button {
  width: 100%;
}

.side-phone {
  display: block;
  margin-top: 17px;
  text-align: center;
  font-size: 18px;
  font-weight: 880;
}

.document-links {
  display: grid;
  gap: 5px;
  margin-top: 28px;
  padding-top: 23px;
  border-top: 1px solid rgba(255,255,255,.12);
}

.document-links > strong {
  margin-bottom: 7px;
  color: #818c97;
  font-size: 10px;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.document-links a {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 0;
  color: #d7dde3;
  font-size: 12px;
}

.document-links a:hover {
  color: #fff;
}

.product-not-found {
  min-height: 70vh;
  display: grid;
  align-items: center;
  padding-block: 90px;
  text-align: center;
}

.product-not-found h1 {
  max-width: 820px;
  margin: 0 auto;
  font-size: clamp(46px, 7vw, 86px);
  line-height: 1;
  letter-spacing: -.055em;
}

.product-not-found p:not(.section-index) {
  margin: 22px 0 28px;
  color: var(--muted);
}

@media (max-width: 1080px) {
  .product-summary {
    gap: 35px;
  }

  .product-gallery {
    min-height: 480px;
    padding: 40px;
  }

  .product-buybox {
    grid-template-columns: 1fr;
  }

  .product-buybox .catalog-button {
    width: 100%;
  }

  .product-content-grid {
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 45px;
  }
}

@media (max-width: 820px) {
  .product-summary {
    grid-template-columns: 1fr;
    padding-bottom: 65px;
  }

  .product-gallery {
    min-height: 430px;
  }

  .product-content-grid {
    grid-template-columns: 1fr;
  }

  .product-side-note {
    position: static;
  }
}

@media (max-width: 620px) {
  .product-breadcrumbs {
    min-height: 62px;
  }

  .product-breadcrumbs span:last-child {
    max-width: 30vw;
  }

  .product-summary {
    padding-top: 4px;
  }

  .product-gallery {
    min-height: 310px;
    padding: 30px;
    border-radius: 23px;
  }

  .product-gallery img {
    max-height: 255px;
  }

  .product-gallery::before {
    width: 240px;
    height: 240px;
  }

  .product-gallery::after {
    width: 330px;
    height: 330px;
  }

  .product-summary-copy h1 {
    font-size: 38px;
  }

  .quick-specs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-buybox {
    padding: 20px;
  }

  .product-content {
    padding: 65px 0 80px;
  }

  .product-description {
    margin-bottom: 62px;
  }

  .product-description > p:last-child {
    font-size: 15px;
  }

  .spec-group summary {
    font-size: 16px;
  }

  .spec-group dl > div {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 12px 0;
  }

  .product-side-note {
    padding: 25px;
  }
}

/* v20260801: align catalog and product pages with the main holod21.ru visual system. */
:root{
  --ink:#10233f;
  --ink-soft:#173a5c;
  --paper:#f7fbff;
  --paper-deep:#edf7ff;
  --white:#fff;
  --muted:#667d92;
  --line:#dce9f4;
  --accent:#0a84ff;
  --accent-dark:#0065dc;
  --blue:#0a84ff;
  --green:#22a96f;
  --radius:24px;
  --shadow:0 22px 55px rgba(21,69,111,.12);
}
body{background:var(--paper);color:var(--ink);font-family:Inter,"Segoe UI",CatalogFallback,sans-serif}
.catalog-container{width:min(1180px,calc(100% - 40px))}
.catalog-header{color:var(--ink);background:rgba(247,251,255,.88);border-bottom:1px solid rgba(15,67,118,.08);box-shadow:0 8px 30px rgba(33,78,123,.06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.header-row{min-height:82px;gap:25px}
.catalog-logo img{width:192px}
.catalog-nav{gap:4px}
.catalog-nav a{color:#38526f;font-size:13px;font-weight:760}
.catalog-nav a:hover,.catalog-nav a:focus-visible{color:#0878e8;background:#eaf6ff}
.catalog-nav a.is-current{color:#fff;background:linear-gradient(135deg,#0a84ff,#0065dc);box-shadow:0 9px 24px rgba(10,132,255,.22)}
.header-phone{color:#10233f}
.header-phone>span{background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.12)}
.catalog-hero{color:var(--ink);background:radial-gradient(circle at 78% 18%,rgba(75,177,255,.2),transparent 31%),linear-gradient(180deg,#f5fbff 0%,#edf8ff 78%,#f7fbff 100%)}
.catalog-hero::before{opacity:.32;background-image:linear-gradient(rgba(10,132,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(10,132,255,.08) 1px,transparent 1px);mask-image:linear-gradient(90deg,#000,transparent 70%)}
.hero-layout{min-height:640px;padding-block:100px 90px;gap:76px}
.hero-kicker{color:#0875e1}
.hero-kicker span{background:#0a84ff}
.hero-copy h1{color:#0c2746;font-size:clamp(48px,5.5vw,76px);line-height:1.02}
.hero-copy h1 em{color:#0878e8}
.hero-lead{color:#536c86;font-size:19px}
.catalog-button{border-radius:14px;font-weight:800}
.button-accent{background:linear-gradient(135deg,#0a84ff,#0065dc);box-shadow:0 14px 32px rgba(10,132,255,.25)}
.button-accent:hover{background:linear-gradient(135deg,#168dff,#0060d2);box-shadow:0 18px 38px rgba(10,132,255,.32)}
.button-quiet{color:#153b61;border-color:rgba(24,69,110,.16);background:rgba(255,255,255,.74)}
.button-quiet:hover{color:#0878e8;background:#fff;box-shadow:0 12px 30px rgba(29,73,117,.12)}
.hero-console{border-color:rgba(10,132,255,.16);background:rgba(255,255,255,.82);box-shadow:0 30px 75px rgba(20,83,141,.16)}
.hero-console::after{border-color:rgba(10,132,255,.2)}
.console-top{color:#536c86;border-bottom-color:rgba(15,67,118,.1)}
.live-dot{background:#22c55e;box-shadow:0 0 0 6px rgba(34,197,94,.11)}
.console-metrics{background:#dcecf8}
.console-metrics div{background:#fff}
.console-metrics strong{color:#102d4d}
.console-metrics span{color:#71869a}
.console-note>span{color:#0878e8;background:#e7f6ff}
.console-note p{color:#667d92}
.catalog-section{padding:105px 0 115px}
.section-index{color:#0878e8}
.section-intro h2,.help-card h2{color:#102d4d}
.results-toolbar{border-color:#dce9f4;background:rgba(255,255,255,.76);box-shadow:0 12px 32px rgba(21,69,111,.05)}
.results-count{color:#38526f}
.sort-control select{border-color:#d4e5f2;color:#10233f;background:#fff}
.catalog-layout{grid-template-columns:286px minmax(0,1fr);gap:22px}
.filter-panel{border-color:#d6e7f4;background:linear-gradient(160deg,#edf8ff,#f8fcff);box-shadow:0 18px 45px rgba(21,69,111,.07)}
.filter-panel-head strong{color:#173a5c}
.filter-field>span:first-child,.price-filter legend{color:#536c86}
.filter-field input,.filter-field select,.price-inputs input{border-color:#d5e5f1;color:#10233f;background:#fff}
.filter-field input:focus,.filter-field select:focus,.price-inputs input:focus,.sort-control select:focus{border-color:#0a84ff;box-shadow:0 0 0 3px rgba(10,132,255,.13)}
.filter-field select:disabled{color:#93a6b6;background:#eff5f9}
.reset-button{color:#38526f;border-color:#caddeb;background:#fff}
.reset-button:hover{color:#0878e8;border-color:#83c2f4;background:#fff}
.apply-button{background:linear-gradient(135deg,#0a84ff,#0065dc)}
.product-grid{gap:18px}
.product-card{border-color:#dce9f4;border-radius:26px;background:#fff;box-shadow:0 12px 34px rgba(21,69,111,.06)}
.product-card:hover{border-color:rgba(10,132,255,.28);box-shadow:0 25px 58px rgba(21,69,111,.13)}
.product-image-link{background:radial-gradient(circle at 50% 48%,#fff 0 34%,transparent 35%),linear-gradient(135deg,#eaf6ff,#f8fcff)}
.product-image-link::before{border-color:rgba(10,132,255,.07)}
.availability{color:#146747;border-color:rgba(33,139,97,.16);background:rgba(236,250,244,.92)}
.product-type{color:#38526f;border-color:rgba(24,69,110,.1);background:rgba(255,255,255,.86)}
.product-overline{color:#0878e8}
.product-title{color:#173a5c}
.product-title a:hover{color:#0878e8}
.product-specs div{background:#eff7fd}
.product-specs span{color:#71869a}
.product-specs strong{color:#38526f}
.product-footer{border-top-color:#e5eff7}
.product-price{color:#102d4d}
.details-link{border-radius:12px;background:linear-gradient(135deg,#0a84ff,#0065dc);box-shadow:0 9px 22px rgba(10,132,255,.2)}
.details-link:hover{background:linear-gradient(135deg,#168dff,#0060d2)}
.load-more{border-color:#c8ddea;color:#17496f;background:#fff}
.load-more:hover{color:#0878e8;border-color:#73b9ef;background:#fff}
.catalog-error,.empty-state{border-color:#bcd8eb;background:rgba(255,255,255,.75)}
.skeleton-card{background:linear-gradient(100deg,#e4f1fa 20%,#f7fbff 40%,#e4f1fa 60%);background-size:200% 100%}
.catalog-help{background:linear-gradient(140deg,#0a84ff,#0059c4)}
.help-card .section-index{color:#bfe4ff}
.help-card h2{color:#fff}
.help-card p:not(.section-index){color:rgba(255,255,255,.84)}
.button-light{color:#0878e8;background:#fff;box-shadow:0 18px 40px rgba(0,53,117,.18)}
.help-actions .button-quiet{color:#fff;border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.1)}
.help-actions .button-quiet:hover{color:#fff;background:rgba(255,255,255,.17)}
.catalog-footer{background:#0b2d4f}
.footer-main p{color:#a9c1d7}
.footer-main nav{color:#c4d5e4}
.footer-bottom{color:#8fa9bf}
.floating-phone{background:linear-gradient(135deg,#0a84ff,#0065dc);box-shadow:0 18px 50px rgba(0,101,220,.28)}
.floating-phone span{color:#0878e8}
:focus-visible{outline-color:rgba(10,132,255,.35)}
.product-page{background:#f7fbff}
.product-breadcrumbs{color:#71869a}
.product-breadcrumbs a{color:#38526f}
.product-breadcrumbs a:hover{color:#0878e8}
.product-gallery{border-color:#dce9f4;background:radial-gradient(circle at 50% 45%,#fff 0 34%,transparent 35%),linear-gradient(135deg,#eaf6ff,#f8fcff);box-shadow:0 20px 55px rgba(21,69,111,.07)}
.product-gallery::before,.product-gallery::after{border-color:rgba(10,132,255,.07)}
.product-summary-overline{color:#0878e8}
.product-summary-copy h1{color:#102d4d}
.product-summary-type,.price-note{color:#667d92}
.quick-specs div{border-color:#dce9f4;background:#fff}
.quick-specs dt{color:#71869a}
.quick-specs dd{color:#173a5c}
.product-buybox{border-color:#dce9f4;background:linear-gradient(145deg,#edf8ff,#fff)}
.product-buybox strong{color:#102d4d}
.product-buybox span{color:#667d92}
.product-content{background:#fff}
.product-description,.specification-block{border-color:#dce9f4;background:#fff;box-shadow:0 15px 42px rgba(21,69,111,.06)}
.product-description h2,.specification-block h2,.product-side-note h2{color:#102d4d}
.product-description>p:last-child{color:#536c86}
.spec-group{border-color:#dce9f4}
.spec-group summary{color:#173a5c;background:#f3f9fd}
.spec-group dl div{border-top-color:#e5eff7}
.spec-group dt{color:#667d92}
.spec-group dd{color:#173a5c}
.product-side-note{border-color:#d4e8f6;background:linear-gradient(150deg,#0b2d4f,#0a4f8c);box-shadow:0 22px 58px rgba(11,45,79,.18)}
.product-side-note .section-index{color:#62c5ff}
.product-side-note h2{color:#fff}
.product-side-note p{color:#b5cbde}
.side-phone{color:#fff}
.side-service-link{display:block;margin-top:13px;color:#8dd4ff;font-size:13px;font-weight:800}
.side-service-link:hover{color:#fff}
.document-links{border-top-color:rgba(255,255,255,.14)}
.document-links a{color:#d3e5f2;border-bottom-color:rgba(255,255,255,.1)}
.product-not-found{background:radial-gradient(circle at 50% 20%,rgba(48,172,255,.18),transparent 38%),#f4faff}
@media(max-width:1120px){.catalog-container{width:min(100% - 40px,1180px)}.catalog-layout{grid-template-columns:265px minmax(0,1fr)}}
@media(max-width:860px){.catalog-container{width:min(100% - 30px,1180px)}.filter-panel{background:linear-gradient(160deg,#edf8ff,#fff)}}
@media(max-width:620px){.catalog-container{width:min(100% - 24px,1180px)}.header-phone{background:#eaf6ff}.hero-copy h1{font-size:clamp(42px,13vw,60px)}}
.catalog-pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin:30px 0 8px;color:#6a8095;font-size:14px}
.catalog-pagination a{padding:10px 15px;border:1px solid #d6e6f2;border-radius:999px;background:#fff;color:#0878df;font-weight:800;box-shadow:0 8px 22px rgba(21,69,111,.07)}
.catalog-pagination a:hover{border-color:#8acbfa;transform:translateY(-1px)}

/* v20260809: filters are always visible, compact, and arranged in two columns. */
body.filters-open{overflow-x:hidden;overflow-y:auto}
.mobile-filter-button,.filter-backdrop,.filter-panel-head button,.apply-button{display:none!important}
.catalog-layout{display:block!important}
.filter-panel{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  width:100%!important;
  height:auto!important;
  margin:0 0 24px!important;
  padding:20px!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px 16px;
  overflow:visible!important;
  border:1px solid #d7e4ee;
  border-radius:20px;
  background:linear-gradient(145deg,#f1f9ff,#fff);
  box-shadow:0 12px 32px rgba(21,69,111,.055);
  transform:none!important;
}
.filter-panel-head,.filter-search,.price-filter,.reset-button{grid-column:1/-1}
.filter-panel-head{margin-bottom:1px}
.filter-panel-head strong{font-size:21px}
.filter-field{min-width:0;margin:0}
.filter-field select,.filter-field input{min-width:0;width:100%}
.filter-pair{display:contents}
.price-filter{margin:0}
.reset-button{justify-self:start;width:auto;min-width:180px;padding-inline:18px}
.products-column{width:100%}
.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.product-card{display:flex!important}

/* Product image: soft depth and motion instead of the old outlined circle. */
.product-image-link{
  isolation:isolate;
  background:linear-gradient(145deg,#f8fcff 0%,#edf7ff 54%,#ffffff 100%);
}
.product-image-link::before{
  content:"";
  position:absolute;
  inset:9% 8% 8%;
  border:0;
  border-radius:34px;
  background:radial-gradient(ellipse at 50% 54%,rgba(10,132,255,.18) 0%,rgba(64,183,255,.09) 38%,rgba(255,255,255,0) 72%);
  filter:blur(2px);
  opacity:.82;
  transform:scale(.9);
  transition:transform .65s cubic-bezier(.2,.75,.2,1),opacity .65s ease;
}
.product-image-link::after{
  content:"";
  position:absolute;
  z-index:0;
  left:20%;
  right:20%;
  bottom:13%;
  height:12%;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(16,35,63,.16) 0%,rgba(16,35,63,0) 72%);
  filter:blur(10px);
  opacity:.4;
  transform:scaleX(.78);
  transition:transform .65s cubic-bezier(.2,.75,.2,1),opacity .65s ease;
}
.product-image{
  mix-blend-mode:normal;
  filter:drop-shadow(0 13px 14px rgba(24,66,104,.13));
  transform:translateY(0) scale(1);
  transition:transform .65s cubic-bezier(.2,.75,.2,1),filter .65s ease;
}
.product-card:hover .product-image,.product-card:focus-within .product-image{
  transform:translateY(-5px) scale(1.025);
  filter:drop-shadow(0 20px 18px rgba(24,66,104,.18));
}
.product-card:hover .product-image-link::before,.product-card:focus-within .product-image-link::before{transform:scale(1.04);opacity:1}
.product-card:hover .product-image-link::after,.product-card:focus-within .product-image-link::after{transform:scaleX(1);opacity:.55}

@media(max-width:1180px){
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .catalog-container{width:min(100% - 24px,1380px)}
  .header-phone{width:auto;height:auto;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.07);font-size:12px}
  .header-phone b{display:inline!important}
  .header-phone>span{width:8px;height:8px}
  .filter-panel{grid-template-columns:repeat(2,minmax(0,1fr));padding:14px!important;gap:11px 10px}
  .filter-panel-head,.filter-search,.price-filter,.reset-button{grid-column:1/-1}
  .filter-field>span:first-child,.price-filter legend{font-size:10px}
  .filter-field select,.filter-field input{font-size:12px}
  .reset-button{width:100%}
  .product-grid{grid-template-columns:1fr}
}

@media (orientation:landscape) and (max-height:720px) and (min-width:640px){
  html{scroll-padding-top:70px}
  .catalog-container{width:min(1380px,calc(100% - 28px))}
  .header-row{min-height:64px;gap:18px}
  .catalog-logo img{width:152px}
  .header-phone{display:flex;width:auto;height:auto;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.06);font-size:12px}
  .header-phone b{display:inline!important}
  .hero-layout{min-height:auto!important;grid-template-columns:minmax(0,1.12fr) minmax(260px,.88fr)!important;gap:30px!important;padding-block:48px 46px!important}
  .hero-copy h1{font-size:clamp(36px,5.5vw,56px)}
  .hero-lead{margin-top:18px;font-size:14px}
  .hero-actions{margin-top:24px}
  .hero-console{padding:20px;border-radius:22px}
  .console-top{padding-bottom:16px;font-size:11px}
  .console-metrics{margin-block:17px}
  .console-metrics strong{font-size:clamp(31px,4.5vw,45px)}
  .console-note p{font-size:10px}
  .product-breadcrumbs{min-height:54px}
  .catalog-section{padding:58px 0 70px}
  .section-intro{grid-template-columns:1fr 1fr;gap:32px;margin-bottom:30px}
  .section-intro h2,.help-card h2{font-size:clamp(32px,4.5vw,44px)}
  .section-intro>p{font-size:14px}
  .results-toolbar{min-height:56px;margin-bottom:14px}
  .filter-panel{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:18px!important;padding:15px!important;gap:10px 14px}
  .filter-panel-head{grid-column:1/-1}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .product-image-link{min-height:215px;padding:16px}
  .product-image{height:175px}
  .product-body{padding:18px}
  .product-specs{margin:15px 0 17px}
  .help-card{min-height:auto;grid-template-columns:1.2fr .8fr;gap:34px;padding-block:52px}
  .footer-main{min-height:145px;grid-template-columns:auto 1fr auto;padding-block:25px;text-align:left}
}

/* Product detail uses the same calm image language, without concentric circles. */
.product-gallery{
  isolation:isolate;
  background:linear-gradient(145deg,#f8fcff 0%,#edf7ff 55%,#fff 100%)!important;
}
.product-gallery::before{
  width:auto!important;
  height:auto!important;
  inset:8% 7% 9%!important;
  border:0!important;
  border-radius:36px!important;
  background:radial-gradient(ellipse at 50% 52%,rgba(10,132,255,.18) 0%,rgba(64,183,255,.08) 40%,transparent 73%);
  filter:blur(3px);
  opacity:.86;
  transform:scale(.92);
  transition:transform .7s cubic-bezier(.2,.75,.2,1),opacity .7s ease;
}
.product-gallery::after{
  width:auto!important;
  height:12%!important;
  left:20%!important;
  right:20%!important;
  top:auto!important;
  bottom:13%!important;
  border:0!important;
  border-radius:50%!important;
  background:radial-gradient(ellipse,rgba(16,35,63,.16),transparent 72%);
  filter:blur(12px);
  opacity:.42;
  transform:scaleX(.8);
  transition:transform .7s cubic-bezier(.2,.75,.2,1),opacity .7s ease;
}
.product-gallery img{
  mix-blend-mode:normal!important;
  filter:drop-shadow(0 16px 16px rgba(24,66,104,.14));
  transition:transform .7s cubic-bezier(.2,.75,.2,1),filter .7s ease;
}
.product-gallery:hover img{transform:translateY(-5px) scale(1.018);filter:drop-shadow(0 22px 20px rgba(24,66,104,.19))}
.product-gallery:hover::before{transform:scale(1.035);opacity:1}
.product-gallery:hover::after{transform:scaleX(1);opacity:.56}

@media (orientation:landscape) and (max-height:720px) and (min-width:640px){
  .product-summary{grid-template-columns:minmax(0,.96fr) minmax(300px,1.04fr);gap:28px;padding-block:16px 50px;align-items:center}
  .product-gallery{min-height:300px;padding:24px;border-radius:24px}
  .product-gallery img{max-height:250px}
  .product-summary-overline{margin-bottom:10px;font-size:10px}
  .product-summary-copy h1{font-size:clamp(29px,4.3vw,42px)}
  .product-summary-type{margin-top:10px;font-size:12px}
  .quick-specs{margin:18px 0;gap:6px}
  .quick-specs div{padding:9px}
  .product-buybox{grid-template-columns:1fr auto;gap:12px;padding:16px}
  .product-buybox strong{font-size:clamp(27px,3.5vw,36px)}
  .product-buybox .catalog-button{width:auto}
  .product-content{padding:62px 0 75px}
  .product-content-grid{grid-template-columns:minmax(0,1fr) 260px;gap:34px}
  .product-side-note{position:sticky;top:78px;padding:22px}
  .product-description{margin-bottom:52px}
  .product-description h2,.specification-block>h2,.product-side-note h2{font-size:clamp(29px,4vw,40px)}
}


/* v20260819: compact catalog intro; sorting lives inside the main filter card. */
.hero-layout{
  min-height:auto!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:0!important;
  padding-block:46px 50px!important;
}
.hero-copy{max-width:980px}
.hero-lead,.hero-actions,.hero-console{display:none!important}
.catalog-section{padding:56px 0 90px!important}
.section-intro{margin-bottom:22px}
.results-toolbar{display:none!important}
.filter-panel .sort-control{
  display:block;
  margin:0;
}
.filter-panel .sort-control>span:first-child{
  display:block;
  margin-bottom:7px;
  color:#555e66;
  font-size:11px;
  font-weight:800;
}
.filter-panel .sort-control select{
  width:100%;
  max-width:none;
  height:47px;
  min-height:47px;
  padding:0 40px 0 13px;
  border:1px solid #d0cbc1;
  border-radius:11px;
  color:var(--ink);
  background-color:#fff;
}

@media(max-width:620px){
  .hero-layout{padding-block:32px 36px!important}
  .catalog-section{padding:38px 0 70px!important}
  .section-intro{margin-bottom:18px}
  .filter-panel .sort-control>span:first-child{display:block;font-size:10px}
}