/* ============================================================
   Resident Liability Insurance — page-specific Swiss styles.
   Layered on top of shared swiss.css primitives. Scoped to
   .v-swiss. Matches homepage / captive margin + section rhythm:
   stacked heads, column-2 inset, no section rule dividers.
   ============================================================ */

/* ---- Page flow: no section hairlines (match captive) -------- */
.v-swiss .sw-rl-page .sw-phero {
  border-bottom: 0;
}

.v-swiss .sw-rl-page > .sw-section {
  border-bottom: 0;
}

.v-swiss .sw-rl-page .sw-section__head--stacked .sw-section__title {
  grid-column: 2 / span 7;
  max-width: none;
}

/* ---- Hero: text + media (match captive) --------------------- */
.v-swiss .sw-rl-page .sw-phero__inner {
  padding-block: clamp(40px, 5vw, 80px);
  row-gap: clamp(28px, 4vw, 48px);
  align-items: stretch;
}

.v-swiss .sw-rl-page .sw-phero__main {
  grid-column: 2 / span 5;
  align-self: stretch;
  display: flex;
  flex-direction: column;
}

.v-swiss .sw-rl-page .sw-phero:not(.sw-phero--media) .sw-phero__main {
  grid-column: 2 / span 7;
}

.v-swiss .sw-rl-page .sw-phero__title {
  margin: 0;
  line-height: 0.95;
  text-wrap: initial;
}

.v-swiss .sw-rl-page .sw-phero__title-accent {
  color: var(--sw-blue);
}

.v-swiss .sw-rl-page .sw-phero__meta {
  flex: 1;
  margin-top: clamp(24px, 3vw, 40px);
  padding-top: 8px;
  border-top: 2px solid var(--sw-ink);
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.v-swiss .sw-rl-page .sw-phero__intro {
  margin: 0;
  line-height: 1.55;
}

.v-swiss .sw-rl-page .sw-phero__meta .sw-btn {
  align-self: flex-start;
  margin-top: auto;
}

.v-swiss .sw-rl-page .sw-phero__media {
  grid-column: 7 / span 5;
  align-self: stretch;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  border: 1px solid var(--sw-ink);
  overflow: hidden;
}

.v-swiss .sw-rl-page .sw-phero__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.v-swiss .sw-rl-page .sw-phero__media--placeholder {
  background: var(--sw-blue-100);
}

/* Video hero: player occupies columns 6–11 so it is larger than the
   image heroes, and its 16:9 box sets the row. The headline and button
   stretch to that box — top of the title with the top of the player,
   bottom of the button with the bottom. */
.v-swiss .sw-rl-page .sw-phero--video .sw-phero__inner {
  padding-bottom: clamp(24px, 3vw, 36px);
  row-gap: clamp(28px, 3vw, 40px);
}

/* Four columns can't hold the H1 size beside the player; step down
   one level until the lockup stacks below 1100px. */
.v-swiss .sw-rl-page .sw-phero--video .sw-phero__title {
  font-size: var(--sw-fs-h2);
}

.v-swiss .sw-rl-page .sw-phero--video .sw-phero__main {
  grid-column: 2 / span 4;
}

.v-swiss .sw-rl-page .sw-phero--video .rl-integrations {
  grid-column: 2 / span 10;
}

.v-swiss .sw-rl-page .sw-phero--video .sw-phero__media--video {
  grid-column: 6 / span 6;
  align-self: start;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 0;
  border: 1px solid var(--sw-ink);
  overflow: hidden;
  background: #000;
}

.v-swiss .sw-rl-page .sw-phero--video .sw-phero__media--video iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ---- How it works: lead + toggleable flowcharts ------------- */
.v-swiss .rl-how__body {
  padding-top: 8px;
  padding-bottom: clamp(32px, 4vw, 56px);
  row-gap: clamp(28px, 3.5vw, 44px);
  align-items: start;
}
.v-swiss .rl-how__lead { grid-column: 2 / span 7; }
.v-swiss .rl-how__visual {
  grid-column: 2 / span 10;
  min-width: 0;
  border: 1px solid var(--sw-ink);
  border-top: 3px solid var(--sw-blue);
  background: var(--sw-paper);
}

.v-swiss .rl-flow-toggle {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-bottom: 1px solid var(--sw-ink);
}
.v-swiss .rl-flow-toggle__btn {
  appearance: none;
  margin: 0;
  padding: 16px 20px;
  border: 0;
  border-right: 1px solid var(--sw-ink);
  background: transparent;
  color: var(--sw-ink-70);
  font-family: var(--sw-text);
  font-size: var(--sw-fs-label);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: left;
  cursor: pointer;
}
.v-swiss .rl-flow-toggle__btn:last-child { border-right: 0; }
.v-swiss .rl-flow-toggle__btn.is-active {
  background: var(--sw-blue);
  color: var(--sw-paper);
}
.v-swiss .rl-flow-toggle__btn:focus-visible {
  outline: 2px solid var(--sw-blue);
  outline-offset: -2px;
}

.v-swiss .rl-flow-panel {
  padding: clamp(24px, 3vw, 40px);
}
.v-swiss .rl-flow-panel[hidden] { display: none; }
.v-swiss .rl-flow-panel__summary {
  margin: 0 0 clamp(24px, 3vw, 36px);
  max-width: 62ch;
  font-size: var(--sw-fs-body);
  line-height: 1.55;
  color: var(--sw-ink-70);
}

.v-swiss .rl-flow__node {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 16px;
  align-items: start;
  min-width: 0;
  width: min(100%, 36rem);
  padding: 18px 20px;
  border: 1px solid var(--sw-ink);
  background: var(--sw-paper);
}
.v-swiss .rl-flow__num {
  font-family: var(--sw-display);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  font-size: var(--sw-fs-h3);
  line-height: 0.9;
  letter-spacing: -0.03em;
  color: var(--sw-blue);
}
.v-swiss .rl-flow__copy h3 {
  margin: 0 0 8px;
  font-family: var(--sw-display);
  font-weight: 700;
  font-size: var(--sw-fs-h4);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--sw-ink);
}
.v-swiss .rl-flow__copy p {
  margin: 0;
  font-size: var(--sw-fs-body);
  line-height: 1.55;
  color: var(--sw-ink-70);
}

