.cars-gameplay-page {
  overflow: hidden;
}

.cars-gameplay-page .cg-hero {
  position: relative;
  padding-top: var(--space-10);
}

.cars-gameplay-page .cg-hero__layout {
  display: grid;
  grid-template-columns: minmax(22.5rem, 5fr) minmax(27.5rem, 7fr);
  gap: var(--space-7);
  align-items: center;
}

.cars-gameplay-page .cg-hero__layout > * { min-width: 0; }
.cars-gameplay-page .cg-hero__copy { max-width: 35rem; }
.cars-gameplay-page .cg-hero__copy h1 { font-size: clamp(3rem, 5.1vw, 4rem); }
.cars-gameplay-page .cg-hero__second-lead { max-width: 38.75rem; padding-top: var(--space-5); border-top: var(--border-technical); }
.cars-gameplay-page .cg-hero__focus { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-5); color: var(--color-blue); font-family: var(--font-heading); font-size: var(--text-meta); font-weight: 600; }
.cars-gameplay-page .cg-hero__focus span { color: var(--color-asphalt); text-transform: uppercase; letter-spacing: .08em; font-size: var(--text-micro); }
.cars-gameplay-page .cg-hero__actions { align-items: stretch; }
.cars-gameplay-page .cg-hero__media { width: 100%; margin: 0; box-shadow: var(--shadow-floating); }
.cars-gameplay-page .cg-hero__media img { aspect-ratio: 3 / 2; object-fit: cover; object-position: right center; }
.cars-gameplay-page .cg-button-arrow span { margin-left: var(--space-2); transition: transform var(--transition-fast); }
.cars-gameplay-page .cg-button-arrow:hover span { transform: translateX(3px); }

