/* Shared v9 component geometry. Loaded last on every public page. */
:root {
  --content-width: 1080px;
  --compact-radius: 20px;
}

.logo > img.logo__mark,
.lp-logo img,
.footer .logo__mark,
.lp-footer .logo__mark {
  width: 38px !important;
  height: 38px !important;
  flex: 0 0 38px;
}

.lp-container,
.section.container,
.header.container,
.footer > .container {
  width: min(calc(100% - (2 * var(--page-gutter))), var(--content-width)) !important;
  max-width: var(--content-width) !important;
  margin-inline: auto !important;
}

/* Keep captions away from the subject on every internal-page hero. */
.lp-hero__art {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto;
  aspect-ratio: auto !important;
  max-height: none !important;
  overflow: hidden;
  background: #171714;
}

.lp-hero__art::after {
  display: none !important;
}

.lp-hero__art > img {
  grid-row: 1;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3;
  object-fit: cover !important;
  object-position: center !important;
}

.lp-hero__badge {
  position: static !important;
  grid-row: 2;
  width: 100%;
  min-height: 42px;
  margin: 0 !important;
  padding: 11px 15px !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, .1) !important;
  border-radius: 0 !important;
  background: #171714 !important;
  box-shadow: none !important;
  color: #fffaf0;
  font-size: 12px !important;
  line-height: 1.35;
  text-align: left;
}

.capability-grid {
  gap: 18px !important;
}

.capability {
  border-radius: var(--compact-radius) !important;
}

.capability__copy,
.capability:first-child .capability__copy {
  min-height: 205px !important;
  padding: 24px !important;
}

.capability__copy > a.control-link {
  margin-top: 18px !important;
}

.capability__image,
.capability:first-child .capability__image {
  max-height: 390px;
}

.live-demos__grid {
  gap: 18px !important;
}

.merge-demo,
.motion-demo {
  padding: 14px !important;
  border-radius: 22px !important;
}

.demo-heading {
  min-height: 36px !important;
  padding: 0 0 10px !important;
  gap: 8px !important;
  align-items: flex-start !important;
}

.demo-heading span {
  min-height: 24px !important;
  max-width: 42% !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(255, 198, 47, .28);
  border-radius: 999px;
  background: rgba(255, 198, 47, .07);
  font-size: 9px !important;
  line-height: 1.2;
}

.demo-heading h3 {
  position: static !important;
  width: auto !important;
  max-width: 54% !important;
  margin: 0 0 0 auto !important;
  padding: 4px 7px !important;
  border-radius: 8px;
  background: rgba(9, 9, 8, .56);
  font-size: 15px !important;
  line-height: 1.15;
  text-align: right;
}

.motion-status {
  right: 10px !important;
  bottom: 10px !important;
  left: auto !important;
  width: auto !important;
  max-width: calc(100% - 20px);
  padding: 6px 9px !important;
  border-radius: 8px !important;
  font-size: 10px !important;
}

.start.final-cta,
.lp-final {
  width: min(calc(100% - (2 * var(--page-gutter))), 860px) !important;
  max-width: 860px !important;
  padding: 34px !important;
}

.prompt-form {
  width: min(100%, 560px) !important;
  max-width: 560px !important;
  margin-top: 22px !important;
  padding: 11px !important;
  border-radius: 20px !important;
}

.prompt-form textarea {
  min-height: 72px !important;
  resize: none !important;
}

.lp-related {
  width: min(100%, 900px) !important;
  max-width: 900px !important;
  margin: 22px auto 0 !important;
  padding: 0 !important;
  gap: 10px !important;
  justify-content: center !important;
}

.lp-related a {
  min-height: 42px;
  padding: 10px 15px !important;
}

.lp-faq,
section.section.container.faq {
  width: min(calc(100% - (2 * var(--page-gutter))), var(--content-width)) !important;
  max-width: var(--content-width) !important;
  margin-inline: auto !important;
}