.v-swiss .rl-flow--linear {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}
.v-swiss .rl-flow--linear .rl-flow__node {
  position: relative;
  width: 100%;
  grid-template-columns: 1fr;
  row-gap: 12px;
}
.v-swiss .rl-flow--linear .rl-flow__node:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 100%;
  width: 16px;
  height: 1px;
  background: var(--sw-ink);
}
.v-swiss .rl-flow--linear .rl-flow__node--unlink::after {
  display: none;
}

.v-swiss .rl-flow--branch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--sw-gap);
}
.v-swiss .rl-flow--branch > .rl-flow__node {
  grid-column: 1 / -1;
  justify-self: center;
}
.v-swiss .rl-flow__spine {
  grid-column: 1 / -1;
  justify-self: center;
  width: 1px;
  height: 24px;
  background: var(--sw-ink);
}
.v-swiss .rl-flow__fork,
.v-swiss .rl-flow__join,
.v-swiss .rl-flow__branches {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--sw-gap);
}
.v-swiss .rl-flow__fork,
.v-swiss .rl-flow__join {
  height: 28px;
}
.v-swiss .rl-flow__arm {
  position: relative;
}
.v-swiss .rl-flow__arm::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--sw-ink);
}
.v-swiss .rl-flow__fork .rl-flow__arm:first-child::after,
.v-swiss .rl-flow__join .rl-flow__arm:first-child::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  right: calc(-0.5 * var(--sw-gap));
  height: 1px;
  background: var(--sw-ink);
}
.v-swiss .rl-flow__fork .rl-flow__arm:last-child::after,
.v-swiss .rl-flow__join .rl-flow__arm:last-child::after {
  content: "";
  position: absolute;
  top: 0;
  left: calc(-0.5 * var(--sw-gap));
  right: 50%;
  height: 1px;
  background: var(--sw-ink);
}
.v-swiss .rl-flow__join .rl-flow__arm:first-child::after,
.v-swiss .rl-flow__join .rl-flow__arm:last-child::after {
  top: auto;
  bottom: 0;
}
.v-swiss .rl-flow__branch {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px 18px 18px;
  border: 1px solid var(--sw-ink);
  background: var(--sw-blue-100);
}
.v-swiss .rl-flow__branch-label {
  margin: 0;
  font-size: var(--sw-fs-label);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sw-ink);
}
.v-swiss .rl-flow__node--sub {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}
.v-swiss .rl-flow__node--sub .rl-flow__num {
  font-size: var(--sw-fs-body);
  line-height: 1.2;
  margin-top: 2px;
}

