main.page-ruletka {
  overflow: clip;
}

.page-ruletka .ruletka-hero {
  position: relative;
  min-height: 47.5rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: end;
  isolation: isolate;
  color: var(--color-white-on-dark);
  background: var(--color-deep-ink);
}

.page-ruletka .ruletka-hero__media,
.page-ruletka .ruletka-hero__media::after {
  position: absolute;
  inset: 0;
}

.page-ruletka .ruletka-hero__media {
  z-index: -2;
  overflow: hidden;
}

.page-ruletka .ruletka-hero__media::after {
  z-index: 1;
  content: "";
  background: rgba(23, 35, 32, 0.42);
}

.page-ruletka .ruletka-hero__media img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 62% center;
  transition: transform var(--transition-panel);
}

.page-ruletka .ruletka-hero__inner {
  width: min(100% - (var(--container-padding) * 2), var(--container-max));
  margin-inline: auto;
  padding-block: 9.5rem 5rem;
}

.page-ruletka .ruletka-hero__copy {
  width: min(100%, 38.125rem);
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
}

.page-ruletka .ruletka-hero__copy > * { margin: 0; }
.page-ruletka .ruletka-hero h1 { color: var(--color-white-on-dark); }
.page-ruletka .ruletka-hero .eyebrow { color: var(--color-champagne-bronze); }

.page-ruletka .ruletka-breadcrumbs {
  width: 100%;
  font-size: var(--text-utility);
  font-weight: 700;
}

.page-ruletka .ruletka-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-ruletka .ruletka-breadcrumbs li { min-width: 0; }
.page-ruletka .ruletka-breadcrumbs li + li::before { content: "/"; margin-right: var(--space-2); color: var(--color-champagne-bronze); }
.page-ruletka .ruletka-breadcrumbs a { color: var(--color-white-on-dark); }

.page-ruletka .ruletka-hero__lead {
  width: min(100%, 34rem);
  font-size: var(--text-intro);
  line-height: var(--leading-intro);
}

.page-ruletka .ruletka-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-4);
  width: 100%;
}

.page-ruletka .ruletka-hero__actions > * { min-width: 0; }
.page-ruletka .ruletka-hero .text-link { color: var(--color-white-on-dark); }
.page-ruletka .ruletka-hero .text-link:hover { color: var(--color-champagne-bronze); }

.page-ruletka .ruletka-qualities__head,
.page-ruletka .ruletka-related__head,
.page-ruletka .ruletka-prepare__grid,
.page-ruletka .ruletka-final__grid,
.page-ruletka .ruletka-further__grid {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-5);
}

.page-ruletka .ruletka-qualities__title,
.page-ruletka .ruletka-related__title,
.page-ruletka .ruletka-prepare__title,
.page-ruletka .ruletka-final__copy,
.page-ruletka .ruletka-further__label { min-width: 0; }

.page-ruletka .ruletka-qualities__title { grid-column: span 5; width: min(100%, 33.75rem); }
.page-ruletka .ruletka-qualities__intro { grid-column: 7 / span 4; width: min(100%, 26.25rem); min-width: 0; align-self: end; }

.page-ruletka .ruletka-qualities__cards,
.page-ruletka .ruletka-related__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-8);
}

.page-ruletka .ruletka-qualities__card,
.page-ruletka .ruletka-related__card {
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
}

.page-ruletka .ruletka-qualities__card {
  background: var(--color-warm-limestone);
  transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.page-ruletka .ruletka-qualities__card > *,
.page-ruletka .ruletka-related__card > * { margin: 0; }
.page-ruletka .ruletka-qualities__card p,
.page-ruletka .ruletka-related__card p { width: min(100%, 29rem); }
.page-ruletka .ruletka-qualities__card .text-link,
.page-ruletka .ruletka-related__card .text-link { margin-top: auto; }
.page-ruletka .ruletka-qualities__number { color: var(--color-champagne-bronze); font-size: var(--text-label); font-weight: 700; letter-spacing: var(--tracking-label); }
.page-ruletka .ruletka-qualities__icon { color: var(--color-champagne-bronze); }
.page-ruletka .ruletka-qualities__icon svg { width: 2rem; height: 2rem; fill: none; stroke: currentColor; stroke-width: 1.4; }

.page-ruletka .ruletka-materials { padding-top: 0; }
.page-ruletka .ruletka-materials__panel {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-5);
  border-radius: var(--radius-xl);
  background: var(--color-warm-limestone);
  padding: clamp(var(--space-5), 5vw, var(--space-8));
}