.lp-insight-list li {
  display: grid !important;
  grid-template-columns: minmax(92px, .36fr) minmax(0, 1fr);
  min-height: 66px;
  align-items: center !important;
  gap: 16px;
  padding: 12px 16px !important;
}

.lp-insight-list strong,
.lp-insight-list small {
  align-self: center;
  margin: 0;
}

@media (max-width: 900px) {
  .lp-hero__art {
    width: min(100%, 620px) !important;
  }

  .capability__copy,
  .capability:first-child .capability__copy {
    min-height: 0 !important;
  }
}

@media (max-width: 620px) {
  .lp-container,
  .section.container,
  .header.container,
  .footer > .container {
    width: min(calc(100% - 32px), var(--content-width)) !important;
  }

  .lp-hero__badge {
    min-height: 40px;
    padding: 10px 13px !important;
    font-size: 11px !important;
  }

  .capability__copy {
    padding: 20px !important;
  }

  .demo-heading h3 {
    font-size: 14px !important;
  }

  .start.final-cta,
  .lp-final {
    width: calc(100% - 32px) !important;
    padding: 24px 18px !important;
  }

  .prompt-form {
    padding: 10px !important;
  }

  .prompt-form textarea {
    min-height: 82px !important;
  }

  .lp-related {
    width: 100% !important;
    justify-content: flex-start !important;
  }

  .lp-related a {
    flex: 1 1 calc(50% - 5px);
    min-width: 0;
    text-align: center;
  }

  .lp-insight-list li {
    grid-template-columns: 94px minmax(0, 1fr);
    min-height: 62px;
    gap: 12px;
  }
}

/* v12: one spacing system and an unobstructed workflow photograph. */
:root {
  --section-space: clamp(14px, 1.4vw, 20px);
}

/* Section padding already creates the rhythm. A separate margin doubled it. */
main > .section:not(.hero) {
  margin-top: 0 !important;
}

.section:not(.hero),
.lp-section,
.lp-section + .lp-section {
  padding-block: var(--section-space) !important;
}

#gallery .section-heading,
#workflow .section-heading {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

#workflow .workflow__visual {
  background-position: center center !important;
  background-size: cover !important;
}

#workflow .workflow__caption {
  position: absolute !important;
  top: 14px !important;
  right: auto !important;
  bottom: auto !important;
  left: 14px !important;
  width: min(40%, 390px) !important;
  max-width: calc(100% - 28px) !important;
  padding: 11px 14px !important;
}

#workflow .workflow__caption p {
  margin-bottom: 4px !important;
  font-size: 12px !important;
}

#workflow .workflow__caption strong {
  font-size: clamp(17px, 1.45vw, 21px) !important;
  line-height: 1.18 !important;
}

@media (max-width: 620px) {
  main > .section:not(.hero) {
    margin-top: 0 !important;
  }

  .section:not(.hero),
  .lp-section,
  .lp-section + .lp-section {
    padding-block: 13px !important;
  }

  #workflow .workflow__visual {
    background-position: 58% center !important;
  }

  #workflow .workflow__caption {
    top: 10px !important;
    left: 10px !important;
    width: min(58%, 220px) !important;
    max-width: calc(100% - 20px) !important;
    padding: 9px 11px !important;
    border-radius: 12px !important;
  }

  #workflow .workflow__caption p {
    font-size: 10px !important;
  }

  #workflow .workflow__caption strong {
    font-size: 15px !important;
    line-height: 1.16 !important;
  }
}

/* Cross-page responsive QA: consistent rhythm from 360px to 1440px. */
.header,
.lp-header {
  position: sticky !important;
  top: 0;
  z-index: 100;
}

/* Sticky headers stay in document flow, so legacy fixed-header compensation
   must not create a second empty header row. */
body {
  padding-top: 0 !important;
}

.hero {
  padding-block: clamp(40px, 5vw, 68px) 34px !important;
}

.lp-hero {
  padding-block: clamp(24px, 3.2vw, 38px) !important;
}

