/* Compact unified product catalogue. Scoped to leave the remaining Products page intact. */
body[data-page="products"] .products-catalog {
  --catalog-navy: #061426;
  --catalog-ink: #0b1f3a;
  --catalog-muted: #627084;
  --catalog-line: #d7e0e9;
  padding-block: clamp(62px, 5vw, 80px);
  background: #fff;
}

body[data-page="products"] .products-catalog .container { max-width: 1400px; }
body[data-page="products"] .products-catalog .eyebrow { color: #a47600; }

.products-catalog__heading { max-width: 820px; }
.products-catalog__heading h2 { margin: 0; color: var(--catalog-ink); }
.products-catalog__heading > p:not(.eyebrow) {
  max-width: 720px;
  margin: 14px 0 0;
  color: var(--catalog-muted);
  font-size: 16px;
  line-height: 1.6;
}

.products-catalog__nav {
  display: flex;
  gap: 8px;
  margin-top: 26px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--catalog-line);
  overflow-x: auto;
  scrollbar-width: thin;
}
.products-catalog__nav a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--catalog-line);
  border-radius: 10px;
  color: #314258;
  background: #fff;
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
  transition: border-color .22s, color .22s, background-color .22s;
}
.products-catalog__nav a:hover,
.products-catalog__nav a:focus-visible {
  border-color: #0063f6;
  color: #0063f6;
  background: #f8fbff;
  outline: none;
}