.page-ruletka .ruletka-materials__copy {
  grid-column: span 5;
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
  width: min(100%, 34.75rem);
}

.page-ruletka .ruletka-materials__copy > * { margin: 0; }
.page-ruletka .ruletka-materials__copy p { width: min(100%, 33.75rem); }
.page-ruletka .ruletka-materials__figure { grid-column: 7 / span 5; min-width: 0; margin: var(--space-7) 0 calc(var(--space-7) * -1); }
.page-ruletka .ruletka-materials__media { aspect-ratio: 4 / 3; width: 100%; }
.page-ruletka .ruletka-materials__media img { object-position: 56% center; transition: transform var(--transition-panel); }
.page-ruletka .ruletka-materials__figure figcaption { width: min(100%, 31rem); }
.page-ruletka .ruletka-arrow { transition: transform var(--transition-fast); }
.page-ruletka .text-link:hover .ruletka-arrow { transform: translateX(0.25rem); }

.page-ruletka .ruletka-timeline__head {
  width: min(100%, 41.25rem);
  margin-inline: auto;
  text-align: center;
}

.page-ruletka .ruletka-timeline__head .intro { width: min(100%, 38rem); margin-inline: auto; }
.page-ruletka .ruletka-timeline__list {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-8) var(--space-5);
  margin: var(--space-8) 0 0;
  padding: 0;
  list-style: none;
}

.page-ruletka .ruletka-timeline__list::before { position: absolute; top: 0; bottom: 0; left: calc(50% - 0.5px); width: 1px; content: ""; background: var(--color-champagne-bronze); }
.page-ruletka .ruletka-timeline__item { grid-column: span 12; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); min-width: 0; }
.page-ruletka .ruletka-timeline__content { grid-column: span 4; display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-3); width: min(100%, 26.875rem); transition: opacity var(--transition-fast), color var(--transition-fast); }
.page-ruletka .ruletka-timeline__content > * { margin: 0; }
.page-ruletka .ruletka-timeline__content p { width: min(100%, 26.875rem); }
.page-ruletka .ruletka-timeline__item:nth-child(even) .ruletka-timeline__content { grid-column: 9 / span 4; }
.page-ruletka .ruletka-timeline__number { color: var(--color-champagne-bronze); font-size: var(--text-label); font-weight: 700; letter-spacing: var(--tracking-label); transition: color var(--transition-fast); }
.page-ruletka .ruletka-timeline__item.is-active .ruletka-timeline__number,
.page-ruletka .ruletka-timeline__item:hover .ruletka-timeline__number,
.page-ruletka .ruletka-timeline__item:focus-within .ruletka-timeline__number { color: var(--color-cobalt-blue); }

.page-ruletka .ruletka-related__title { grid-column: span 5; width: min(100%, 35rem); }
.page-ruletka .ruletka-related__intro { grid-column: 8 / span 4; width: min(100%, 25.625rem); min-width: 0; align-self: end; }
.page-ruletka .ruletka-related__card { color: var(--color-deep-ink); text-decoration: none; transition: transform var(--transition-fast), border-color var(--transition-fast); }
.page-ruletka .ruletka-related__card--pearl { background: var(--color-pearl-white); }
.page-ruletka .ruletka-related__card--seafoam { background: #b8d5cb; }
.page-ruletka .ruletka-related__card--limestone { background: var(--color-warm-limestone); }
.page-ruletka .ruletka-related__card .text-link { color: inherit; }
.page-ruletka .ruletka-related__card:hover { color: var(--color-deep-ink); border-color: var(--color-champagne-bronze); transform: translateY(-2px); }

.page-ruletka .ruletka-prepare { color: var(--color-white-on-dark); }
.page-ruletka .ruletka-prepare .eyebrow { color: var(--color-champagne-bronze); }
.page-ruletka .ruletka-prepare__title { grid-column: span 4; position: relative; width: min(100%, 28.75rem); padding-left: var(--space-5); }
.page-ruletka .ruletka-prepare__title::before { position: absolute; top: 0.35rem; bottom: 0.35rem; left: 0; width: 1px; content: ""; background: var(--color-champagne-bronze); }
.page-ruletka .ruletka-prepare__title h2 { color: var(--color-white-on-dark); }
.page-ruletka .ruletka-prepare__list { grid-column: 6 / span 7; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6) var(--space-7); min-width: 0; }
.page-ruletka .ruletka-prepare__item { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding-bottom: var(--space-5); border-bottom: 1px solid var(--color-border-dark); }
.page-ruletka .ruletka-prepare__item:last-child { grid-column: span 2; width: min(100%, 39rem); }
.page-ruletka .ruletka-prepare__item > * { margin: 0; }
.page-ruletka .ruletka-prepare__item h3 { color: var(--color-white-on-dark); }
.page-ruletka .ruletka-prepare__item p { width: min(100%, 28rem); }
.page-ruletka .ruletka-prepare .text-link { color: var(--color-white-on-dark); }