.lp-section,
.lp-section + .lp-section {
  padding-block: clamp(28px, 3.5vw, 42px) !important;
}

.demo-heading {
  min-height: 30px !important;
  justify-content: flex-start !important;
  padding-bottom: 8px !important;
}

.demo-heading span {
  max-width: none !important;
}

.workflow__caption {
  width: min(58%, 560px);
  padding: clamp(15px, 2vw, 22px) !important;
}

.workflow__caption strong {
  font-size: clamp(20px, 2.4vw, 30px) !important;
  line-height: 1.16;
}

.lp-proof__stage > figure,
.lp-proof__prompt {
  min-height: 300px !important;
}

.lp-proof__stage figcaption {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 12px 16px !important;
  text-align: center;
}

.lp-proof__prompt {
  justify-content: center;
  padding: 20px !important;
}

.lp-proof__prompt blockquote,
.lp-proof__prompt p,
.lp-proof__prompt p:last-of-type {
  margin-block: 14px 18px;
  font-size: 17px;
  line-height: 1.38;
}

.lp-proof__prompt .lp-button {
  margin-top: 8px;
}

.lp-related {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.lp-related a {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  line-height: 1.3;
  text-align: center;
}

.action,
.lp-button,
.control-link,
.text-action,
.demo-button,
.prompt-form button {
  transition: transform .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.action:hover,
.lp-button:hover,
.control-link:hover,
.text-action:hover,
.demo-button:hover,
.prompt-form button:hover {
  transform: translateY(-2px);
}

.action:focus-visible,
.lp-button:focus-visible,
.control-link:focus-visible,
.text-action:focus-visible,
.demo-button:focus-visible,
.prompt-form button:focus-visible,
a:focus-visible,
button:focus-visible,
summary:focus-visible,
textarea:focus-visible,
input:focus-visible {
  outline: 3px solid #fff7d6;
  outline-offset: 3px;
}

@media (max-width: 900px) {
  .hero {
    padding-block: 34px 28px !important;
  }

  .lp-hero {
    gap: 22px !important;
    padding-block: 24px 30px !important;
  }

  .lp-section,
  .lp-section + .lp-section {
    padding-block: 30px !important;
  }

  .lp-proof__stage {
    width: 100%;
    max-width: 620px;
    margin-inline: auto;
  }

  .lp-proof__stage > figure,
  .lp-proof__prompt {
    min-height: 0 !important;
  }

  .lp-proof__prompt {
    padding: 22px !important;
  }
}

@media (max-width: 620px) {
  :root {
    --page-gutter: 16px;
  }

  .header,
  .lp-header__inner {
    min-height: 64px !important;
  }

  .hero {
    padding-block: 24px 24px !important;
  }

  .lp-hero {
    gap: 18px !important;
    padding-block: 20px 24px !important;
  }

  .lp-section,
  .lp-section + .lp-section {
    padding-block: 24px !important;
  }

  .section-heading,
  .lp-heading {
    margin-bottom: 22px !important;
  }

  .workflow__caption {
    right: 12px !important;
    bottom: 12px !important;
    left: 12px !important;
    width: auto;
    padding: 14px 15px !important;
  }

  .workflow__caption strong {
    font-size: 20px !important;
  }

  .lp-proof__stage {
    gap: 12px;
  }

  .lp-proof__stage figcaption {
    min-height: 44px;
    padding: 12px 14px !important;
  }

  .lp-proof__prompt {
    min-height: 0 !important;
    padding: 18px !important;
  }

  .lp-proof__prompt blockquote,
  .lp-proof__prompt p,
  .lp-proof__prompt p:last-of-type {
    margin-block: 10px 14px;
    font-size: 16px !important;
    line-height: 1.42;
  }

  .lp-proof__prompt .lp-button {
    margin-top: 4px;
  }

  .lp-related {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .lp-related a {
    min-height: 50px;
    padding: 12px 16px !important;
  }

  .start.final-cta,
  .lp-final {
    padding: 22px 18px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Keep source, prompt and result cards visually equal on compact tablets. */
@media (min-width: 621px) and (max-width: 900px) {
  .lp-proof__stage {
    max-width: 430px !important;
  }

  .lp-proof__stage > figure,
  .lp-proof__prompt {
    height: 370px !important;
    min-height: 370px !important;
  }
}

/* v10: final responsive alignment pass (360–1920+). */
:root {
  --site-header-height: 72px;
  --section-gap: clamp(32px, 3.6vw, 52px);
}

html {
  scroll-padding-top: calc(var(--site-header-height) + 16px);
}

body {
  padding-top: var(--site-header-height) !important;
}

/* The header spans the viewport; its contents stay on the shared content grid. */
.header.container,
.lp-header {
  position: fixed !important;
  inset: 0 0 auto !important;
  z-index: 1000 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: var(--site-header-height) !important;
  margin: 0 !important;
  background: rgba(10, 10, 9, .94) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.header.container {
  padding-inline: max(var(--page-gutter), calc((100vw - var(--content-width)) / 2)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
}

.header.container > .logo,
.header.container > .action {
  margin: 0 !important;
  flex: 0 0 auto;
}

.lp-header__inner {
  min-height: var(--site-header-height) !important;
}

/* A tighter shared rhythm for the landing page and every internal page. */
.hero {
  min-height: auto !important;
  padding-block: 30px 24px !important;
}

.lp-hero {
  padding-block: 22px 28px !important;
}

.section:not(.hero),
.lp-section,
.lp-section + .lp-section {
  padding-block: clamp(24px, 2.8vw, 36px) !important;
}

.section-heading,
.lp-heading {
  margin-bottom: 22px !important;
}

.section-heading--inline {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  text-align: center !important;
}

.section-heading--inline > div:first-child {
  width: 100%;
  text-align: center;
}

.section-heading--inline .kicker {
  margin-bottom: 10px !important;
}

.filter-bar {
  justify-content: center !important;
  margin: 0 !important;
}

/* All compact labels are optically centered, not merely line-height centered. */
.hero__notes li,
.workflow__grid article > span,
.demo-heading > span,
.filter-bar button,
.lp-step__mark,
.lp-list > :last-child:nth-child(odd) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.15 !important;
  text-align: center !important;
}

.hero__notes li {
  min-height: 36px;
  padding-block: 8px !important;
}

.workflow__grid article > span {
  min-height: 26px;
  padding-block: 5px !important;
}

.lp-list > :last-child:nth-child(odd) {
  width: 100%;
  min-height: 52px !important;
  padding: 13px 18px !important;
}

/* Smaller, corner-aligned copy over the workflow photograph. */
.workflow__caption {
  right: 14px !important;
  bottom: 14px !important;
  left: auto !important;
  width: min(46%, 470px) !important;
  max-width: calc(100% - 28px) !important;
  padding: 13px 16px !important;
  border-radius: 15px !important;
  background: rgba(7, 11, 15, .88) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, .3);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.workflow__caption p {
  margin-bottom: 5px !important;
}

.workflow__caption strong {
  font-size: clamp(18px, 1.65vw, 24px) !important;
  line-height: 1.2 !important;
}

/* Equal proof cards with the command label anchored at the top-left. */
.lp-proof__stage {
  align-items: stretch !important;
}

.lp-proof__stage > figure,
.lp-proof__prompt {
  height: 330px !important;
  min-height: 330px !important;
}

.lp-proof__prompt {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  padding: 20px !important;
}

.lp-proof__prompt > small {
  display: block !important;
  align-self: flex-start !important;
  margin: 0 0 12px !important;
  color: var(--accent, #ffc126) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: .08em !important;
  text-align: left !important;
  text-transform: uppercase;
}

.lp-proof__prompt blockquote,
.lp-proof__prompt p,
.lp-proof__prompt p:last-of-type {
  margin: 0 0 14px !important;
  font-size: 16px !important;
  line-height: 1.42 !important;
}

.lp-proof__prompt .lp-button {
  margin-top: auto !important;
}

/* Prevent 1px seams caused by fractional image sizing and clipping. */
.lp-hero__art,
.capability__image,
.lp-feature__visual,
.lp-proof__image,
.gallery-item,
.workflow__visual {
  isolation: isolate;
  overflow: hidden;
  background: #11110f;
}

.lp-hero__art > img,
.capability__image > img,
.lp-feature__visual > img,
.lp-proof__image > img,
.gallery-item > img,
.workflow__visual > img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  transform: scale(1.002);
  transform-origin: center;
}

@media (min-width: 1441px) {
  :root {
    --content-width: 1160px;
  }

  .hero {
    max-width: 1160px;
    margin-inline: auto;
  }
}

@media (min-width: 1800px) {
  :root {
    --content-width: 1240px;
  }

  .hero {
    max-width: 1240px;
  }
}

@media (min-width: 621px) and (max-width: 900px) {
  .lp-proof__stage > figure,
  .lp-proof__prompt {
    height: 330px !important;
    min-height: 330px !important;
  }
}

@media (max-width: 620px) {
  :root {
    --site-header-height: 64px;
  }

  .header.container {
    gap: 14px !important;
    padding-inline: 16px !important;
  }

  .header.container .logo__word,
  .lp-logo__word {
    white-space: nowrap;
  }

  .hero {
    padding-block: 20px 20px !important;
  }

  .lp-hero {
    padding-block: 16px 22px !important;
  }

  .section:not(.hero),
  .lp-section,
  .lp-section + .lp-section {
    padding-block: 22px !important;
  }

  .workflow__caption {
    right: 10px !important;
    bottom: 10px !important;
    left: auto !important;
    width: min(72%, 310px) !important;
    max-width: calc(100% - 20px) !important;
    padding: 11px 12px !important;
  }

  .workflow__caption strong {
    font-size: 17px !important;
  }

  .lp-proof__stage > figure,
  .lp-proof__prompt {
    height: auto !important;
    min-height: 0 !important;
  }

  .lp-proof__prompt {
    padding: 17px !important;
  }

  .lp-proof__prompt > small {
    margin-bottom: 10px !important;
    font-size: 12px !important;
  }

  .lp-proof__prompt blockquote,
  .lp-proof__prompt p,
  .lp-proof__prompt p:last-of-type {
    font-size: 15px !important;
  }

  .section-heading--inline {
    align-items: center !important;
    text-align: center !important;
  }
}

/* v10.1: fixed-header anchors and genuinely compact proof cards on small screens. */
main section[id],
footer[id] {
  scroll-margin-top: calc(var(--site-header-height) + 14px);
}

@media (max-width: 900px) {
  .lp-section.lp-container.lp-proof .lp-proof__stage > figure,
  .lp-section.lp-container.lp-proof .lp-proof__prompt {
    height: auto !important;
    min-height: 0 !important;
  }

  .lp-section.lp-container.lp-proof .lp-proof__prompt {
    align-self: start;
    padding: 18px !important;
  }

  .lp-section.lp-container.lp-proof .lp-proof__prompt .lp-button {
    margin-top: 16px !important;
  }
}

/* v11: compact page rhythm and final mobile media alignment. */
:root {
  --section-space: clamp(16px, 1.8vw, 24px);
}

main > .section:not(.hero) {
  margin-top: var(--section-space) !important;
}

.section:not(.hero),
.lp-section,
.lp-section + .lp-section {
  padding-block: clamp(16px, 1.8vw, 24px) !important;
}

.section-heading,
.lp-heading {
  margin-bottom: clamp(14px, 1.5vw, 20px) !important;
}

.visual-reel {
  margin-top: clamp(14px, 1.6vw, 22px) !important;
  padding-block: 8px 12px !important;
}

/* Every list row uses the same grid position, alignment and surface. */
.lp-list > :last-child:nth-child(odd) {
  display: block !important;
  grid-column: auto !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-height: 0 !important;
  padding: 18px 20px !important;
  background: var(--panel) !important;
  line-height: 1.58 !important;
  text-align: left !important;
}

@media (max-width: 900px) {
  .workflow__visual {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 3 / 2 !important;
    padding: 0 !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
  }

  .workflow__visual::before {
    background: linear-gradient(180deg, rgba(5, 7, 12, .02) 45%, rgba(5, 7, 12, .5)) !important;
  }

  .workflow__caption {
    margin: 0 !important;
  }
}

@media (max-width: 620px) {
  main > .section:not(.hero) {
    margin-top: 14px !important;
  }

  .section:not(.hero),
  .lp-section,
  .lp-section + .lp-section {
    padding-block: 15px !important;
  }

  .section-heading,
  .lp-heading {
    margin-bottom: 14px !important;
  }

  .visual-reel {
    margin-top: 12px !important;
  }
}

/* v12.1: final cascade layer — one compact rhythm and an unobstructed scene. */
:root {
  --section-space: clamp(12px, 1.25vw, 18px);
}

main > .section:not(.hero) {
  margin-top: 0 !important;
}

.section:not(.hero),
.lp-section,
.lp-section + .lp-section {
  padding-block: var(--section-space) !important;
}

.section-heading,
.lp-heading,
#gallery .section-heading,
#workflow .section-heading {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

#workflow .workflow__visual {
  background-position: center center !important;
  background-size: cover !important;
}

#workflow .workflow__visual::before {
  background: linear-gradient(180deg, rgba(5, 7, 12, .04), rgba(5, 7, 12, .18)) !important;
}

#workflow .workflow__caption {
  top: 14px !important;
  right: auto !important;
  bottom: auto !important;
  left: 14px !important;
  width: min(36%, 360px) !important;
  max-width: calc(100% - 28px) !important;
  margin: 0 !important;
  padding: 10px 13px !important;
}

#workflow .workflow__caption p {
  margin-bottom: 4px !important;
  font-size: 11px !important;
}

#workflow .workflow__caption strong {
  font-size: clamp(16px, 1.35vw, 20px) !important;
  line-height: 1.17 !important;
}

@media (max-width: 620px) {
  main > .section:not(.hero) {
    margin-top: 0 !important;
  }

  .section:not(.hero),
  .lp-section,
  .lp-section + .lp-section {
    padding-block: 12px !important;
  }

  #workflow .workflow__visual {
    background-position: 58% center !important;
  }

  #workflow .workflow__caption {
    top: 10px !important;
    left: 10px !important;
    width: min(52%, 190px) !important;
    max-width: calc(100% - 20px) !important;
    padding: 8px 10px !important;
    border-radius: 11px !important;
  }

  #workflow .workflow__caption p {
    font-size: 9px !important;
  }

  #workflow .workflow__caption strong {
    font-size: 14px !important;
    line-height: 1.15 !important;
  }
}