.cars-gameplay-page .cg-loop__shell { display: grid; grid-template-columns: 1fr; gap: var(--space-7); }
.cars-gameplay-page .cg-loop__heading,
.cars-gameplay-page .cg-diagram__heading,
.cars-gameplay-page .cg-progress__heading { display: grid; grid-template-columns: 10rem minmax(0, 42.5rem); gap: var(--space-5); align-items: start; }
.cars-gameplay-page .cg-loop__heading > *,
.cars-gameplay-page .cg-diagram__heading > *,
.cars-gameplay-page .cg-progress__heading > * { min-width: 0; }
.cars-gameplay-page .cg-zone-number { color: var(--color-asphalt-line); font-family: var(--font-heading); font-size: clamp(3rem, 6vw, 5.5rem); font-weight: 700; letter-spacing: -.06em; line-height: .8; }
.cars-gameplay-page .cg-loop__heading p { max-width: 40rem; }
.cars-gameplay-page .cg-loop__steps { display: grid; grid-template-columns: 10rem minmax(30rem, 42.5rem) minmax(0, 1fr); row-gap: var(--space-6); }
.cars-gameplay-page .cg-step { display: grid; grid-column: 1 / 3; grid-template-columns: 10rem minmax(0, 1fr); gap: var(--space-5); min-width: 0; }
.cars-gameplay-page .cg-step__number { color: var(--color-asphalt-line); font-family: var(--font-heading); font-size: 2rem; font-weight: 700; line-height: 1; }
.cars-gameplay-page .cg-step__number--target { color: var(--color-red); }
.cars-gameplay-page .cg-step__content { max-width: 37.5rem; min-width: 0; }
.cars-gameplay-page .cg-step__content h3 { font-size: var(--text-h4); }
.cars-gameplay-page .cg-note-label { display: inline-block; margin-bottom: var(--space-2); color: var(--color-blue); font-family: var(--font-heading); font-size: var(--text-micro); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.cars-gameplay-page .cg-observe__layout { display: grid; grid-template-columns: minmax(0, 7fr) minmax(20rem, 5fr); gap: var(--space-7); align-items: stretch; }
.cars-gameplay-page .cg-observe__layout > * { min-width: 0; }
.cars-gameplay-page .cg-observe__stack { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-5); }
.cars-gameplay-page .cg-observe__stack > :is(h2, p) { margin-bottom: 0; }
.cars-gameplay-page .cg-observe__lead { max-width: 42.5rem; }
.cars-gameplay-page .cg-observation { display: grid; grid-template-columns: 2.5rem minmax(0, 35rem); gap: var(--space-4); width: 100%; padding-top: var(--space-5); border-top: var(--border-technical); }
.cars-gameplay-page .cg-observation > * { min-width: 0; }
.cars-gameplay-page .cg-observation h3 { font-size: var(--text-h4); }
.cars-gameplay-page .cg-observation__icon { width: 2rem; height: 2rem; margin-top: .2rem; border: 2px solid var(--color-blue); position: relative; }
.cars-gameplay-page .cg-observation__icon::after { position: absolute; width: 1.25rem; height: 2px; top: .75rem; left: .35rem; background: var(--color-blue); content: ""; }
.cars-gameplay-page .cg-observation__icon--reverse { border-color: var(--color-asphalt); }
.cars-gameplay-page .cg-observation__icon--reverse::after { background: var(--color-asphalt); transform: rotate(180deg); }
.cars-gameplay-page .cg-observation__icon--reset { border-color: var(--color-red); border-radius: 50%; }
.cars-gameplay-page .cg-observation__icon--reset::after { background: var(--color-red); transform: rotate(-35deg); }
.cars-gameplay-page .cg-observe__field { position: relative; min-height: 30rem; padding: var(--space-6); overflow: hidden; border: var(--border-technical); border-top: 2px solid var(--color-blue); background: var(--color-blue-pale); }
.cars-gameplay-page .cg-observe__field-label { display: block; margin-bottom: var(--space-4); color: var(--color-blue); font-family: var(--font-heading); font-size: var(--text-micro); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cars-gameplay-page .cg-observe__field p { max-width: 19rem; }
.cars-gameplay-page .cg-observe__bay { position: absolute; width: 15rem; height: 18rem; right: -2rem; bottom: -4rem; border: 2px solid var(--color-asphalt-line); border-bottom: 0; }

.cars-gameplay-page .cg-diagram__heading { margin-bottom: var(--space-6); }
.cars-gameplay-page .cg-diagram__heading p { max-width: 38.75rem; }
.cars-gameplay-page .cg-diagram__layout { display: grid; grid-template-columns: minmax(35rem, 7fr) minmax(17.5rem, 5fr); gap: var(--space-6); align-items: start; }
.cars-gameplay-page .cg-diagram__layout > * { min-width: 0; }
.cars-gameplay-page .cg-parking-diagram { width: 100%; margin: 0; padding: var(--space-4); border: var(--border-technical); background: var(--color-asphalt); }
.cars-gameplay-page .cg-parking-diagram svg { width: 100%; aspect-ratio: 16 / 10; }
.cars-gameplay-page .cg-parking-diagram figcaption { color: #e7edf0; }
.cars-gameplay-page .cg-diagram__notes { display: flex; flex-direction: column; gap: var(--space-5); }
.cars-gameplay-page .cg-diagram-note { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); gap: var(--space-3); min-width: 0; }
.cars-gameplay-page .cg-diagram-note__marker { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: var(--color-blue); color: var(--color-white); font-family: var(--font-heading); font-weight: 700; }
.cars-gameplay-page .cg-diagram-note__marker--red { background: var(--color-red); }
.cars-gameplay-page .cg-diagram-note h3 { font-size: var(--text-h4); }

.cars-gameplay-page .cg-camera__intro { max-width: 38.75rem; }
.cars-gameplay-page .cg-camera__strip { display: grid; grid-template-columns: repeat(3, minmax(15.625rem, 1fr)); margin-top: var(--space-6); border-top: var(--border-technical); border-bottom: var(--border-technical); }
.cars-gameplay-page .cg-camera__item { min-width: 0; padding: var(--space-5); border-right: var(--border-technical); }
.cars-gameplay-page .cg-camera__item:first-child { padding-left: 0; }
.cars-gameplay-page .cg-camera__item:last-child { border-right: 0; }
.cars-gameplay-page .cg-camera__item h3 { font-size: var(--text-h4); }
.cars-gameplay-page .cg-camera__label { display: inline-block; margin-bottom: var(--space-3); color: var(--color-blue); font-family: var(--font-heading); font-size: var(--text-micro); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.cars-gameplay-page .cg-progress__heading { margin-bottom: var(--space-7); }
.cars-gameplay-page .cg-progress__heading p { max-width: 40rem; }
.cars-gameplay-page .cg-progress__timeline { display: grid; grid-template-columns: 7.5rem minmax(0, 35rem) minmax(0, 1fr); gap: 0; }
.cars-gameplay-page .cg-progress-stage { position: relative; display: grid; grid-column: 1 / 3; grid-template-columns: 7.5rem minmax(0, 1fr); gap: var(--space-5); min-width: 0; padding-bottom: var(--space-6); }
.cars-gameplay-page .cg-progress-stage::before { position: absolute; width: 2px; top: 2.5rem; bottom: 0; left: 1.2rem; background: var(--color-blue); content: ""; }
.cars-gameplay-page .cg-progress-stage:last-child::before { display: none; }
.cars-gameplay-page .cg-progress-stage__number { position: relative; z-index: 1; display: grid; width: 2.6rem; height: 2.6rem; place-items: center; border: 2px solid var(--color-red); border-radius: 50%; background: var(--color-white); color: var(--color-red); font-family: var(--font-heading); font-size: var(--text-meta); font-weight: 700; }
.cars-gameplay-page .cg-progress-stage__number--complete { border-color: var(--color-success); color: var(--color-success); }
.cars-gameplay-page .cg-progress-stage h3 { font-size: var(--text-h4); }
.cars-gameplay-page .cg-progress-stage__quote { display: block; margin-top: var(--space-3); padding: var(--space-3) var(--space-4); background: var(--color-paper); color: var(--color-asphalt); font-family: var(--font-heading); font-weight: 600; }

.cars-gameplay-page .cg-fit__layout { display: grid; grid-template-columns: minmax(0, 7fr) minmax(22.5rem, 5fr); gap: var(--space-7); align-items: start; }
.cars-gameplay-page .cg-fit__layout > * { min-width: 0; }
.cars-gameplay-page .cg-fit__assessment { max-width: 35rem; }
.cars-gameplay-page .cg-fit__assessment h3, .cars-gameplay-page .cg-fit__verify h3 { font-size: var(--text-h4); }
.cars-gameplay-page .cg-fit__marker { display: inline-block; margin-bottom: var(--space-3); padding: var(--space-1) var(--space-2); background: var(--color-blue-pale); color: var(--color-blue); font-family: var(--font-heading); font-size: var(--text-micro); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.cars-gameplay-page .cg-fit__verify { max-width: 26.25rem; }
.cars-gameplay-page .cg-fit__boundary { max-width: 42.5rem; margin-top: var(--space-6); padding-top: var(--space-4); border-top: var(--border-technical); color: var(--color-asphalt); }

.cars-gameplay-page .cg-field__layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(31.25rem, 7fr); align-items: center; }
.cars-gameplay-page .cg-field__layout > * { min-width: 0; }
.cars-gameplay-page .cg-field__panel { position: relative; z-index: 1; max-width: 30rem; margin-right: -2rem; padding: var(--space-6); border: var(--border-subtle); background: var(--color-white); }
.cars-gameplay-page .cg-field__panel > :is(h2) { margin-bottom: var(--space-5); }
.cars-gameplay-page .cg-field__notes { display: flex; flex-direction: column; gap: var(--space-5); }
.cars-gameplay-page .cg-field-note { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: var(--space-3); min-width: 0; }
.cars-gameplay-page .cg-field-note__number { display: grid; width: 2rem; height: 2rem; place-items: center; background: var(--color-red); color: var(--color-white); font-family: var(--font-heading); font-size: var(--text-meta); font-weight: 700; }
.cars-gameplay-page .cg-field-note__number--blue { background: var(--color-blue); }
.cars-gameplay-page .cg-field-note__number--asphalt { background: var(--color-asphalt); }
.cars-gameplay-page .cg-field-note h3 { font-size: var(--text-h4); }
.cars-gameplay-page .cg-field__media { width: 100%; margin: 0; }
.cars-gameplay-page .cg-field__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: right center; transition: opacity var(--transition-base); }
@media (hover: hover) { .cars-gameplay-page .cg-field__media:hover img { opacity: .92; } }

.cars-gameplay-page .cg-routes__intro { max-width: 37.5rem; }
.cars-gameplay-page .cg-routes__list { display: grid; grid-template-columns: repeat(3, minmax(16.25rem, 1fr)); margin-top: var(--space-6); border-top: var(--border-technical); border-bottom: var(--border-technical); }
.cars-gameplay-page .cg-route { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: var(--space-3); min-width: 0; padding: var(--space-5); border-right: var(--border-technical); }
.cars-gameplay-page .cg-route:first-child { padding-left: 0; }
.cars-gameplay-page .cg-route:last-child { border-right: 0; }
.cars-gameplay-page .cg-route__marker { width: 1.5rem; height: 2px; margin-top: .7rem; background: var(--color-asphalt); }
.cars-gameplay-page .cg-route__marker--blue { background: var(--color-blue); }
.cars-gameplay-page .cg-route__marker--red { width: 1.25rem; height: 1.25rem; margin-top: .3rem; background: var(--color-red); }
.cars-gameplay-page .cg-route h3 { font-size: var(--text-h4); }
.cars-gameplay-page .cg-route h3 a { display: inline-block; min-height: 3rem; }

.cars-gameplay-page .cg-closing { padding-top: var(--space-7); }
.cars-gameplay-page .cg-closing__panel { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); max-width: 45rem; padding: var(--space-6); border: var(--border-subtle); border-top: 2px solid var(--color-blue); background: var(--color-paper); }
.cars-gameplay-page .cg-closing__panel > :is(h2, p) { margin-bottom: 0; }
.cars-gameplay-page .cg-closing__panel p { max-width: 35rem; }
.cars-gameplay-page .cg-closing__target { width: 1rem; height: 1rem; background: var(--color-red); }
.cars-gameplay-page .cg-closing__button { margin-top: var(--space-2); }

