.catalog {
  --catalog-line: #29424b;
  --catalog-copy: #b5c9cc;
  --catalog-panel: linear-gradient(155deg,#10242d,#0a1720);
  color: #e6f3f1;
}
.catalog .page-title { margin: 0; line-height: 1.25; overflow-wrap: anywhere; }
.catalog__translation { display: block; margin: 8px 0 0; font-size: .48em; line-height: 1.85; color: var(--catalog-copy); font-weight: 400; }
.catalog__product { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: clamp(24px,5vw,76px); }
.catalog__summary { align-self: center; min-width: 0; }
.catalog__brand { margin: 0 0 12px; }
.catalog__brand a, .catalog__jump { color: #36dece; }
.catalog__intro { color: var(--catalog-copy); line-height: 2; margin: 20px 0; }
.catalog__offer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; border-block: 1px solid var(--catalog-line); padding: 14px 0; margin-bottom: 20px; }
.catalog__offer strong { display: block; font-size: clamp(20px,2.6vw,32px); }
.catalog__label { font-size: 13px; color: var(--catalog-copy); }
.catalog__stock { padding: 4px 10px; border: 1px solid #377361; color: #92e3c4; background: #10302d; border-radius: 8px; font-size: 13px; }
.catalog__jump { display: inline-block; margin-inline-start: 16px; padding-block: 10px; }
.catalog__gallery { min-width: 0; }
.catalog__figure { margin: 0; display: grid; place-items: center; background: #e6eded; border-radius: 16px; overflow: hidden; aspect-ratio: 4/3; }
.catalog__figure img { display: block; width: 100%; height: 100%; min-height: 0; max-height: 100%; object-fit: contain; }
.catalog__thumbs, .catalog__grid, .catalog__tags ul, .catalog__pagination ol { padding: 0; list-style: none; margin: 0; }
.catalog__thumbs { display: flex; gap: 10px; margin-top: 12px; }
.catalog__thumbs a { display: block; padding: 2px; border: 2px solid var(--catalog-line); border-radius: 10px; }
.catalog__thumbs a[aria-current=true] { border-color: #00d1c1; }
.catalog__thumbs img { display: block; width: 62px; height: 58px; object-fit: contain; background: #e6eded; border-radius: 6px; }
.catalog__detail { display: grid; gap: 18px; margin-top: 44px; }
.catalog__panel { padding: clamp(16px,3vw,32px); border: 1px solid var(--catalog-line); border-radius: 16px; background: var(--catalog-panel); overflow-wrap: anywhere; }
.catalog__panel[id] { scroll-margin-top: 110px; }
.catalog__panel h2:first-child, .catalog__listing h2 { margin-top: 0; }
.catalog__listing { margin-top: 44px; }
.catalog__listing--category { margin-top: 22px; }
.catalog__grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(8px,1.5vw,20px); }
.catalog__card { min-width: 0; }
.catalog__card a { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; background: var(--catalog-panel); border: 1px solid var(--catalog-line); border-radius: 14px; overflow: hidden; }
.catalog__card a:hover { border-color: #4e888b; }
.catalog__card-image { display: grid; place-items: center; grid-template-rows: minmax(0,1fr); aspect-ratio: 4/3; background: #e6eded; }
.catalog__card-image img { display: block; width: 100%; height: 100%; min-height: 0; max-height: 100%; object-fit: contain; }
.catalog__card-copy { padding: clamp(8px,1.4vw,16px); }
.catalog__card-title { font-size: clamp(12px,1.35vw,17px); line-height: 1.6; margin: 0 0 7px; overflow-wrap: anywhere; }
.catalog__card-copy > span { font-size: clamp(11px,1.2vw,15px); color: #a4d7d5; }
.catalog__category-head { display: flex; justify-content: space-between; align-items: end; gap: 10px; padding-bottom: 15px; border-bottom: 1px solid var(--catalog-line); }
.catalog__category-head .catalog__translation { font-size: 16px; }
.catalog__count { margin: 0; color: var(--catalog-copy); white-space: nowrap; font-size: 13px; }
.catalog__tags ul, .catalog__pagination ol { display: flex; flex-wrap: wrap; gap: 7px; }
.catalog__tags { margin-top: 16px; }
.catalog__tags a, .catalog__pagination a { display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 3px 10px; background: #10242d; color: #e6f3f1; border: 1px solid var(--catalog-line); border-radius: 8px; font-size: 12px; text-decoration: none; }
.catalog__tags a:hover, .catalog__pagination a:hover { border-color: #4e888b; }
.catalog__pagination { margin-top: 24px; }
.catalog__pagination ol { justify-content: center; }
.catalog__pagination a { min-width: 44px; min-height: 44px; }
.catalog__pagination a[aria-current=page] { background: #00d1c1; color: #050d14; }
.catalog a:focus-visible { outline: 2px solid #2dd4bf; outline-offset: 2px; }
@media (max-width: 1000px) {
  .catalog__grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 680px) {
  .catalog__product { grid-template-columns: minmax(0,1fr); gap: 20px; }
  .catalog__gallery { grid-row: 1; }
  .catalog__figure { aspect-ratio: 16/10; }
  .catalog__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .catalog__detail { margin-top: 30px; }
}
.catalog__figure picture, .catalog__card-image picture { display: block; width: 100%; height: 100%; min-height: 0; }
.catalog__thumbs { flex-wrap: wrap; }
.catalog__thumbs picture { display: block; }
.catalog__translation { font-size: .5em; }
.catalog__zero { display: inline-block; font-size: 13px; color: #36dece; margin-block-start: 5px; }
.catalog__panel { width: 100%; min-width: 0; }
.catalog__panel table { width: 100%; max-width: 100%; table-layout: fixed; }
.catalog__panel td, .catalog__panel th { overflow-wrap: anywhere; }
.catalog__table { max-width: 100%; overflow-x: auto; }
.catalog__term-description { margin-block: 18px; color: var(--catalog-copy); }
.catalog__tags a[aria-current=page] { border-color: #00d1c1; color: #9bf4e9; }
.catalog__tags picture { width: 34px; margin-inline-end: 7px; }
.catalog__tags img { display: block; width: 100%; height: 20px; object-fit: contain; }
.catalog__search { margin-block: 15px; max-width: 470px; }
.catalog__search label { display: block; margin-block-end: 6px; color: var(--catalog-copy); font-size: 13px; }
.catalog__search div { display: flex; gap: 8px; }
.catalog__search input { flex: 1; min-width: 0; padding: 8px 10px; font: inherit; color: #e6f3f1; background: #081923; border: 1px solid #49616a; border-radius: 8px; }
.catalog__search button { font: inherit; font-weight: 700; color: #050d14; background: #00d1c1; border: 0; border-radius: 8px; min-height: 44px; padding-inline: 13px; cursor: pointer; }
.catalog__search :is(input,button):focus-visible { outline: 2px solid #2dd4bf; outline-offset: 2px; }