/* Home About block (tagline + studio copy): left prose column, no cube column */

body.home .vl-home-about-block > .section.section-title {
  padding-top: 0;
}

body.home .vl-home-about-block {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding-inline: var(--edge-start, clamp(1rem, 4vw, 1.5rem));
  overflow-x: clip;
}

/* Direct sections: full width on mobile, left half on desktop (inside gutters). */
body.home .vl-home-about-block > .grid.section.section-title,
body.home .vl-home-about-block > .section-about {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-inline: 0;
  box-sizing: border-box;
  overflow-x: clip;
}

@media (min-width: 40rem) {
  body.home .vl-home-about-block > .grid.section.section-title,
  body.home .vl-home-about-block > .section-about {
    width: 50% !important;
    max-width: 50% !important;
  }
}

/*
 * Theme `.grid` + `[pos="2-12"]` span page columns and ignore the 50% wrapper.
 * Flatten to a single column that respects the about block width.
 */
body.home .vl-home-about-block .grid {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  grid-template-areas: none !important;
}

body.home .vl-home-about-block .section-about > .grid {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body.home .vl-home-about-block > .grid.section.section-title {
  display: block;
}

body.home .vl-home-about-block [pos],
body.home .vl-home-about-block [pos].text,
body.home .vl-home-about-block .section-about__text.text {
  display: block !important;
  grid-column: unset !important;
  grid-row: unset !important;
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-inline: 0 !important;
  justify-self: start !important;
  text-align: left !important;
  box-sizing: border-box;
}

body.home .vl-home-about-block .section-title .p2,
body.home .vl-home-about-block .section-about__text .p2,
body.home .vl-home-about-block .vl-home-about-lead,
body.home .vl-home-about-block .vl-text-generate,
body.home .vl-home-about-block .vl-encrypted-text {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
  white-space: normal !important;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

body.home .vl-home-about-block .vl-encrypted-text__char {
  white-space: normal;
}

body.home .vl-home-about-block .section-about__text .section-about__link {
  align-self: flex-start !important;
}

/* Marquee full-bleed rules live in blog.css (body.home .vl-home-about-block > .vl-home-about-tech-marquee-line). */