/* Supplied 3.2–3.8 artwork; only the foreground copy uses the site gutter. */
html:has(body.sc-page) { scroll-behavior: auto; }
body.sc-page { background: #f7f3eb; }
.sc-main {
  --sc-ink: #08172d;
  --sc-text: #354555;
  --sc-accent: #c78051;
  --sc-gutter: max(32px, var(--arotec-content-left, 0px));
  --sc-title-size: clamp(32px, 3.15vw, 72px);
  margin: 0;
  padding: var(--detail-header-space, 112px) 0 0;
  color: var(--sc-ink);
}
.sc-main *, .sc-main *::before, .sc-main *::after { box-sizing: border-box; }
.sc-main .sc-scene { position: relative; isolation: isolate; min-height: 56.25vw; margin: 0; padding: 0; content-visibility: visible !important; contain-intrinsic-size: none !important; }
/* The shared home stylesheet adds a turquoise wash to generic sections. */
html body.sc-page main#main > .sc-scene::before,
html body.sc-page main#main > .sc-scene::after { content: none !important; background: none !important; }
.sc-picture { display: block; position: absolute; inset: 0; z-index: -1; }
.sc-backdrop { display: block; width: 100%; height: 100%; object-fit: cover; }
.sc-copy { position: relative; margin-left: var(--sc-gutter); width: calc(38% - var(--sc-gutter)); padding: 13.1vw 0 5vw; }
.sc-narrow .sc-copy { width: calc(31% - var(--sc-gutter)); }
.sc-scene-8 .sc-copy { width: calc(33% - var(--sc-gutter)); }
.sc-scene-5, .sc-scene-6, .sc-scene-8 { --sc-title-size: clamp(30px, 2.75vw, 64px); }
html body.sc-page #main#main .sc-heading {
  --arotec-display-size: var(--sc-title-size);
  --arotec-display-line-height: 1.08;
  --arotec-display-letter-spacing: -.04em;
  --arotec-display-weight: 700;
  font-family: var(--site-font, "DM Sans", sans-serif) !important;
  font-size: var(--sc-title-size) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  letter-spacing: -.04em !important;
  text-transform: none !important;
  text-wrap: initial !important;
  overflow-wrap: normal !important;
  color: var(--sc-ink);
  margin: 0 0 2.1vw !important;
}
html body.sc-page #main#main .sc-copy > p {
  font-family: var(--site-font, "DM Sans", sans-serif) !important;
  font-size: clamp(14px, 1.06vw, 23px) !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  letter-spacing: -.015em !important;
  color: var(--sc-text);
  margin: 0;
}
html body.sc-page #main#main .sc-copy > .sc-lead { font-size: clamp(17px, 1.4vw, 30px) !important; line-height: 1.3 !important; margin-bottom: 1.8vw; }
.sc-steps { display: grid; grid-template-columns: repeat(var(--step-count), minmax(0, 1fr)); gap: 1.2vw; list-style: none; margin: 5.4vw 0 0; padding: 0; }
html body.sc-page #main#main .sc-steps > li { position: relative; display: flex; flex-direction: column; align-items: center; gap: .55vw; min-width: 0; margin: 0; padding: 0; text-align: center; }
.sc-icon { display: block; width: 3.6vw; height: 3.6vw; object-fit: contain; }
html body.sc-page #main#main .sc-step-label { font-family: var(--site-font, "DM Sans", sans-serif) !important; font-size: clamp(9px, .76vw, 16px) !important; line-height: 1.2 !important; font-weight: 700 !important; letter-spacing: -.04em !important; color: var(--sc-ink); }
html body.sc-page #main#main .sc-step-arrow { position: absolute; right: -1.3vw; top: 1.1vw; color: var(--sc-accent); font-family: "Phosphor" !important; font-size: 1.7vw !important; font-weight: 400 !important; line-height: 1 !important; }
html body.sc-page #main#main .sc-copy > .sc-note { margin-top: 3vw; }
@media (min-width: 1000px) {
  .sc-reference-break { display: none; }
  .sc-scene-7 .sc-copy { padding-bottom: 3.5vw; }
  .sc-scene-7 .sc-steps { margin-top: 2.75vw; }
  .sc-scene-8 .sc-copy { padding-bottom: 4.4vw; }
  /* The curved wall narrows toward the bottom of the space-experience art. */
  .sc-scene-5 .sc-steps { width: calc(100% - 4vw); }
  html body.sc-page #main#main .sc-scene-5 .sc-note { width: calc(100% - 6vw); }
}
@media (min-width: 1200px) { .sc-main { --sc-gutter: 150px; } }
@media (min-width: 1000px) and (max-width: 1399px) {
  .sc-copy { padding-top: 11vw; }
  .sc-steps { margin-top: 3.5vw; }
  .sc-narrow .sc-copy { width: calc(32% - var(--sc-gutter)); }
  .sc-scene-8 .sc-copy { width: calc(33% - var(--sc-gutter)); }
  .sc-narrow { --sc-title-size: clamp(28px, 2.65vw, 42px); }
}
@media (width < 1000px) {
  .sc-main { --sc-gutter: 32px; --sc-title-size: clamp(36px, 5.2vw, 54px); }
  .sc-main .sc-scene { display: flex; flex-direction: column; min-height: 0; background: #f7f3eb; }
  .sc-picture { position: relative; inset: auto; z-index: auto; }
  .sc-backdrop { width: 100%; height: auto; }
  .sc-copy, .sc-narrow .sc-copy, .sc-scene-8 .sc-copy, .sc-scene-7 .sc-copy { width: auto; margin: 0; padding: 38px var(--sc-gutter) 48px; }
  .sc-scene-5, .sc-scene-6, .sc-scene-8 { --sc-title-size: clamp(34px, 5.2vw, 54px); }
  html body.sc-page #main#main .sc-heading { margin-bottom: 24px !important; }
  html body.sc-page #main#main .sc-copy > p { font-size: 18px !important; line-height: 1.5 !important; }
  html body.sc-page #main#main .sc-copy > .sc-lead { font-size: 23px !important; margin-bottom: 22px; }
  .sc-steps { max-width: 570px; gap: 24px; margin-top: 34px; }
  .sc-icon { width: 62px; height: 62px; }
  html body.sc-page #main#main .sc-step-label { font-size: 12px !important; letter-spacing: -.03em !important; }
  html body.sc-page #main#main .sc-steps > li { gap: 12px; }
  html body.sc-page #main#main .sc-step-arrow { top: 20px; right: -24px; font-size: 22px !important; }
  html body.sc-page #main#main .sc-copy > .sc-note { margin-top: 30px; }
}
@media (max-width: 599px) {
  .sc-main { --sc-gutter: 22px; --sc-title-size: clamp(32px, 8.5vw, 44px); }
  .sc-scene-5, .sc-scene-6, .sc-scene-8 { --sc-title-size: clamp(30px, 8vw, 42px); }
  .sc-copy, .sc-narrow .sc-copy, .sc-scene-8 .sc-copy, .sc-scene-7 .sc-copy { padding-top: 30px; padding-bottom: 40px; }
  html body.sc-page #main#main .sc-copy > p { font-size: 16px !important; }
  html body.sc-page #main#main .sc-copy > .sc-lead { font-size: 21px !important; }
  .sc-reference-break { display: none; }
  .sc-steps { gap: 12px; }
  .sc-icon { width: 43px; height: 43px; }
  html body.sc-page #main#main .sc-step-label { font-size: 9px !important; overflow-wrap: normal; }
  html body.sc-page #main#main .sc-step-arrow { right: -13px; top: 14px; font-size: 15px !important; }
}
@media (max-width: 359px) {
  .sc-steps { gap: 9px; }
  .sc-icon { width: 37px; height: 37px; }
  html body.sc-page #main#main .sc-step-label { font-size: 8px !important; }
}

/* Fit the opening scene to the desktop viewport beneath the shared header. */
@media (min-width: 1000px) {
  .sc-main .sc-scene-2 {
    min-height: calc(100svh - var(--detail-header-space, 112px));
    display: flex;
    align-items: center;
  }
  .sc-main .sc-scene-2 .sc-copy {
    padding-top: clamp(24px, 4svh, 64px);
    padding-bottom: clamp(24px, 4svh, 64px);
  }
  .sc-main .sc-scene-2 .sc-steps { margin-top: clamp(24px, 5svh, 72px); }
  .sc-main .sc-scene-2 .sc-backdrop { object-position: center bottom; }
}