/* v13: one exact block rhythm and uncropped proof media at every viewport. */
:root {
  --main-block-space: 19px;
  --section-space: var(--main-block-space);
}

.section:not(.hero),
.lp-section,
.lp-section + .lp-section {
  padding-block: var(--main-block-space) !important;
}

.section-heading,
.lp-heading,
#gallery .section-heading,
#workflow .section-heading {
  margin-bottom: var(--main-block-space) !important;
}

/* The media frame follows the source orientation instead of cropping it. */
.lp-proof__stage {
  align-items: stretch !important;
}

.lp-proof__stage > figure,
.lp-proof__prompt {
  height: auto !important;
  min-height: 0 !important;
}

.lp-proof__stage > figure {
  align-self: stretch !important;
}

.lp-proof__image,
.lp-proof__stage figure[data-image] .lp-proof__image {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 3 / 2 !important;
  background: #171713 !important;
}

.lp-proof__image > img,
.lp-proof__stage figure[data-image] .lp-proof__image > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

/* These source/result pairs are portrait assets and keep their full 3:4 frame. */
.lp-proof__stage figure:is(
  [data-image="background-lamp-source-v5.webp"],
  [data-image="background-lamp-result-v5.webp"],
  [data-image="headphones-source-v4.webp"],
  [data-image="headphones-result-v4.webp"],
  [data-image="proof-merge-chair-source-v3.webp"],
  [data-image="proof-merge-chair-result-v3.webp"],
  [data-image="proof-photo-russian-source-v3.webp"],
  [data-image="proof-photo-russian-result-v3.webp"]
) .lp-proof__image {
  aspect-ratio: 3 / 4 !important;
}

