/* ===== COLLECTION PAGE BASE ===== */

.tr-body--collection {
  /* чуть другой градиент, чтобы страница отличалась по настроению */
  background: radial-gradient(circle at top, #222a60 0, #050515 55%, #02020e 100%);
}

/* общие ограничения для изображений на этой странице (поверх .tr-img) */
.cc-hero__image .tr-img,
.cc-materials__lanes .tr-img,
.cc-bundles__grid .tr-img {
  max-width: 350px;
}

/* ===== SECTION 1: COLLECTION HERO MAP ===== */

.cc-hero {
  padding-top: 4.6rem;
  padding-bottom: 4.4rem;
}

.cc-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1.45fr);
  gap: 3.4rem;
  align-items: center;
}

.cc-hero__title {
  margin: 0 0 1rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: clamp(1.9rem, 2.2vw + 1.4rem, 2.5rem);
  letter-spacing: 0.04em;
}

.cc-hero__lead {
  margin: 0 0 1.6rem;
  font-size: 0.96rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
  max-width: 34rem;
}

.cc-hero__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.7rem;
}

.cc-filter {
  border-radius: var(--tr-radius-pill);
  border: 1px solid var(--tr-color-border-subtle);
  background: rgba(8, 10, 34, 0.9);
  padding: 0.3rem 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--tr-color-text-soft);
  cursor: pointer;
  transition:
    background-color 180ms ease-out,
    border-color 180ms ease-out,
    color 180ms ease-out,
    box-shadow 180ms ease-out,
    transform 160ms ease-out;
}

.cc-filter--active {
  background: radial-gradient(circle at top, rgba(80, 245, 210, 0.2), rgba(8, 10, 34, 0.98));
  border-color: rgba(80, 245, 210, 0.8);
  color: var(--tr-color-text);
  box-shadow: 0 0 0 1px rgba(80, 245, 210, 0.4);
}

.cc-filter:hover,
.cc-filter:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(245, 196, 81, 0.85);
  color: var(--tr-color-text);
}

.cc-hero__hint {
  margin: 0;
  font-size: 0.84rem;
  color: var(--tr-color-text-muted);
}

.cc-hero__gallery {
  position: relative;
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cc-hero__ring {
  position: absolute;
  border-radius: 999px;
  border: 1px dashed rgba(168, 176, 255, 0.45);
  inset: 12%;
  transform-origin: center;
}

.cc-hero__ring--outer {
  animation: cc-ring-spin 32s linear infinite;
  opacity: 0.45;
}

.cc-hero__ring--inner {
  inset: 22%;
  animation: cc-ring-spin-rev 40s linear infinite;
  opacity: 0.8;
}

.cc-hero__image {
  position: absolute;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    filter 220ms ease-out;
}

.cc-hero__image--main {
  position: relative;
  z-index: 3;
}

.cc-hero__image--alarm {
  right: -8%;
  top: -10%;
  z-index: 2;
  transform: translateY(8px);
}

.cc-hero__image--detail {
  left: -6%;
  bottom: -10%;
  z-index: 2;
  transform: translateY(4px);
}

.cc-hero__image--digital {
  right: -10%;
  bottom: -18%;
  z-index: 1;
  transform: translateY(10px);
}

.cc-hero__image .tr-img {
  max-width: 280px;
}

.cc-hero__image--detail .tr-img,
.cc-hero__image--alarm .tr-img,
.cc-hero__image--digital .tr-img {
  max-width: 230px;
}

.cc-hero__image:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.9);
  filter: saturate(1.05);
}

/* ===== SECTION 2: MATERIAL LANES ===== */

