.canonical-catalog {
  width: min(1180px, calc(100% - 32px));
  margin: 80px auto;
  padding: clamp(24px, 5vw, 58px);
  border: 1px solid rgba(16, 39, 31, 0.14);
  border-radius: 34px;
  color: #10271f;
  background:
    linear-gradient(90deg, rgba(240, 166, 41, 0.12) 1px, transparent 1px),
    linear-gradient(#fffdf5, #f5f0df);
  background-size: 28px 100%, auto;
}

.canonical-catalog__intro { max-width: 760px; }
.canonical-catalog__intro h2 { margin: 8px 0 14px; font-size: clamp(2rem, 5vw, 4.2rem); line-height: 0.98; }
.canonical-catalog__intro > p:last-child { max-width: 680px; color: rgba(16, 39, 31, 0.7); line-height: 1.65; }

.canonical-catalog__identity {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 20px;
  margin: 34px 0 22px;
  padding: 22px;
  border-left: 6px solid #f0a629;
  border-radius: 8px 22px 22px 8px;
  background: #0f6a4f;
  color: white;
}

.canonical-catalog__identity h3,
.canonical-catalog__identity p { margin: 0; }
.canonical-catalog__code { grid-row: 1 / 4; align-self: center; font-size: 0.72rem; font-weight: 900; letter-spacing: 0.08em; writing-mode: vertical-rl; }
.canonical-catalog__variant { color: #ffd27a; font-size: 0.76rem; font-weight: 800; }
.canonical-catalog__controls { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0; }

.canonical-catalog__mode {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid rgba(16, 39, 31, 0.2);
  border-radius: 999px;
  background: white;
  color: #10271f;
  font: inherit;
  font-weight: 850;
  cursor: pointer;
}

.canonical-catalog__mode[aria-pressed="true"] { border-color: #0f6a4f; background: #0f6a4f; color: white; }
.canonical-catalog__summary { font-weight: 850; }
.canonical-catalog__offers { display: grid; gap: 10px; }

.canonical-offer {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) minmax(210px, auto);
  gap: 16px;
  align-items: center;
  padding: 17px;
  border: 1px solid rgba(16, 39, 31, 0.14);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.92);
}

.canonical-offer--blocked { opacity: 0.68; }
.canonical-offer__position { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 14px; background: #f0a629; font-weight: 950; }
.canonical-offer__copy h3 { margin: 3px 0; font-size: 1rem; }
.canonical-offer__copy p,
.canonical-offer__copy small { display: block; margin: 0; color: rgba(16, 39, 31, 0.64); }
.canonical-offer__id { color: #0f6a4f; font-size: 0.68rem; font-weight: 900; letter-spacing: 0.06em; }
.canonical-offer__price { display: grid; gap: 3px; text-align: right; font-size: 0.76rem; }
.canonical-offer__price strong { font-size: 1rem; }
.canonical-offer__price small { color: #9b2f21; }
.canonical-catalog__notice { margin: 18px 0 0; color: rgba(16, 39, 31, 0.62); font-size: 0.72rem; }

.canonical-catalog__mode:focus-visible,
.canonical-offer:focus-within { outline: 3px solid #f0a629; outline-offset: 3px; }

@media (max-width: 720px) {
  .canonical-catalog { width: calc(100% - 20px); margin: 46px auto; padding: 22px 16px; border-radius: 24px; }
  .canonical-catalog__identity { grid-template-columns: 1fr; }
  .canonical-catalog__code { grid-row: auto; writing-mode: horizontal-tb; }
  .canonical-catalog__mode { flex: 1 1 150px; }
  .canonical-offer { grid-template-columns: 44px minmax(0, 1fr); }
  .canonical-offer__price { grid-column: 1 / -1; padding-top: 10px; border-top: 1px solid rgba(16, 39, 31, 0.1); text-align: left; }
}

@media (prefers-reduced-motion: reduce) { .canonical-catalog * { scroll-behavior: auto !important; transition: none !important; } }