.products-catalog__group { scroll-margin-top: 92px; }
.products-catalog__special { margin-top: 28px; }
.products-catalog__feature-grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 16px;
}
.catalog-feature {
  position: relative;
  display: flex;
  min-height: clamp(280px, 23vw, 320px);
  overflow: hidden;
  align-items: flex-end;
  border-radius: 12px;
  background: var(--catalog-navy);
  isolation: isolate;
}
.catalog-feature__image,
.catalog-card__image { position: relative; overflow: hidden; background: #dbe2e8; }
.catalog-feature__image { position: absolute; inset: 0; z-index: -2; }
.catalog-feature__image::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(90deg, rgba(4, 15, 32, .9), rgba(4, 15, 32, .53) 61%, rgba(4, 15, 32, .16)), linear-gradient(0deg, rgba(4, 15, 32, .64), transparent 58%);
}
.catalog-feature__image img,
.catalog-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.catalog-feature:hover .catalog-feature__image img,
.catalog-card:hover .catalog-card__image img { transform: scale(1.04); }
.catalog-feature__content { max-width: 610px; padding: 24px; }
.catalog-feature__content .catalog-label { color: #ffd052; }
.catalog-feature__content h3 {
  margin: 9px 0 0;
  color: #fff;
  font-size: clamp(25px, 2.35vw, 36px);
  line-height: 1.06;
}
.catalog-feature__content p:not(.catalog-label) {
  display: -webkit-box;
  margin: 10px 0 0;
  overflow: hidden;
  color: rgba(255, 255, 255, .78);
  font-size: 14px;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.catalog-feature--compact { min-height: clamp(280px, 23vw, 320px); }
.catalog-feature--compact .catalog-feature__image::after { background: linear-gradient(0deg, rgba(4, 15, 32, .92), rgba(4, 15, 32, .16) 76%); }
.catalog-feature--compact .catalog-feature__content h3 { font-size: clamp(23px, 2vw, 30px); }

.catalog-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  margin-top: 16px;
  padding: 0 15px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #101923;
  background: #ffc928;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  transition: border-color .22s, color .22s, background-color .22s;
}
.catalog-action:hover,
.catalog-action:focus-visible { border-color: #0063f6; color: #0063f6; background: transparent; outline: none; }

/* One visual catalogue: groups are separated by lines and rhythm, not separate backgrounds. */
.catalog-group {
  padding-block: clamp(40px, 4vw, 54px);
  border-top: 1px solid var(--catalog-line);
  background: transparent;
}
.catalog-group--construction { margin-top: 42px; }
.catalog-group__head {
  display: grid;
  grid-template-columns: auto minmax(0, .92fr) minmax(300px, 1.08fr);
  gap: 16px;
  align-items: center;
  margin-bottom: 22px;
}
.catalog-group__number {
  color: #c79610;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .16em;
}
.catalog-group__head h3 {
  margin: 0;
  color: var(--catalog-ink);
  font-size: clamp(25px, 2.25vw, 34px);
  line-height: 1.1;
}
.catalog-group__head > p {
  max-width: 560px;
  margin: 0 0 0 auto;
  color: var(--catalog-muted);
  font-size: 14px;
  line-height: 1.5;
}
.catalog-grid { display: grid; gap: 14px; }
.catalog-grid--construction,
.catalog-grid--tanks { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.catalog-grid--rolled { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.catalog-card {
  display: flex;
  min-width: 0;
  min-height: 100%;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--catalog-line);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(11, 31, 58, .035);
  transition: border-color .24s, box-shadow .24s, transform .24s;
}
.catalog-card:hover {
  border-color: #aebfd0;
  box-shadow: 0 12px 30px rgba(11, 31, 58, .09);
  transform: translateY(-3px);
}
.catalog-card__image { height: 172px; }
.catalog-grid--rolled .catalog-card__image { height: 150px; }
.catalog-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 14px 15px 15px;
}
.catalog-label {
  margin: 0;
  color: #7f8b9a;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.catalog-card h4 {
  margin: 7px 0 0;
  color: var(--catalog-ink);
  font-size: 18px;
  line-height: 1.17;
  letter-spacing: -.018em;
}
.catalog-card__body > p:not(.catalog-label) {
  display: -webkit-box;
  margin: 8px 0 0;
  overflow: hidden;
  color: #647185;
  font-size: 13px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.catalog-grid--rolled .catalog-card__body > p:not(.catalog-label) { -webkit-line-clamp: 1; }
.catalog-card .catalog-action {
  align-self: flex-start;
  min-height: 28px;
  margin-top: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--catalog-ink);
  background: transparent;
}
.catalog-card .catalog-action::after {
  margin-left: 8px;
  content: "→";
  color: #c79610;
  font-size: 17px;
  line-height: 1;
  transition: transform .2s;
}
.catalog-card:hover .catalog-action::after { transform: translateX(4px); }
.catalog-card .catalog-action:hover,
.catalog-card .catalog-action:focus-visible { color: #0063f6; background: transparent; }

@media (max-width: 1279px) {
  .catalog-grid--construction,
  .catalog-grid--tanks,
  .catalog-grid--rolled { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-card__image { height: 180px; }
  .catalog-grid--rolled .catalog-card__image { height: 158px; }
}

@media (max-width: 1024px) {
  .products-catalog__feature-grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
  .catalog-feature,
  .catalog-feature--compact { min-height: 290px; }
  .catalog-group__head { grid-template-columns: auto minmax(0, 1fr); gap: 12px 16px; }
  .catalog-group__head > p { grid-column: 2; max-width: none; margin: 0; }
}

@media (max-width: 767px) {
  .products-catalog { padding-block: 58px; }
  .products-catalog__heading > p:not(.eyebrow),
  .catalog-group__head > p { font-size: 15px; }
  .products-catalog__nav { margin-inline: -16px; padding-inline: 16px; }
  .products-catalog__feature-grid,
  .catalog-grid--construction,
  .catalog-grid--tanks,
  .catalog-grid--rolled { grid-template-columns: 1fr; }
  .catalog-feature,
  .catalog-feature--compact { min-height: 320px; }
  .catalog-feature__content { padding: 22px; }
  .catalog-feature__content h3 { font-size: clamp(25px, 7.5vw, 34px); }
  .catalog-group--construction { margin-top: 34px; }
  .catalog-group { padding-block: 36px; }
  .catalog-group__head { grid-template-columns: 1fr; gap: 10px; margin-bottom: 18px; }
  .catalog-group__head > p { grid-column: auto; }
  .catalog-card__image,
  .catalog-grid--rolled .catalog-card__image { height: 220px; }
  .catalog-card__body { padding: 15px 16px 16px; }
  .catalog-card h4 { font-size: 19px; }
  .catalog-card__body > p:not(.catalog-label),
  .catalog-grid--rolled .catalog-card__body > p:not(.catalog-label) { -webkit-line-clamp: 2; font-size: 14px; }
}

@media (max-width: 430px) {
  .products-catalog__nav { gap: 7px; }
  .products-catalog__nav a { min-height: 44px; padding-inline: 13px; }
  .catalog-feature,
  .catalog-feature--compact { min-height: 300px; }
  .catalog-card__image,
  .catalog-grid--rolled .catalog-card__image { height: 205px; }
}