/* ---- Team: margin label + banner, lead and points beside ----- */
.v-swiss .rl-team__body {
  padding-top: 8px;
  padding-bottom: clamp(48px, 6vw, 80px);
}
.v-swiss .rl-team__lead { margin: 0; }

/* ---- Platform intro: lead + ruled rows ------------------------ */
.v-swiss .rl-platform-intro__body,
.v-swiss .rl-capabilities__body,
.v-swiss .rl-student__body {
  padding-top: 8px;
  row-gap: clamp(28px, 3.5vw, 44px);
  align-items: start;
}
.v-swiss .rl-platform-intro__lead,
.v-swiss .rl-capabilities__lead,
.v-swiss .rl-student__lead { grid-column: 2 / span 7; }



/* ---- Platform: title + intro --------------------------------- */
.v-swiss .rl-platform__head {
  padding-top: clamp(32px, 4vw, 52px);
  padding-bottom: clamp(20px, 2.5vw, 32px);
  row-gap: clamp(28px, 3vw, 40px);
  align-items: stretch;
}
.v-swiss .rl-platform__head .sw-eyebrow {
  grid-column: 1 / -1;
  padding-top: 0;
}
.v-swiss .rl-platform__copy {
  grid-column: 2 / span 7;
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}
.v-swiss .rl-platform__copy .sw-section__title {
  grid-column: auto;
  max-width: none;
  margin: 0;
}
.v-swiss .rl-platform__lead {
  max-width: none;
}

/* Axonometric HO4 Verify — left side of the reporting showcase.
   Height follows the painted footprint calculated by the scene JS. */
.v-swiss .rl-visual-cell {
  grid-column: 2 / span 6;
  min-width: 0;
  align-self: start;
  display: grid;
  justify-items: center;
}
.v-swiss .rl-axo {
  position: relative;
  min-width: 0;
  width: 100%;
  height: var(--axo-fit-height, auto);
  margin-inline: 0;
}
.v-swiss .rl-axo .axo {
  position: absolute;
  inset: 0;
  min-width: 0;
  min-height: 0;
  height: 100%;
  width: 100%;
}
.v-swiss .rl-axo .axo__stage {
  min-height: 0;
  height: 100%;
  padding: 0;
  background: none;
  border: none;
  place-items: center;
  /* Painted isometric footprint may extend past the host; never clip. */
  overflow: visible;
}
.v-swiss .rl-axo .axo__scene {
  margin: 0;
}

.v-swiss .rl-platform__body {
  padding-top: clamp(48px, 6vw, 80px);
  padding-bottom: 0;
  row-gap: clamp(32px, 4vw, 52px);
  align-items: start;
}

.v-swiss .rl-integrations { grid-column: 2 / span 10; }
.v-swiss .rl-integrations__label {
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--sw-rule-strong);
  font-size: var(--sw-fs-label);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sw-ink);
}
.v-swiss .rl-integrations__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--sw-gap);
}
.v-swiss .rl-integration {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 72px;
}
.v-swiss .rl-integration__logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: var(--rl-logo-h, 28px);
  object-fit: contain;
}
.v-swiss .rl-integration__more {
  font-family: var(--sw-display);
  font-weight: 700;
  font-size: var(--sw-fs-h4);
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--sw-ink);
}