@media (max-width: 68.75rem) {
  .cars-gameplay-page .cg-hero__layout { grid-template-columns: minmax(22.5rem, 5fr) minmax(20rem, 7fr); gap: var(--space-6); }
  .cars-gameplay-page .cg-hero__copy h1 { font-size: clamp(2.75rem, 5vw, 3.5rem); }
  .cars-gameplay-page .cg-field__layout { grid-template-columns: minmax(0, 5fr) minmax(25rem, 7fr); }
}

@media (max-width: 61.25rem) {
  .cars-gameplay-page .cg-field__layout { grid-template-columns: 1fr; gap: var(--space-5); }
  .cars-gameplay-page .cg-field__panel { max-width: 45rem; margin-right: 0; }
  .cars-gameplay-page .cg-field__media { grid-row: 1; }
}

@media (max-width: 56.25rem) {
  .cars-gameplay-page .cg-diagram__layout { grid-template-columns: 1fr; }
  .cars-gameplay-page .cg-parking-diagram { max-width: none; }
  .cars-gameplay-page .cg-diagram__notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cars-gameplay-page .cg-routes__list { grid-template-columns: repeat(2, minmax(16.25rem, 1fr)); }
  .cars-gameplay-page .cg-route:last-child { grid-column: 1 / 3; border-top: var(--border-technical); padding-left: 0; }
}