.page-ruletka .ruletka-connection { padding-top: 0; }
.page-ruletka .ruletka-connection__visual { position: relative; min-height: 45rem; display: grid; grid-template-columns: minmax(0, 1fr); align-items: end; background: var(--color-deep-ink); }
.page-ruletka .ruletka-connection__media { position: absolute; inset: 0; }
.page-ruletka .ruletka-connection__media::after { position: absolute; inset: 0; content: ""; background: rgba(23, 35, 32, 0.18); }
.page-ruletka .ruletka-connection__media img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 54% center; }
.page-ruletka .ruletka-connection__inner { width: min(100% - (var(--container-padding) * 2), var(--container-max)); margin-inline: auto; padding-block: var(--space-8); }
.page-ruletka .ruletka-connection__panel { width: min(100%, 36.875rem); display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-5); border-radius: var(--radius-lg); background: rgba(23, 35, 32, 0.9); padding: var(--space-7); color: var(--color-white-on-dark); }
.page-ruletka .ruletka-connection__panel > * { margin: 0; }
.page-ruletka .ruletka-connection__panel h2 { color: var(--color-white-on-dark); }
.page-ruletka .ruletka-connection__panel p { width: min(100%, 33.75rem); }
.page-ruletka .ruletka-connection__panel .text-link { color: var(--color-white-on-dark); }
.page-ruletka .ruletka-connection__caption { width: min(100% - (var(--container-padding) * 2), var(--container-max)); margin: var(--space-3) auto 0; }
.page-ruletka .ruletka-connection__caption p { width: min(100%, 28.75rem); }

.page-ruletka .ruletka-faq__head { width: min(100%, 43.125rem); margin-inline: auto; text-align: center; }
.page-ruletka .ruletka-faq__head .intro { width: min(100%, 35rem); margin-inline: auto; }
.page-ruletka .ruletka-faq__list { width: min(100%, 55rem); margin: var(--space-8) auto 0; }
.page-ruletka .ruletka-faq__item { border-top: 1px solid var(--color-border-light); }
.page-ruletka .ruletka-faq__item:last-child { border-bottom: 1px solid var(--color-border-light); }
.page-ruletka .ruletka-faq__button { width: 100%; min-height: 4.75rem; display: grid; grid-template-columns: minmax(0, 1fr) 2.75rem; align-items: center; gap: var(--space-4); border: 0; background: transparent; padding: var(--space-5) 0; text-align: left; }
.page-ruletka .ruletka-faq__button span:first-child { min-width: 0; font-family: var(--font-heading); font-size: clamp(1.45rem, 2.2vw, 1.8rem); line-height: 1.15; letter-spacing: -0.02em; }
.page-ruletka .ruletka-faq__symbol { width: 2.75rem; height: 2.75rem; display: grid; place-items: center; border: 1px solid var(--color-champagne-bronze); border-radius: 50%; color: var(--color-cobalt-blue); font-size: 1.5rem; line-height: 1; transition: transform var(--transition-fast), background-color var(--transition-fast); }
.page-ruletka .ruletka-faq__button[aria-expanded="true"] .ruletka-faq__symbol { transform: rotate(45deg); background: var(--color-seafoam-green); }
.page-ruletka .ruletka-faq__answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 200ms ease; }
.page-ruletka .ruletka-faq__answer[hidden] { display: grid; }
.page-ruletka .ruletka-faq__answer-inner { overflow: hidden; }
.page-ruletka .ruletka-faq__answer p { width: min(100%, 43rem); margin: 0; padding: 0 3.75rem var(--space-6) 0; }
.page-ruletka .ruletka-faq__item.is-open .ruletka-faq__answer { grid-template-rows: 1fr; }