/* Text-only stand-in for the logo row, laid out as a Swiss row. */
.v-swiss .rl-integrations--statement {
  display: grid;
  grid-template-columns: subgrid;
  align-items: start;
  padding-top: clamp(24px, 3vw, 36px);
  border-top: 1px solid var(--sw-rule-strong);
}
.v-swiss .rl-integrations__kicker {
  grid-column: 1 / span 4;
  margin: 0;
  padding-top: 0.6em;
  font-size: var(--sw-fs-label);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sw-ink);
}
.v-swiss .rl-integrations__body { grid-column: 5 / -1; }
.v-swiss .rl-integrations__statement {
  margin: 0;
  font-family: var(--sw-display);
  font-weight: 700;
  font-size: var(--sw-fs-h3);
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--sw-ink);
}
.v-swiss .rl-integrations__accent { color: var(--sw-blue); }
.v-swiss .rl-integrations__note {
  max-width: 60ch;
  margin: 12px 0 0;
  font-size: var(--sw-fs-body);
  line-height: 1.5;
  color: var(--sw-ink-70);
}

/* ---- Implementation ----------------------------------------- */
/* Tall banner matching the P&C pages: 3 columns, running from the top
   of the title to the end of the copy. The image never sets the height. */
.v-swiss .rl-impl.sw-section__head {
  padding-bottom: clamp(24px, 4vw, 48px);
  align-items: stretch;
}
.v-swiss .rl-impl > .sw-eyebrow { grid-row: 1; }
.v-swiss .rl-impl > .sw-section__title { grid-row: 2; }
.v-swiss .rl-impl__copy {
  grid-column: 2 / span 6;
  grid-row: 3;
  min-width: 0;
}
.v-swiss .rl-impl__media {
  grid-column: 9 / span 3;
  grid-row: 2 / span 2;
  position: relative;
  min-height: clamp(280px, 28vw, 420px);
  overflow: hidden;
}
.v-swiss .rl-impl__media--placeholder {
  background:
    repeating-linear-gradient(135deg, transparent 0 11px, var(--sw-rule) 11px 12px),
    var(--sw-blue-tint-05);
  border: 1px solid var(--sw-rule);
}
.v-swiss .rl-impl__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.v-swiss .rl-impl__prose {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.v-swiss .rl-impl__label {
  margin: clamp(32px, 3.6vw, 48px) 0 0;
  padding-top: 12px;
  border-top: 2px solid var(--sw-ink);
  font-size: var(--sw-fs-label);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sw-ink);
}
.v-swiss .rl-impl__list {
  margin: 8px 0 0;
}
.v-swiss .rl-impl__item {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  column-gap: var(--sw-gap);
  padding: 12px 0;
  border-bottom: 1px solid var(--sw-rule);
  font-size: var(--sw-fs-body);
  line-height: 1.45;
}
.v-swiss .rl-impl__item:last-child { border-bottom: 0; }
.v-swiss .rl-impl__item dt {
  font-weight: 600;
  color: var(--sw-ink);
}
.v-swiss .rl-impl__item dd {
  margin: 0;
  color: var(--sw-ink-70);
}