@media (max-width: 51.25rem) {
  .cars-gameplay-page .cg-hero { padding-top: var(--space-8); }
  .cars-gameplay-page .cg-hero__layout,
  .cars-gameplay-page .cg-observe__layout,
  .cars-gameplay-page .cg-fit__layout { grid-template-columns: 1fr; }
  .cars-gameplay-page .cg-hero__copy { max-width: 40rem; }
  .cars-gameplay-page .cg-hero__media { max-width: 40rem; }
  .cars-gameplay-page .cg-observe__field { display: none; }
  .cars-gameplay-page .cg-fit__verify { max-width: none; }
  .cars-gameplay-page .cg-camera__strip { grid-template-columns: repeat(2, minmax(17.5rem, 1fr)); }
  .cars-gameplay-page .cg-camera__item:first-child { grid-column: 1 / 3; padding-left: 0; border-bottom: var(--border-technical); }
  .cars-gameplay-page .cg-camera__item:nth-child(2) { padding-left: 0; }
}

@media (max-width: 43.75rem) {
  .cars-gameplay-page .cg-hero__layout { gap: var(--space-5); }
  .cars-gameplay-page .cg-hero__copy h1 { font-size: 2.25rem; line-height: 1.11; }
  .cars-gameplay-page .cg-hero__media img { aspect-ratio: 4 / 3; }
  .cars-gameplay-page .cg-loop__heading,
  .cars-gameplay-page .cg-diagram__heading,
  .cars-gameplay-page .cg-progress__heading { grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-3); }
  .cars-gameplay-page .cg-zone-number { font-size: 2.25rem; }
  .cars-gameplay-page .cg-loop__steps { grid-template-columns: 2.75rem minmax(0, 1fr); row-gap: var(--space-5); }
  .cars-gameplay-page .cg-step { grid-column: 1 / 3; grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-3); }
  .cars-gameplay-page .cg-step__number { font-size: 1.5rem; }
  .cars-gameplay-page .cg-diagram__notes { grid-template-columns: 1fr; }
  .cars-gameplay-page .cg-parking-diagram svg { aspect-ratio: 4 / 3; }
  .cars-gameplay-page .cg-camera__strip { grid-template-columns: 1fr; border-left: 2px solid var(--color-blue); }
  .cars-gameplay-page .cg-camera__item,
  .cars-gameplay-page .cg-camera__item:first-child,
  .cars-gameplay-page .cg-camera__item:nth-child(2) { grid-column: auto; padding: var(--space-5) 0 var(--space-5) var(--space-4); border-right: 0; border-bottom: var(--border-technical); }
  .cars-gameplay-page .cg-camera__item:last-child { border-bottom: 0; }
  .cars-gameplay-page .cg-progress__timeline { grid-template-columns: 2.5rem minmax(0, 1fr); }
  .cars-gameplay-page .cg-progress-stage { grid-column: 1 / 3; grid-template-columns: 2.5rem minmax(0, 1fr); gap: var(--space-3); }
  .cars-gameplay-page .cg-progress-stage::before { left: 1rem; }
  .cars-gameplay-page .cg-field__media img { aspect-ratio: 4 / 3; object-position: center; }
  .cars-gameplay-page .cg-field__panel { padding: 0; border: 0; }
  .cars-gameplay-page .cg-routes__list { grid-template-columns: 1fr; }
  .cars-gameplay-page .cg-route,
  .cars-gameplay-page .cg-route:first-child,
  .cars-gameplay-page .cg-route:last-child { grid-column: auto; padding: var(--space-4) 0; border-right: 0; border-top: var(--border-technical); }
  .cars-gameplay-page .cg-route:first-child { border-top: 0; }
  .cars-gameplay-page .cg-closing__panel { padding: var(--space-5); }
  .cars-gameplay-page .cg-closing__button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .cars-gameplay-page .cg-button-arrow:hover span { transform: none; }
}
