.catalog-new-hero {
  min-height: 680px;
  padding: 150px 0 70px;
  background:
    linear-gradient(rgba(255,255,255,.93), rgba(255,255,255,.93)),
    repeating-linear-gradient(0deg, transparent 0 39px, rgba(18,18,18,.06) 40px),
    repeating-linear-gradient(90deg, transparent 0 39px, rgba(18,18,18,.06) 40px);
}

.catalog-new-wrap {
  width: min(1240px, calc(100% - 40px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  gap: 64px;
  align-items: center;
}

.catalog-new-kicker {
  display: inline-flex;
  padding: 8px 13px;
  border-left: 3px solid #ff6b00;
  background: rgba(255,107,0,.08);
  color: #111;
  font: 700 12px/1.2 Manrope, sans-serif;
  letter-spacing: .12em;
}

.catalog-new-title {
  margin: 24px 0 22px;
  color: #101010;
  font: 700 clamp(48px, 6vw, 88px)/.94 "Playfair Display", serif;
  letter-spacing: -.04em;
}

.catalog-new-title span { color: #ff6b00; }
.catalog-new-lead { max-width: 720px; color: #454545; font: 400 19px/1.7 Inter, sans-serif; }
.catalog-new-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.catalog-new-actions .btn-primary,
.catalog-new-actions .btn-outline {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  padding: 0 25px;
  border: 1px solid #ff6b00;
  border-radius: 0;
  font: 700 13px/1 Manrope, sans-serif;
  letter-spacing: .04em;
  text-decoration: none;
  cursor: pointer;
  transition: transform .25s ease, background .25s ease, color .25s ease;
}
.catalog-new-actions .btn-primary { background: #ff6b00; color: #fff; }
.catalog-new-actions .btn-outline { background: transparent; color: #111; }
.catalog-new-actions .btn-primary:hover,
.catalog-new-actions .btn-outline:hover { transform: translateY(-2px); background: #111; border-color: #111; color: #fff; }
.catalog-new-image { position: relative; min-height: 520px; background: #111; overflow: hidden; box-shadow: 22px 22px 0 #ff6b00; }
.catalog-new-image img { width: 100%; height: 100%; min-height: 520px; object-fit: cover; }
.catalog-new-image::after { content: "CMP / ТОЛЬЯТТИ"; position: absolute; right: 18px; bottom: 16px; color: #fff; font: 700 11px/1 Manrope, sans-serif; letter-spacing: .16em; }

.catalog-new-section { padding: 88px 0; background: #f4f1eb; }
.catalog-new-section.dark { background: #111; color: #fff; }
.catalog-new-grid { width: min(1240px, calc(100% - 40px)); margin: 0 auto; }
.catalog-new-head { max-width: 820px; margin-bottom: 42px; }
.catalog-new-head h2 { margin: 12px 0; font: 700 clamp(36px, 5vw, 62px)/1 "Playfair Display", serif; }
.catalog-new-head p { color: #676767; font: 400 17px/1.65 Inter, sans-serif; }
.dark .catalog-new-head p { color: #bbb; }
.catalog-new-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.catalog-new-card { padding: 28px; border: 1px solid rgba(17,17,17,.14); background: #fff; min-height: 190px; }
.catalog-new-card b { display: block; margin-bottom: 12px; color: #ff6b00; font: 700 12px/1 Manrope, sans-serif; letter-spacing: .12em; }
.catalog-new-card h3 { margin: 0 0 12px; font: 700 24px/1.15 "Playfair Display", serif; }
.catalog-new-card p { margin: 0; color: #626262; line-height: 1.6; }
.catalog-new-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: #363636; }
.catalog-new-step { min-height: 210px; padding: 28px; background: #181818; }
.catalog-new-step span { color: #ff6b00; font: 700 42px/1 "Playfair Display", serif; }
.catalog-new-step h3 { margin: 24px 0 10px; font-size: 20px; }
.catalog-new-step p { margin: 0; color: #aaa; line-height: 1.55; }
.catalog-new-note { margin-top: 28px; padding: 20px 24px; border-left: 3px solid #ff6b00; background: #222; color: #d6d6d6; line-height: 1.65; }

@media (max-width: 900px) {
  .catalog-new-hero { padding-top: 120px; }
  .catalog-new-wrap { grid-template-columns: 1fr; gap: 35px; }
  .catalog-new-image, .catalog-new-image img { min-height: 360px; }
  .catalog-new-cards { grid-template-columns: 1fr; }
  .catalog-new-steps { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .catalog-new-wrap, .catalog-new-grid { width: min(100% - 24px, 1240px); }
  .catalog-new-title { font-size: 44px; }
  .catalog-new-lead { font-size: 16px; }
  .catalog-new-image, .catalog-new-image img { min-height: 270px; }
  .catalog-new-steps { grid-template-columns: 1fr; }
}