/* ---- Dashboard + reporting ---------------------------------- */
.v-swiss .rl-platform__showcase {
  padding-top: clamp(24px, 3vw, 40px);
  padding-bottom: clamp(48px, 6vw, 80px);
  align-items: start;
}
.v-swiss .rl-ai + .rl-platform__showcase {
  padding-top: clamp(72px, 9vw, 136px);
}
.v-swiss .rl-reporting {
  grid-column: 8 / span 4;
}
.v-swiss .rl-reporting .sw-eyebrow {
  padding-top: 0;
}
.v-swiss .rl-reporting__title {
  margin: clamp(28px, 3vw, 44px) 0 14px;
  font-family: var(--sw-display);
  font-weight: 700;
  font-size: var(--sw-fs-h3);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--sw-ink);
}
.v-swiss .rl-reporting__intro {
  margin: 0;
  font-size: var(--sw-fs-body);
  line-height: 1.55;
  color: var(--sw-ink-70);
}
.v-swiss .rl-reporting__details {
  margin-top: clamp(20px, 2.4vw, 32px);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.v-swiss .rl-reporting__details p {
  margin: 0;
  font-size: var(--sw-fs-body);
  line-height: 1.6;
  color: var(--sw-ink);
}
.v-swiss .rl-reporting__list {
  list-style: none;
  margin: clamp(24px, 3vw, 36px) 0 0;
  padding: 18px 0 0;
  border-top: 1px solid var(--sw-rule-strong);
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.v-swiss .rl-reporting__list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--sw-fs-body);
  line-height: 1.4;
  color: var(--sw-ink);
}
.v-swiss .rl-reporting__list svg {
  flex: none;
  margin-top: 1px;
  color: var(--sw-blue);
}

/* ---- Platform overview intro -------------------------------- */
.v-swiss .rl-platform__intro {
  padding-top: 8px;
}
.v-swiss .rl-platform__intro .sw-lead {
  grid-column: 2 / span 7;
}

/* ---- AI subsection: copy + visual --------------------------- */
.v-swiss .rl-ai {
  padding-top: clamp(28px, 3.5vw, 48px);
  padding-bottom: clamp(24px, 3vw, 40px);
  align-items: start;
}
.v-swiss .rl-ai__copy {
  grid-column: 2 / span 5;
}
.v-swiss .rl-ai__eyebrow {
  padding-top: 0;
}
.v-swiss .rl-ai__title {
  margin: clamp(28px, 3vw, 44px) 0 14px;
  font-family: var(--sw-display);
  font-weight: 700;
  font-size: var(--sw-fs-h3);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--sw-ink);
}
.v-swiss .rl-ai__p {
  margin: 0;
  font-size: var(--sw-fs-body);
  line-height: 1.55;
  color: var(--sw-ink-70);
}
.v-swiss .rl-ai__details {
  margin-top: clamp(20px, 2.4vw, 32px);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.v-swiss .rl-ai__details p {
  margin: 0;
  font-size: var(--sw-fs-body);
  line-height: 1.6;
  color: var(--sw-ink);
}
.v-swiss .rl-ai__checks {
  list-style: none;
  margin: clamp(24px, 3vw, 36px) 0 0;
  padding: 18px 0 0;
  border-top: 1px solid var(--sw-rule-strong);
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.v-swiss .rl-ai__checks li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--sw-fs-body);
  line-height: 1.4;
  color: var(--sw-ink);
}
.v-swiss .rl-ai__checks svg {
  flex: none;
  margin-top: 1px;
  color: var(--sw-blue);
}
.v-swiss .rl-ai__visual {
  grid-column: 7 / span 5;
  min-width: 0;
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width: 1024px) {
  .v-swiss .rl-how__lead,
  .v-swiss .rl-how__visual,
  .v-swiss .rl-platform-intro__lead,
  .v-swiss .rl-capabilities__lead,
  .v-swiss .rl-student__lead,
  .v-swiss .rl-platform__intro .sw-lead,
  .v-swiss .rl-ai__copy,
  .v-swiss .rl-ai__visual,
  .v-swiss .rl-integrations {
    grid-column: 2 / span 10;
  }
  .v-swiss .rl-impl__copy { grid-column: 2 / span 7; }
  .v-swiss .rl-ai__copy { grid-row: auto; }
  .v-swiss .rl-ai__visual { margin-top: clamp(32px, 6vw, 48px); }
  .v-swiss .rl-flow--linear {
    grid-template-columns: 1fr;
    row-gap: 16px;
  }
  .v-swiss .rl-flow--linear .rl-flow__node {
    grid-template-columns: auto 1fr;
  }
  .v-swiss .rl-flow--linear .rl-flow__node:not(:last-child)::after { display: none; }
  .v-swiss .rl-platform__copy { grid-column: 2 / span 7; }
  .v-swiss .rl-visual-cell { grid-column: 2 / span 6; }
  .v-swiss .rl-reporting { grid-column: 8 / span 4; }
  .v-swiss .rl-integrations__grid { grid-template-columns: repeat(2, 1fr); }
}