.lp-proof__stage:has(figure:is(
  [data-image="background-lamp-source-v5.webp"],
  [data-image="headphones-source-v4.webp"],
  [data-image="proof-merge-chair-source-v3.webp"],
  [data-image="proof-photo-russian-source-v3.webp"]
)) {
  grid-template-columns: minmax(0, .78fr) minmax(260px, .96fr) minmax(0, .78fr) !important;
}

@media (max-width: 900px) {
  .lp-proof__stage:has(figure:is(
    [data-image="background-lamp-source-v5.webp"],
    [data-image="headphones-source-v4.webp"],
    [data-image="proof-merge-chair-source-v3.webp"],
    [data-image="proof-photo-russian-source-v3.webp"]
  )) {
    grid-template-columns: 1fr !important;
  }

  .lp-proof__stage > figure,
  .lp-proof__prompt {
    width: 100% !important;
  }
}

/* v15: final homepage override; intentionally last in the cascade. */
.hero h1 {
  width: min(100%, 760px) !important;
  max-width: 24ch !important;
  margin-inline: auto !important;
  font-size: 44px !important;
  line-height: 1.06 !important;
  text-wrap: balance;
}

.hero__lead {
  max-width: 760px !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
}

.capability:first-child .capability__image {
  width: 100% !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  background: #171714 !important;
}