.page-ruletka .ruletka-final { border-top: 1px solid var(--color-border-light); }
.page-ruletka .ruletka-final__copy { grid-column: span 6; display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-5); width: min(100%, 40rem); }
.page-ruletka .ruletka-final__copy > * { margin: 0; }
.page-ruletka .ruletka-final__copy p { width: min(100%, 33.75rem); }
.page-ruletka .ruletka-final__note { color: var(--color-muted-ink); font-size: var(--text-utility); font-weight: 600; line-height: var(--leading-utility); }
.page-ruletka .ruletka-final__art { grid-column: 9 / span 4; position: relative; min-height: 18.75rem; overflow: hidden; border-radius: var(--radius-xl) var(--radius-xl) 0 0; background: var(--color-seafoam-green); }
.page-ruletka .ruletka-final__art::before { position: absolute; right: 10%; bottom: -36%; width: 78%; aspect-ratio: 1; border: 1px solid var(--color-champagne-bronze); border-radius: 50% 50% 0 0; content: ""; }
.page-ruletka .ruletka-final__art::after { position: absolute; top: 12%; right: 17%; width: 50%; height: 1px; content: ""; background: var(--color-champagne-bronze); transform: rotate(-32deg); transform-origin: right center; }

.page-ruletka .ruletka-further { padding-block: var(--section-space-compact); border-top: 1px solid var(--color-champagne-bronze); }
.page-ruletka .ruletka-further__label { grid-column: span 2; align-self: start; }
.page-ruletka .ruletka-further__links { grid-column: 3 / span 10; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); min-width: 0; }
.page-ruletka .ruletka-further__link { min-height: 3.25rem; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); min-width: 0; border-bottom: 1px solid var(--color-champagne-bronze); padding-bottom: var(--space-2); color: var(--color-deep-ink); text-decoration: none; }
.page-ruletka .ruletka-further__link-copy { min-width: 0; }
.page-ruletka .ruletka-further__link strong,
.page-ruletka .ruletka-further__link small { display: block; }
.page-ruletka .ruletka-further__link small { color: var(--color-muted-ink); font-weight: 600; }
.page-ruletka .ruletka-further__link:hover { color: var(--color-cobalt-blue); }

.page-ruletka [data-ruletka-reveal] { opacity: 0; transform: translateY(1rem); transition: opacity 500ms ease, transform 500ms ease; }
.page-ruletka [data-ruletka-reveal].is-visible { opacity: 1; transform: translateY(0); }

@media (hover: hover) and (pointer: fine) {
  .page-ruletka .ruletka-hero:hover .ruletka-hero__media img { transform: scale(1.015); }
  .page-ruletka .ruletka-qualities__card:hover { box-shadow: var(--shadow-feature); transform: translateY(-2px); }
  .page-ruletka .ruletka-materials__media:hover img { transform: scale(1.02); }
}

@media (max-width: 1080px) {
  .page-ruletka .ruletka-hero { min-height: 41.25rem; }
  .page-ruletka .ruletka-hero__copy { width: min(100%, 41rem); }
  .page-ruletka .ruletka-connection__panel { width: min(100%, 42rem); }
}

@media (max-width: 1000px) {
  .page-ruletka .ruletka-materials__copy { grid-column: span 6; }
  .page-ruletka .ruletka-materials__figure { grid-column: 7 / span 6; margin-top: var(--space-5); }
  .page-ruletka .ruletka-related__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-ruletka .ruletka-related__card:first-child { grid-column: span 2; }
}

@media (max-width: 980px) {
  .page-ruletka .ruletka-qualities__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-ruletka .ruletka-qualities__card:last-child { grid-column: span 2; }
  .page-ruletka .ruletka-prepare__grid { row-gap: var(--space-7); }
  .page-ruletka .ruletka-prepare__title { grid-column: span 5; }
  .page-ruletka .ruletka-prepare__list { grid-column: 7 / span 6; grid-template-columns: minmax(0, 1fr); }
  .page-ruletka .ruletka-prepare__item:last-child { grid-column: span 1; }
}