.cc-materials {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-materials__head {
  max-width: 640px;
  margin-bottom: 2rem;
}

.cc-materials__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-materials__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-materials__lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-lane {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: radial-gradient(circle at top, rgba(24, 28, 86, 0.95), rgba(5, 5, 21, 0.98));
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-lane__line {
  position: absolute;
  inset-inline: 12%;
  top: 0.8rem;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    rgba(80, 245, 210, 0.5),
    rgba(245, 196, 81, 0.7),
    rgba(255, 122, 155, 0.5)
  );
  opacity: 0.6;
}

.cc-lane__label {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-bottom: 0.6rem;
}

.cc-lane__tag {
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
}

.cc-lane__note {
  font-size: 0.86rem;
  color: var(--tr-color-text-soft);
}

.cc-lane__image .tr-img {
  max-width: 260px;
}

.cc-lane--wood .cc-lane__line {
  background: linear-gradient(
    90deg,
    rgba(160, 112, 60, 0.5),
    rgba(245, 196, 81, 0.75)
  );
}

.cc-lane--metal .cc-lane__line {
  background: linear-gradient(
    90deg,
    rgba(190, 198, 230, 0.6),
    rgba(168, 176, 255, 0.9)
  );
}

.cc-lane--soft .cc-lane__line {
  background: linear-gradient(
    90deg,
    rgba(255, 122, 155, 0.6),
    rgba(255, 200, 210, 0.7)
  );
}

.cc-lane:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(245, 196, 81, 0.7);
}

/* ===== SECTION 3: ROOM BUNDLES GRID ===== */

.cc-bundles {
  padding-top: 4.4rem;
  padding-bottom: 4.8rem;
}

.cc-bundles__head {
  max-width: 620px;
  margin-bottom: 2rem;
}

.cc-bundles__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-bundles__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-bundles__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-bundle {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: linear-gradient(
    135deg,
    rgba(24, 28, 86, 0.92),
    rgba(5, 5, 21, 0.98)
  );
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-bundle__image {
  margin-bottom: 0.7rem;
}

.cc-bundle__image .tr-img {
  max-width: 260px;
}

.cc-bundle__title {
  margin: 0 0 0.25rem;
  font-size: 0.98rem;
  font-weight: 500;
}

.cc-bundle__note {
  margin: 0 0 0.5rem;
  font-size: 0.88rem;
  color: var(--tr-color-text-soft);
}

.cc-bundle__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.cc-bundle__tag {
  padding: 0.18rem 0.7rem;
  border-radius: var(--tr-radius-pill);
  border: 1px dashed rgba(168, 176, 255, 0.7);
  font-size: 0.78rem;
}

.cc-bundle:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(80, 245, 210, 0.75);
}

/* ===== ANIMATIONS ===== */

@keyframes cc-ring-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes cc-ring-spin-rev {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
  }
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px) {
  .cc-hero__grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.3fr);
    gap: 2.6rem;
  }

  .cc-bundles__grid {
    gap: 1.2rem;
  }
}