.capability:first-child .capability__image > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  transform: scale(1.002) !important;
}

@media (max-width: 620px) {
  .hero h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 30px !important;
    line-height: 1.1 !important;
  }

  .hero__lead {
    font-size: 16px !important;
    line-height: 1.5 !important;
  }

  .capability:first-child .capability__image {
    aspect-ratio: 3 / 2 !important;
  }
}

/* v16: one horizontal inset for every text-bearing surface.
   Keep this section last so page-specific styles cannot reintroduce
   the visibly different "tabs" that accumulated across templates. */
:root {
  --nb-surface-inset: 24px;
}

.capability__copy,
.capability:first-child .capability__copy,
.workflow__grid > article,
.lp-card,
.lp-step,
.lp-feature__copy,
.lp-proof__prompt,
.lp-insight-panel,
.lp-list > li,
.lp-insight-list > li {
  padding-inline: var(--nb-surface-inset) !important;
}

/* Match the higher-specificity proof layout rules used by inner pages. */
.lp-section.lp-container.lp-proof .lp-proof__prompt {
  padding-inline: var(--nb-surface-inset) !important;
}

/* The studio copy is inset by its grid rather than by a nested card. */
.studio__grid {
  padding-inline: var(--nb-surface-inset) !important;
}

/* Full-width list rows must follow the same content line as their siblings. */
.lp-list > li,
.lp-insight-list > li {
  text-indent: 0 !important;
}

@media (max-width: 620px) {
  :root {
    --nb-surface-inset: 20px;
  }
}

/* v17: final alignment pass before the production-domain deployment. */
.lp-proof__prompt {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  align-content: stretch !important;
}

.lp-proof__prompt > small {
  align-self: start;
}

.lp-proof__prompt > :is(p, blockquote) {
  align-self: center;
}

.lp-proof__prompt .lp-button {
  align-self: end;
}

.lp-related {
  margin-top: 30px !important;
}

.control-link__icon,
.text-action::after,
.lp-back::after {
  position: relative;
  top: -1px;
  align-self: center;
}

@media (max-width: 620px) {
  .lp-related {
    margin-top: 24px !important;
  }
}