@media (max-width: 920px) {
  .page-ruletka .ruletka-timeline__head { margin-inline: 0; text-align: left; }
  .page-ruletka .ruletka-timeline__head .intro { margin-inline: 0; }
  .page-ruletka .ruletka-timeline__list { display: flex; flex-direction: column; gap: var(--space-7); padding-left: 2.25rem; }
  .page-ruletka .ruletka-timeline__list::before { left: 0.75rem; }
  .page-ruletka .ruletka-timeline__item { display: block; width: 100%; }
  .page-ruletka .ruletka-timeline__content,
  .page-ruletka .ruletka-timeline__item:nth-child(even) .ruletka-timeline__content { width: min(100%, 28rem); }
}

@media (max-width: 900px) {
  .page-ruletka .ruletka-hero { min-height: 0; display: block; background: var(--color-cobalt-blue); }
  .page-ruletka .ruletka-hero__media { position: relative; height: 54vw; min-height: 18rem; max-height: 30rem; }
  .page-ruletka .ruletka-hero__media::after { background: rgba(23, 35, 32, 0.18); }
  .page-ruletka .ruletka-hero__inner { width: min(100% - (var(--container-padding) * 2), var(--container-max)); padding-block: var(--space-6) var(--space-8); }
  .page-ruletka .ruletka-hero__copy { width: min(100%, 42rem); gap: var(--space-5); }
  .page-ruletka .ruletka-hero h1 { font-size: clamp(3rem, 8vw, 4.5rem); }
  .page-ruletka .ruletka-qualities__head,
  .page-ruletka .ruletka-related__head,
  .page-ruletka .ruletka-prepare__grid,
  .page-ruletka .ruletka-final__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .page-ruletka .ruletka-qualities__title,
  .page-ruletka .ruletka-related__title { grid-column: span 4; }
  .page-ruletka .ruletka-qualities__intro,
  .page-ruletka .ruletka-related__intro { grid-column: 5 / span 2; width: 100%; }
  .page-ruletka .ruletka-materials__panel { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .page-ruletka .ruletka-materials__copy { grid-column: span 6; width: min(100%, 40rem); }
  .page-ruletka .ruletka-materials__figure { grid-column: span 6; width: min(100%, 42rem); margin: 0 0 calc(var(--space-7) * -1); }
  .page-ruletka .ruletka-prepare__title { grid-column: span 6; }
  .page-ruletka .ruletka-prepare__list { grid-column: span 6; }
  .page-ruletka .ruletka-connection__visual { min-height: 36rem; }
  .page-ruletka .ruletka-final__copy { grid-column: span 6; }
  .page-ruletka .ruletka-final__art { grid-column: span 6; min-height: 8rem; }
}

@media (max-width: 760px) {
  .page-ruletka .ruletka-qualities__head,
  .page-ruletka .ruletka-related__head { row-gap: var(--space-4); }
  .page-ruletka .ruletka-qualities__title,
  .page-ruletka .ruletka-related__title,
  .page-ruletka .ruletka-qualities__intro,
  .page-ruletka .ruletka-related__intro { grid-column: span 6; width: min(100%, 34rem); }
  .page-ruletka .ruletka-prepare__list { gap: var(--space-5); }
  .page-ruletka .ruletka-connection__visual { min-height: 31rem; }
  .page-ruletka .ruletka-faq__head { text-align: left; margin-inline: 0; }
  .page-ruletka .ruletka-faq__head .intro { margin-inline: 0; }
  .page-ruletka .ruletka-faq__list { width: 100%; }
  .page-ruletka .ruletka-further__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: var(--space-5); }
  .page-ruletka .ruletka-further__label { grid-column: span 6; }
  .page-ruletka .ruletka-further__links { grid-column: span 6; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-ruletka .ruletka-further__link:last-child { grid-column: span 2; }
}

@media (max-width: 599px) {
  .page-ruletka .ruletka-hero__media { height: 56vw; min-height: 12rem; }
  .page-ruletka .ruletka-hero__inner { padding-block: var(--space-5) var(--space-7); }
  .page-ruletka .ruletka-hero h1 { font-size: clamp(3rem, 13vw, 3.65rem); }
  .page-ruletka .ruletka-hero__lead { width: 100%; font-size: 1.0625rem; }
  .page-ruletka .ruletka-hero__actions { align-items: stretch; flex-direction: column; }
  .page-ruletka .ruletka-hero__actions .button { width: 100%; min-height: 3rem; }
  .page-ruletka .ruletka-hero__actions .text-link { min-height: 2.75rem; }
  .page-ruletka .ruletka-qualities__head,
  .page-ruletka .ruletka-related__head,
  .page-ruletka .ruletka-prepare__grid,
  .page-ruletka .ruletka-final__grid,
  .page-ruletka .ruletka-further__grid { grid-template-columns: minmax(0, 1fr); }
  .page-ruletka .ruletka-qualities__title,
  .page-ruletka .ruletka-qualities__intro,
  .page-ruletka .ruletka-related__title,
  .page-ruletka .ruletka-related__intro,
  .page-ruletka .ruletka-prepare__title,
  .page-ruletka .ruletka-prepare__list,
  .page-ruletka .ruletka-final__copy,
  .page-ruletka .ruletka-final__art,
  .page-ruletka .ruletka-further__label,
  .page-ruletka .ruletka-further__links { grid-column: span 1; }
  .page-ruletka .ruletka-qualities__cards,
  .page-ruletka .ruletka-related__cards { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-7); }
  .page-ruletka .ruletka-qualities__card:last-child,
  .page-ruletka .ruletka-related__card:first-child { grid-column: span 1; }
  .page-ruletka .ruletka-qualities__card,
  .page-ruletka .ruletka-related__card { padding: var(--space-5); }
  .page-ruletka .ruletka-materials__panel { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); border-radius: var(--radius-lg); padding: var(--space-5); }
  .page-ruletka .ruletka-materials__copy,
  .page-ruletka .ruletka-materials__figure { grid-column: span 1; }
  .page-ruletka .ruletka-materials__figure { width: calc(100% + var(--container-padding-mobile) * 2); margin: 0 calc(var(--container-padding-mobile) * -1) 0; }
  .page-ruletka .ruletka-materials__media { border-radius: var(--radius-lg); }
  .page-ruletka .ruletka-materials__figure figcaption { margin-inline: var(--container-padding-mobile); }
  .page-ruletka .ruletka-timeline__list { margin-top: var(--space-7); padding-left: 2rem; }
  .page-ruletka .ruletka-timeline__content,
  .page-ruletka .ruletka-timeline__item:nth-child(even) .ruletka-timeline__content { width: 100%; }
  .page-ruletka .ruletka-prepare { padding-block: var(--space-7); }
  .page-ruletka .ruletka-prepare__title { padding-left: var(--space-4); }
  .page-ruletka .ruletka-prepare__list { grid-template-columns: minmax(0, 1fr); }
  .page-ruletka .ruletka-prepare__item { width: 100%; }
  .page-ruletka .ruletka-connection__visual { min-height: 0; display: block; }
  .page-ruletka .ruletka-connection__media { position: relative; height: 125vw; min-height: 24rem; max-height: 34rem; }
  .page-ruletka .ruletka-connection__inner { width: 100%; padding: 0; }
  .page-ruletka .ruletka-connection__panel { width: 100%; border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding: var(--space-5) var(--container-padding-mobile) var(--space-6); }
  .page-ruletka .ruletka-connection__caption { width: min(100% - (var(--container-padding-mobile) * 2), var(--container-max)); }
  .page-ruletka .ruletka-faq__list { margin-top: var(--space-7); }
  .page-ruletka .ruletka-faq__button { grid-template-columns: minmax(0, 1fr) 2.75rem; padding-block: var(--space-4); }
  .page-ruletka .ruletka-faq__answer p { width: 100%; padding-right: 0; padding-bottom: var(--space-5); }
  .page-ruletka .ruletka-final__copy { width: 100%; }
  .page-ruletka .ruletka-final__copy .button { width: 100%; min-height: 3rem; }
  .page-ruletka .ruletka-final__art { min-height: 5rem; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
  .page-ruletka .ruletka-further__links { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .page-ruletka .ruletka-further__link,
  .page-ruletka .ruletka-further__link:last-child { grid-column: span 1; min-height: 4rem; padding-block: var(--space-3); }
}

@media (prefers-reduced-motion: reduce) {
  .page-ruletka [data-ruletka-reveal] { opacity: 1; transform: none; }
}