/* Below this width the text block outgrows the 16:9 player, so the
   lockup stacks instead of letting the button slip past the video. */
@media (max-width: 1099px) {
  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__inner {
    align-items: start;
  }

  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__title {
    font-size: var(--sw-fs-h1);
  }

  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__main,
  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__media--video {
    grid-column: 2 / span 10;
  }
}

@media (max-width: 860px) {
  .v-swiss .sw-rl-page .sw-phero__inner {
    align-items: start;
  }

  .v-swiss .sw-rl-page .sw-phero__main,
  .v-swiss .sw-rl-page .sw-phero__media,
  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__main,
  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__media--video {
    grid-column: 2 / span 10;
  }

  .v-swiss .sw-rl-page .sw-phero__media {
    height: auto;
    aspect-ratio: 4 / 3;
  }

  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__media--video {
    aspect-ratio: 16 / 9;
    height: auto;
  }

  .v-swiss .rl-how__lead,
  .v-swiss .rl-how__visual,
  .v-swiss .rl-platform-intro__lead,
  .v-swiss .rl-capabilities__lead,
  .v-swiss .rl-student__lead,
  .v-swiss .rl-platform__copy,
  .v-swiss .rl-platform__intro .sw-lead,
  .v-swiss .rl-impl__copy,
  .v-swiss .rl-impl__media,
  .v-swiss .rl-integrations,
  .v-swiss .rl-visual-cell,
  .v-swiss .rl-reporting,
  .v-swiss .rl-ai__copy,
  .v-swiss .rl-ai__visual {
    grid-column: 1 / -1;
  }
  .v-swiss .rl-flow--branch,
  .v-swiss .rl-flow__branches,
  .v-swiss .rl-flow__fork,
  .v-swiss .rl-flow__join {
    grid-template-columns: 1fr;
  }
  .v-swiss .rl-flow__fork,
  .v-swiss .rl-flow__join,
  .v-swiss .rl-flow__spine { display: none; }
  .v-swiss .rl-flow--branch { row-gap: 16px; }
  .v-swiss .rl-flow--branch > .rl-flow__node { width: 100%; }
  .v-swiss .rl-axo {
    min-height: clamp(200px, 48vw, 280px);
  }
  .v-swiss .rl-reporting {
    margin-top: clamp(32px, 6vw, 48px);
  }
  .v-swiss .rl-ai__copy,
  .v-swiss .rl-impl > *,
  .v-swiss .rl-impl__copy,
  .v-swiss .rl-impl__media { grid-row: auto; }
  .v-swiss .rl-impl__media {
    min-height: 0;
    aspect-ratio: 3 / 1;
  }
}

@media (max-width: 640px) {
  .v-swiss .sw-rl-page .sw-phero__main,
  .v-swiss .sw-rl-page .sw-phero__media,
  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__main,
  .v-swiss .sw-rl-page .sw-phero--video .sw-phero__media--video,
  .v-swiss .sw-rl-page .sw-phero--video .rl-integrations {
    grid-column: 1 / -1;
  }

  .v-swiss .rl-integrations__grid { grid-template-columns: 1fr; }
  .v-swiss .rl-integrations--statement { display: block; }
  .v-swiss .rl-integrations__kicker { padding-top: 0; margin-bottom: 12px; }
  .v-swiss .rl-impl__item { grid-template-columns: 1fr; row-gap: 2px; }
  .v-swiss .rl-flow-toggle { grid-template-columns: 1fr; }
  .v-swiss .rl-flow-toggle__btn { border-right: 0; border-bottom: 1px solid var(--sw-ink); }
  .v-swiss .rl-flow-toggle__btn:last-child { border-bottom: 0; }
}