@media (max-width: 880px) {
  .cc-hero__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-hero__gallery {
    order: -1;
    min-height: 280px;
  }

  .cc-hero__image--alarm {
    right: -2%;
  }

  .cc-hero__image--detail {
    left: -2%;
  }

  .cc-hero__image--digital {
    right: -4%;
  }

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

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

@media (max-width: 640px) {
  .cc-materials__lanes {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-bundles__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-hero {
    padding-top: 3.8rem;
    padding-bottom: 3.6rem;
  }
}

@media (max-width: 480px) {
  .cc-hero__title,
  .cc-materials__title,
  .cc-bundles__title {
    font-size: 1.35rem;
  }

  .cc-hero__grid {
    gap: 2.1rem;
  }

  .cc-materials,
  .cc-bundles {
    padding-top: 3.2rem;
    padding-bottom: 3.4rem;
  }

  .cc-hero__image .tr-img,
  .cc-lane__image .tr-img,
  .cc-bundle__image .tr-img {
    max-width: 220px;
  }
}
/* ===== SECTION 4: WALL-ONLY STRIP ===== */

.cc-wall {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-wall__head {
  max-width: 620px;
  margin-bottom: 1.9rem;
}

.cc-wall__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-wall__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-wall__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-wall__card {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: linear-gradient(
    135deg,
    rgba(24, 28, 86, 0.92),
    rgba(5, 5, 21, 0.98)
  );
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-wall__image {
  margin-bottom: 0.6rem;
}

.cc-wall__image .tr-img {
  max-width: 260px;
}

.cc-wall__card-title {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-wall__card-text {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-wall__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(245, 196, 81, 0.7);
}

/* ===== SECTION 5: ALARM SHELF ===== */

.cc-alarms {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-alarms__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.4fr);
  gap: 3rem;
  align-items: center;
}

.cc-alarms__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-alarms__lead {
  margin: 0 0 1rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-alarms__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-alarms__item + .cc-alarms__item {
  margin-top: 0.3rem;
}

.cc-alarms__visual {
  position: relative;
  min-height: 260px;
}

.cc-alarms__image {
  position: absolute;
  border-radius: var(--tr-radius-lg);
  box-shadow: var(--tr-shadow-subtle);
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    filter 220ms ease-out;
}

.cc-alarms__image--shelf {
  position: relative;
  z-index: 2;
  transform: rotate(-2deg);
}

.cc-alarms__image--close {
  right: -6%;
  bottom: -14%;
  z-index: 1;
  transform: rotate(3deg);
}

.cc-alarms__image .tr-img {
  max-width: 260px;
}

.cc-alarms__image:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.9);
  filter: saturate(1.06);
}

/* ===== SECTION 6: COLOUR PALETTES ===== */

.cc-palettes {
  padding-top: 4.4rem;
  padding-bottom: 4.8rem;
}

.cc-palettes__head {
  max-width: 620px;
  margin-bottom: 2rem;
}

.cc-palettes__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-palettes__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-palettes__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-palette {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: radial-gradient(circle at top, rgba(24, 28, 86, 0.95), rgba(5, 5, 21, 0.98));
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-palette__stripe {
  position: absolute;
  inset-inline: -20%;
  top: -40%;
  height: 60%;
  opacity: 0.6;
}

.cc-palette--mono .cc-palette__stripe {
  background: linear-gradient(
    90deg,
    rgba(15, 15, 20, 0.8),
    rgba(180, 188, 210, 0.8)
  );
}

.cc-palette--warm .cc-palette__stripe {
  background: linear-gradient(
    90deg,
    rgba(150, 90, 50, 0.8),
    rgba(245, 196, 81, 0.9)
  );
}

.cc-palette--pastel .cc-palette__stripe {
  background: linear-gradient(
    90deg,
    rgba(166, 210, 255, 0.9),
    rgba(190, 238, 210, 0.9)
  );
}

.cc-palette__body {
  position: relative;
  z-index: 1;
  margin-bottom: 0.6rem;
}

.cc-palette__title {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-palette__note {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-palette__image {
  position: relative;
  z-index: 1;
}

.cc-palette__image .tr-img {
  max-width: 260px;
}

.cc-palette:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(80, 245, 210, 0.75);
}
  .cc-wall__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc-alarms__wrap {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-alarms__visual {
    order: -1;
    min-height: 230px;
  }

  .cc-palettes__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cc-wall__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-palettes__grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .cc-wall,
  .cc-alarms,
  .cc-palettes {
    padding-top: 3.2rem;
    padding-bottom: 3.4rem;
  }

  .cc-wall__image .tr-img,
  .cc-alarms__image .tr-img,
  .cc-palette__image .tr-img {
    max-width: 220px;
  }
/* ===== SECTION 7: SILENCE PATH ===== */

.cc-silence {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-silence__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.4fr);
  gap: 3rem;
  align-items: center;
}

.cc-silence__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-silence__lead {
  margin: 0 0 1.2rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-silence__scale {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.7rem;
}

.cc-silence__step {
  position: relative;
  padding: 0.55rem 0.9rem 0.55rem 1.8rem;
  border-radius: var(--tr-radius-lg);
  border: 1px dashed var(--tr-color-border-subtle);
  background: radial-gradient(circle at left, rgba(80, 245, 210, 0.2), rgba(5, 5, 21, 0.98));
}

.cc-silence__step::before {
  content: "";
  position: absolute;
  left: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: radial-gradient(circle, var(--tr-color-accent-cool) 0, transparent 60%);
  box-shadow: 0 0 18px rgba(80, 245, 210, 0.8);
}

.cc-silence__label {
  display: block;
  font-size: 0.9rem;
  font-weight: 500;
}

.cc-silence__note {
  display: block;
  font-size: 0.84rem;
  color: var(--tr-color-text-soft);
  margin-top: 0.1rem;
}

.cc-silence__visual {
  position: relative;
  min-height: 260px;
}

.cc-silence__image {
  position: absolute;
  border-radius: var(--tr-radius-lg);
  box-shadow: var(--tr-shadow-subtle);
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    filter 220ms ease-out;
}

.cc-silence__image--bedroom {
  position: relative;
  z-index: 2;
  transform: rotate(-2deg);
}

.cc-silence__image--label {
  right: -6%;
  bottom: -14%;
  z-index: 1;
  transform: rotate(3deg);
}

.cc-silence__image .tr-img {
  max-width: 260px;
}

.cc-silence__image:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.9);
  filter: saturate(1.06);
}

.cc-silence__glow {
  position: absolute;
  inset: 10% 14%;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(80, 245, 210, 0.18), transparent 70%);
  filter: blur(6px);
  opacity: 0.8;
}

/* ===== SECTION 8: DESK CLUSTERS ===== */

.cc-desks {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-desks__head {
  max-width: 640px;
  margin-bottom: 1.9rem;
}

.cc-desks__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-desks__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-desks__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-desk {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: linear-gradient(
    135deg,
    rgba(24, 28, 86, 0.92),
    rgba(5, 5, 21, 0.98)
  );
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-desk__image {
  margin-bottom: 0.6rem;
}

.cc-desk__image .tr-img {
  max-width: 260px;
}

.cc-desk__title {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-desk__note {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-desk:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(245, 196, 81, 0.7);
}

/* ===== SECTION 9: KIDS & LEARNING ===== */

.cc-kids {
  padding-top: 4.4rem;
  padding-bottom: 4.8rem;
}

.cc-kids__intro {
  max-width: 640px;
  margin-bottom: 1.8rem;
}

.cc-kids__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-kids__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-kids__content {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.4fr);
  gap: 3rem;
  align-items: flex-start;
}

.cc-kids__list {
  display: grid;
  gap: 0.9rem;
}

.cc-kids__item {
  padding: 0.8rem 1rem 0.9rem;
  border-radius: var(--tr-radius-lg);
  border: 1px dashed var(--tr-color-border-subtle);
  background: radial-gradient(circle at top left, rgba(255, 200, 210, 0.18), rgba(5, 5, 21, 0.98));
}

.cc-kids__item-title {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-kids__item-text {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-kids__gallery {
  position: relative;
  min-height: 260px;
}

.cc-kids__image {
  position: absolute;
  border-radius: var(--tr-radius-lg);
  box-shadow: var(--tr-shadow-subtle);
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    filter 220ms ease-out;
}

.cc-kids__image--room {
  position: relative;
  z-index: 2;
  transform: rotate(-2deg);
}

.cc-kids__image--closeup {
  right: -6%;
  top: 4%;
  z-index: 1;
  transform: rotate(3deg);
}

.cc-kids__image--table {
  right: -2%;
  bottom: -16%;
  z-index: 1;
  transform: rotate(-3deg);
}

.cc-kids__image .tr-img {
  max-width: 250px;
}

.cc-kids__image:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.9);
  filter: saturate(1.06);
}
  .cc-silence__wrap,
  .cc-kids__content {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-silence__visual,
  .cc-kids__gallery {
    order: -1;
    min-height: 230px;
  }

  .cc-desks__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cc-silence,
  .cc-desks,
  .cc-kids {
    padding-top: 3.2rem;
    padding-bottom: 3.4rem;
  }

  .cc-silence__title,
  .cc-desks__title,
  .cc-kids__title {
    font-size: 1.35rem;
  }

  .cc-silence__image .tr-img,
  .cc-desk__image .tr-img,
  .cc-kids__image .tr-img {
    max-width: 220px;
  }
/* ===== SECTION 10: EVENING & LOW LIGHT ===== */

.cc-evening {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-evening__head {
  max-width: 640px;
  margin-bottom: 1.9rem;
}

.cc-evening__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-evening__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-evening__band {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-evening__tile {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: radial-gradient(circle at top, rgba(24, 28, 86, 0.95), rgba(5, 5, 21, 0.98));
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-evening__tile::before {
  content: "";
  position: absolute;
  inset-inline: -20%;
  top: -50%;
  height: 60%;
  background: linear-gradient(
    90deg,
    rgba(80, 245, 210, 0.2),
    rgba(245, 196, 81, 0.3),
    rgba(255, 122, 155, 0.25)
  );
  opacity: 0.6;
}

.cc-evening__tile-title {
  position: relative;
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-evening__tile-text {
  position: relative;
  margin: 0 0 0.6rem;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-evening__image {
  position: relative;
  z-index: 1;
}

.cc-evening__image .tr-img {
  max-width: 260px;
}

.cc-evening__tile:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(80, 245, 210, 0.75);
}

/* ===== SECTION 11: ENTRY & HALLWAY ===== */

.cc-entry {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-entry__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.4fr);
  gap: 3rem;
  align-items: center;
}

.cc-entry__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-entry__lead {
  margin: 0 0 1.1rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-entry__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-entry__item + .cc-entry__item {
  margin-top: 0.35rem;
}

.cc-entry__gallery {
  position: relative;
  min-height: 260px;
  overflow: hidden;
}

.cc-entry__image {
  position: absolute;
  border-radius: var(--tr-radius-lg);
  box-shadow: var(--tr-shadow-subtle);
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    filter 220ms ease-out;
}

.cc-entry__image--console {
  position: relative;
  z-index: 2;
  transform: rotate(-2deg);
}

.cc-entry__image--hallway {
  right: -6%;
  top: 4%;
  z-index: 1;
  transform: rotate(3deg);
}

.cc-entry__image--bench {
  right: -2%;
  bottom: -16%;
  z-index: 1;
  transform: rotate(-3deg);
}

.cc-entry__image .tr-img {
  max-width: 250px;
}

.cc-entry__image:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.9);
  filter: saturate(1.06);
}

/* ===== SECTION 12: SHELVES & STYLING ===== */

.cc-styling {
  padding-top: 4.4rem;
  padding-bottom: 4.8rem;
}

.cc-styling__head {
  max-width: 640px;
  margin-bottom: 1.9rem;
}

.cc-styling__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-styling__text {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-styling__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-style {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: linear-gradient(
    135deg,
    rgba(24, 28, 86, 0.92),
    rgba(5, 5, 21, 0.98)
  );
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-style__title {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-style__note {
  margin: 0 0 0.6rem;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-style__image {
  position: relative;
  z-index: 1;
}

.cc-style__image .tr-img {
  max-width: 260px;
}

.cc-style:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(245, 196, 81, 0.7);
}
  .cc-evening__band {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc-entry__wrap {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-entry__gallery {
    order: -1;
    min-height: 230px;
  }

  .cc-styling__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cc-evening,
  .cc-entry,
  .cc-styling {
    padding-top: 3.2rem;
    padding-bottom: 3.4rem;
  }

  .cc-evening__title,
  .cc-entry__title,
  .cc-styling__title {
    font-size: 1.35rem;
  }

  .cc-evening__image .tr-img,
  .cc-entry__image .tr-img,
  .cc-style__image .tr-img {
    max-width: 220px;
  }
/* ===== SECTION 13: TIME ZONES & DISTANCE ===== */

.cc-zones {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-zones__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.4fr);
  gap: 3rem;
  align-items: center;
}

.cc-zones__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-zones__lead {
  margin: 0 0 1.1rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-zones__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-zones__item + .cc-zones__item {
  margin-top: 0.35rem;
}

.cc-zones__visual {
  position: relative;
  min-height: 260px;
}

.cc-zones__image {
  position: absolute;
  border-radius: var(--tr-radius-lg);
  box-shadow: var(--tr-shadow-subtle);
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    filter 220ms ease-out;
}

.cc-zones__image--wall {
  position: relative;
  z-index: 2;
  transform: rotate(-2deg);
}

.cc-zones__image--desk {
  right: -6%;
  bottom: -14%;
  z-index: 1;
  transform: rotate(3deg);
}

.cc-zones__image .tr-img {
  max-width: 260px;
}

.cc-zones__image:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.9);
  filter: saturate(1.06);
}

/* ===== SECTION 14: LIMITED RUNS & SPECIAL FINISHES ===== */

.cc-limited {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-limited__head {
  max-width: 640px;
  margin-bottom: 1.8rem;
}

.cc-limited__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-limited__text {
  margin: 0 0 0.9rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-limited__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.cc-limited__chip {
  padding: 0.18rem 0.8rem;
  border-radius: var(--tr-radius-pill);
  border: 1px solid rgba(168, 176, 255, 0.7);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-family: "Space Grotesk", system-ui, sans-serif;
  color: var(--tr-color-text-soft);
}

.cc-limited__grid {
  margin-top: 1.6rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-limited__card {
  position: relative;
  padding: 1rem 1rem 1.2rem;
  border-radius: var(--tr-radius-lg);
  border: 1px solid var(--tr-color-border-subtle);
  background: radial-gradient(circle at top, rgba(24, 28, 86, 0.95), rgba(5, 5, 21, 0.98));
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transform-origin: center;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    border-color 220ms ease-out;
}

.cc-limited__image {
  margin-bottom: 0.6rem;
}

.cc-limited__image .tr-img {
  max-width: 260px;
}

.cc-limited__card-title {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-limited__card-text {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-limited__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 65px rgba(0, 0, 0, 0.9);
  border-color: rgba(245, 196, 81, 0.7);
}

/* ===== SECTION 15: HOW TO READ COLLECTION NOTES ===== */

.cc-notes {
  padding-top: 4.4rem;
  padding-bottom: 4.8rem;
}

.cc-notes__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.3fr);
  gap: 3rem;
  align-items: center;
}

.cc-notes__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-notes__lead {
  margin: 0 0 1.1rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-notes__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.1rem;
}

.cc-notes__item {
  padding: 0.8rem 0.9rem 0.9rem;
  border-radius: var(--tr-radius-lg);
  border: 1px dashed var(--tr-color-border-subtle);
  background: radial-gradient(circle at top left, rgba(80, 245, 210, 0.16), rgba(5, 5, 21, 0.98));
}

.cc-notes__item-title {
  margin: 0 0 0.3rem;
  font-size: 0.94rem;
  font-weight: 500;
}

.cc-notes__item-text {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-notes__footnote {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--tr-color-text-muted);
}

.cc-notes__visual {
  position: relative;
  min-height: 240px;
}

.cc-notes__image {
  position: relative;
  border-radius: var(--tr-radius-lg);
  box-shadow: var(--tr-shadow-subtle);
  overflow: hidden;
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    filter 220ms ease-out;
}

.cc-notes__image .tr-img {
  max-width: 260px;
}

.cc-notes__image:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.9);
  filter: saturate(1.06);
}
  .cc-zones__wrap,
  .cc-notes__wrap {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-zones__visual,
  .cc-notes__visual {
    order: -1;
    min-height: 230px;
  }

  .cc-notes__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cc-zones,
  .cc-limited,
  .cc-notes {
    padding-top: 3.2rem;
    padding-bottom: 3.4rem;
  }

  .cc-zones__title,
  .cc-limited__title,
  .cc-notes__title {
    font-size: 1.35rem;
  }

  .cc-zones__image .tr-img,
  .cc-limited__image .tr-img,
  .cc-notes__image .tr-img {
    max-width: 220px;
  }
/* ===== SECTION 16: LONGEVITY & CARE ZONE ===== */

.cc-longevity {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-longevity__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.3fr);
  gap: 3rem;
  align-items: center;
}

.cc-longevity__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-longevity__lead {
  margin: 0 0 1.1rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-longevity__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-longevity__item + .cc-longevity__item {
  margin-top: 0.35rem;
}

.cc-longevity__image {
  justify-self: center;
}

.cc-longevity__image .tr-img {
  max-width: 260px;
  display: block;
}

/* ===== SECTION 17: QUICK COMPARE STRIP ===== */

.cc-compare {
  padding-top: 4.4rem;
  padding-bottom: 4.4rem;
}

.cc-compare__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.3fr);
  gap: 3rem;
  align-items: center;
}

.cc-compare__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-compare__lead {
  margin: 0 0 1.1rem;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-compare__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 0.9rem;
}

.cc-compare__item {
  padding: 0.8rem 0.9rem 0.9rem;
  border-radius: var(--tr-radius-lg);
  border: 1px dashed var(--tr-color-border-subtle);
  background: radial-gradient(circle at top left, rgba(80, 245, 210, 0.16), rgba(5, 5, 21, 0.98));
}

.cc-compare__item-title {
  margin: 0 0 0.3rem;
  font-size: 0.94rem;
  font-weight: 500;
}

.cc-compare__item-text {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-compare__note {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--tr-color-text-muted);
}

.cc-compare__image {
  justify-self: center;
}

.cc-compare__image .tr-img {
  max-width: 260px;
  display: block;
}

/* ===== SECTION 18: COLLECTION OUTRO & NEXT STEPS ===== */

.cc-outro {
  padding-top: 4.4rem;
  padding-bottom: 4.8rem;
}

.cc-outro__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.4fr);
  gap: 3rem;
  align-items: flex-start;
}

.cc-outro__title {
  margin: 0 0 0.9rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
}

.cc-outro__lead {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-outro__columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.4rem;
}

.cc-outro__column-title {
  margin: 0 0 0.3rem;
  font-size: 0.96rem;
  font-weight: 500;
}

.cc-outro__column-text {
  margin: 0 0 0.4rem;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--tr-color-text-soft);
}

.cc-outro__link-line {
  margin: 0;
}

.cc-outro__link {
  font-size: 0.88rem;
  font-family: "Space Grotesk", system-ui, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  text-decoration: none;
  color: var(--tr-color-accent);
  border-bottom: 1px solid rgba(80, 245, 210, 0.6);
  padding-bottom: 0.1rem;
  transition:
    color 180ms ease-out,
    border-color 180ms ease-out,
    transform 160ms ease-out;
}

.cc-outro__link:hover,
.cc-outro__link:focus-visible {
  color: var(--tr-color-text);
  border-color: rgba(245, 196, 81, 0.8);
  transform: translateY(-1px);
}

.cc-outro__footnote {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--tr-color-text-muted);
  margin-top: 1.2rem;
}
  .cc-longevity__wrap,
  .cc-compare__wrap,
  .cc-outro__wrap {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-longevity__image,
  .cc-compare__image {
    margin-top: 1.2rem;
  }

  .cc-outro__columns {
    grid-template-columns: minmax(0, 1fr);
  }
  .cc-longevity,
  .cc-compare,
  .cc-outro {
    padding-top: 3.2rem;
    padding-bottom: 3.4rem;
  }

  .cc-longevity__title,
  .cc-compare__title,
  .cc-outro__title {
    font-size: 1.35rem;
  }

  .cc-longevity__image .tr-img,
  .cc-compare__image .tr-img {
    max-width: 220px;
  }
/* ===== COLLECTION PAGE MOBILE ===== */

/* планшеты и узкие ноутбуки */
@media (max-width: 900px) {
  .cc-hero__layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.4rem;
  }

  .cc-hero__copy {
    max-width: 34rem;
  }

  .cc-hero__stack {
    justify-self: center;
    transform: scale(0.9);
  }
}

/* телефоны, вертикальный режим */
@media (max-width: 640px) {
  .cc-hero {
    padding-top: 3.4rem;
    padding-bottom: 3.4rem;
  }

  .cc-hero__layout {
    gap: 2rem;
  }

  .cc-hero__eyebrow {
    font-size: 0.78rem;
  }

  .cc-hero__title {
    font-size: 1.4rem;
  }

  .cc-hero__lead {
    font-size: 0.9rem;
  }

  .cc-hero__stack {
    transform: scale(0.8);
    transform-origin: center top;
  }

  .cc-hero__card--back,
  .cc-hero__card--middle,
  .cc-hero__card--front {
    border-radius: 18px;
  }

  /* любые двухколоночные ряды — в одну колонку */
  .cc-row,
  .cc-row--reverse,
  .cc-row--split {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.6rem;
  }

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

/* самые маленькие экраны */
@media (max-width: 480px) {
  .cc-hero__title {
    font-size: 1.3rem;
  }

  .cc-hero__stack {
    transform: scale(0.75);
  }

  .cc-grid-3 {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-card__title {
    font-size: 0.96rem;
  }

  .cc-card__text {
    font-size: 0.86rem;
  }
}
/* ===== MOBILE: hero stack without overlap ===== */

@media (max-width: 640px) {
  .cc-hero__stack {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9rem;
    transform: none;          /* убираем масштаб / сдвиги */
  }

  .cc-hero__card {
    position: relative;
    inset: auto;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    transform: none;          /* убираем повороты / смещения */
    width: 100%;
    max-width: 320px;         /* не больше 350px, как ты просил */
  }

  .cc-hero__card img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 320px;
  }

  /* если есть специальные модификаторы с позиционированием — гасим их */
  .cc-hero__card--back,
  .cc-hero__card--middle,
  .cc-hero__card--front {
    box-shadow: var(--tr-shadow-subtle); /* тень оставим, но без наложения */
  }
}