/* Shared sizing contract, loaded after every page theme.
   1440 x 900 is the reference viewport (1rem = 16px). Desktop sizing
   follows both available axes, bounded to keep text readable. Breakpoints
   stay in CSS pixels to match Webflow and the animation media queries. */
html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
}

:root {
  --site-content-width: 82.5rem;
  --site-reading-width: 75rem;
  --site-about-width: 77.5rem;
  --site-gutter: clamp(1.25rem, 3vw, 3.5rem);
}

/* Hidden on one axis makes the other axis auto and traps CSS sticky scenes.
   Clip decoration while keeping the document as the sole vertical scroller. */
body.ai-home-page:not(.ai-is-loading) {
  overflow-x: clip;
  overflow-y: visible;
}

@media (min-width: 992px) {
  html {
    font-size: clamp(.9375em, min(1.111111vw, 1.777778vh), 1.125em);
  }
}

/* Grid/flex children must be allowed to wrap inside their allotted track. */
:is(.overview-inner, .about-shell, .site-pricing__inner, .site-solutions__inner,
    .ai-section-shell, .ba-stealth-shell, .feature-component) :is(article, figure, h1, h2, h3, p) {
  min-width: 0;
  overflow-wrap: break-word;
}

body :is(.overview-inner, .site-pricing__inner, .site-solutions__inner) {
  width: 100%;
  max-width: var(--site-reading-width);
}
body .about-shell {
  width: min(var(--site-about-width), calc(100% - var(--site-gutter) * 2));
}
body .ai-section-shell {
  width: min(var(--site-content-width), calc(100% - var(--site-gutter) * 2));
}
/* Perspective entrance cards can project a few pixels beyond their section. */
body.ai-home-page :is(.ai-capability-badges, .site-solutions) { overflow-x: clip; }
body :is(.overview-section, .overview-page-intro, .overview-product-hero, .overview-cta,
    .site-solutions, .site-pricing) {
  padding-inline: var(--site-gutter);
}

/* Wide displays keep proportional gutters instead of an ever narrower column.
   Reading paragraphs retain their own line-length limits inside the shells. */
@media (min-width: 1600px) {
  :root {
    --site-content-width: max(82.5rem, 88vw);
    --site-reading-width: max(75rem, 88vw);
    --site-about-width: max(77.5rem, 88vw);
  }
  body [role="banner"].site-header .container-default-32 {
    width: min(92vw, calc(100% - 4rem));
  }
  body .about-hero h1 { font-size: clamp(4.25rem, 4vw, 6rem); }
  body .about-orbit { max-width: clamp(40rem, 36vw, 52rem); }
  body #geo-product-faq .geo-faq-card { max-width: var(--site-content-width); }
}

/* Retire the old 992–1199px heading limit: atmosphere fills the viewport. */
body .ai-hero--editorial .ai-hero__content {
  width: 100%;
  max-width: none;
}
body .ai-hero--editorial .ai-hero__heading {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-inline: var(--site-gutter);
}
body .ai-hero--editorial .ai-hero__line {
  white-space: normal;
}
body .ai-hero--editorial .ai-hero__line--brand {
  flex-wrap: wrap;
}
body .ai-hero--editorial .ai-hero__intro > p {
  max-width: min(100%, 56rem);
}
body :is(.overview-actions, .site-solutions__bottom, .trialbuttonsrow) {
  flex-wrap: wrap;
}

/* The miniature browser keeps its footer inside the device at every size. */
body .ai-browser-ui__body .ai-scrape-sidepanel {
  height: 100%;
  min-height: 0;
}
body .ai-scrape-sidepanel__content {
  flex: 1;
  overflow: auto;
}

/* Allow natural reading on short windows; section height remains a minimum. */
@media (min-width: 992px) and (max-height: 820px) {
  body .ai-story__sticky {
    min-height: 100svh;
    padding-bottom: 1.5rem;
  }
  body .ai-story .ai-computer {
    width: min(100%, max(18rem, calc((100svh - 19rem) * 1.6)));
    max-width: 56.25rem;
  }
}
@media (min-width: 992px) and (max-height: 700px) {
  body .ai-hero--editorial .ai-hero__heading {
    padding-block: calc(var(--ai-header-height) + 1.5rem) 1.5rem;
  }
  body.about-chapter-scroll-enabled .about-chapter {
    padding-block: 3rem;
  }
  body .ai-story__stage { padding-top: 10rem; }
}

@media (max-width: 1199px) and (min-width: 992px) {
  body [role="banner"].site-header .header-nav-menu-list-3 { gap: .75rem; }
  body [role="banner"].site-header .header-content-wrapper-3 { gap: 1rem; }
  body .ba-stealth-shell { grid-template-columns: minmax(0, .82fr) minmax(0, 1.28fr); }
}

@media (max-width: 767px) {
  body .site-pricing__grid.pricing-table { grid-template-columns: minmax(0, 1fr); }
}

/* The narrow navigation uses the same capsule material as its top bar. */
@media (max-width: 991px) {
  body [role="banner"].site-header .header-right-side { gap: .5rem; }
  body [role="banner"].site-header .hamburger-menu-wrapper {
    position: relative;
    flex: 0 0 var(--site-header-control-height);
    width: var(--site-header-control-height);
    height: var(--site-header-control-height);
    margin: 0;
    padding: 0;
    border: 1px solid rgba(39, 47, 199, .12);
    border-radius: 50%;
    background: rgba(255, 255, 255, .8);
    color: #272fc7;
    box-shadow: inset 0 1px 0 #fff, 0 .125rem .5rem #27377a08;
    transition: background 180ms ease, border-color 180ms ease;
  }
  body [role="banner"].site-header .hamburger-menu-wrapper:is(:hover, .w--open) {
    background: #edf0ff;
    border-color: rgba(39, 47, 199, .22);
  }
  body [role="banner"].site-header .hamburger-menu-wrapper:focus-visible {
    outline: 2px solid #747ce2;
    outline-offset: 3px;
  }
  body [role="banner"].site-header .hamburger-menu-wrapper > [class*="hamburger-menu-bar"] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.25rem;
    height: 2px;
    margin: 0;
    border-radius: 2px;
    background: currentColor;
    /* Retire the exported pixel-offset animation for the centered icon. */
    transform: translate(-50%, -50%) translateY(-.25rem) !important;
    transition: transform 200ms ease;
  }
  body [role="banner"].site-header .hamburger-menu-wrapper > .bottom {
    transform: translate(-50%, -50%) translateY(.25rem) !important;
  }
  body [role="banner"].site-header .hamburger-menu-wrapper.w--open > .top {
    transform: translate(-50%, -50%) rotate(45deg) !important;
  }
  body [role="banner"].site-header .hamburger-menu-wrapper.w--open > .bottom {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
  }
  body [role="banner"].site-header .w-nav-overlay {
    top: calc(100% + .5rem);
    height: auto !important;
    overflow: visible;
  }
  body [role="banner"].site-header .header-nav-menu-wrapper-3 {
    width: 100%;
    max-height: calc(100dvh - 6.5rem);
    overflow-y: auto;
    padding: .75rem;
    border: 1px solid rgba(64, 79, 122, .14);
    border-radius: 1.5rem;
    background: linear-gradient(135deg, #f5faff, #fff 55%, #f1f4ff);
    box-shadow: inset 0 1px 0 #fff, 0 .75rem 2rem #1f305917;
  }
  body [role="banner"].site-header .header-nav-menu-list-3 { gap: .25rem; padding: 0; }
  body [role="banner"].site-header .header-nav-link-4 {
    height: 3rem;
    padding: .875rem 1rem !important;
    border-radius: 1rem;
    transition: background 180ms ease, color 180ms ease;
  }
  body [role="banner"].site-header .header-nav-link-4:is(:hover, :focus-visible, .w--current) {
    background: #e9edff;
    color: #272fc7 !important;
  }
  body [role="banner"].site-header .header-nav-link-4::after { display: none; }
}
@media (max-width: 479px) {
  body [role="banner"].site-header .header-logo-link { flex-basis: 7.75rem; width: 7.75rem; min-width: 7.75rem; }
  body [role="banner"].site-header .header-logo-link img { width: 7.75rem; }
}
@media (max-width: 359px) {
  body [role="banner"].site-header .container-default-32 { width: calc(100% - 1rem); }
  body [role="banner"].site-header .header-logo-link { flex-basis: 6.25rem; width: 6.25rem; min-width: 6.25rem; }
  body [role="banner"].site-header .header-logo-link img { width: 6.25rem; }
  body [role="banner"].site-header .header-right-side { gap: .25rem; }
}
@media (prefers-reduced-motion: reduce) {
  body [role="banner"].site-header :is(.hamburger-menu-wrapper, .hamburger-menu-wrapper > [class*="hamburger-menu-bar"], .header-nav-link-4) {
    transition: none;
  }
}

/* The miniature UI has one logical desktop layout at every rendered size. */
body .ai-computer__scene {
  position: absolute;
  inset: 0 auto auto 0;
  width: 56.25rem;
  transform: scale(var(--story-device-scale, 1));
  transform-origin: top left;
}
body .ai-computer__scene .ai-computer__device {
  transform: none;
  will-change: auto;
}
/* Rasterize the miniature's text at the displayed size on supporting browsers. */
@supports (zoom: 1) {
  body .ai-computer__scene {
    zoom: var(--story-device-scale, 1);
    transform: none;
  }
}
body .ai-computer__scene .ai-browser-ui__body {
  grid-template-columns: minmax(0, 1fr) 32%;
}
body .ai-computer__scene .ai-browser-ui__body main { padding: 0; }
/* Isolate the scaled UI from the page's computed body line-height. Otherwise
   tiny labels retain full-size line boxes and push extraction fields offscreen. */
body .ai-computer__scene .ai-browser-ui {
  font-size: .5rem;
  line-height: 1.35;
  font-family: inherit;
  color: #34364b;
  -webkit-font-smoothing: antialiased;
}
body .ai-computer__scene .ai-scrape-sidepanel > :is(header, .ai-scrape-sidepanel__recording, .ai-scrape-sidepanel__stepper) {
  flex-shrink: 0;
}
body .ai-computer__scene .ai-data-stream {
  inset: .375rem;
  overflow: hidden;
  border-radius: .8125rem;
  font-size: .4375rem;
  line-height: 1.35;
}

/* A readable demonstration: fewer products, five complete fields, and
   results in their own row instead of floating over the browser. */
body .ai-computer__scene .ai-scrape-page__nav { height: 2.5rem; font-size: .625rem; }
body .ai-computer__scene .ai-scrape-page__nav b {
  font-family: inherit;
  font-size: .6875rem;
  font-weight: 600;
}
body .ai-computer__scene .ai-scrape-page__title strong {
  font-family: inherit;
  font-size: .875rem;
  font-weight: 600;
}
body .ai-computer__scene .ai-scrape-page__title small { font-weight: 600; letter-spacing: .08em; }
body .ai-computer__scene .ai-scrape-page__title { padding-block: 1.25rem; }
body .ai-computer__scene .ai-scrape-page__products { gap: .625rem; }
body .ai-computer__scene .ai-scrape-page__products article {
  min-height: 3.5rem;
  padding: .625rem .75rem;
  border-color: #e6e8f0;
  border-radius: .5rem;
  box-shadow: 0 1px 3px rgba(44, 48, 74, .025);
}
body .ai-computer__scene .ai-scrape-page__products article b,
body .ai-computer__scene .ai-scrape-page__metrics strong { font-size: .75rem; font-weight: 600; }
body .ai-computer__scene .ai-scrape-page__products article small { font-size: .625rem; }
body .ai-computer__scene .ai-scrape-page__products article > i {
  width: 1.25rem;
  height: 1.5rem;
  border-radius: .3125rem;
  background: #646bcf;
  font-size: .375rem;
  font-weight: 600;
}
body .ai-computer__scene .ai-scrape-page__metrics small { color: #cca164; letter-spacing: 0; }
body .ai-computer__scene .ai-scrape-sidepanel > header {
  height: 3rem;
  padding-inline: .875rem;
}
body .ai-computer__scene .ai-scrape-sidepanel > header b { font-size: .75rem; font-weight: 600; }
body .ai-computer__scene .ai-scrape-sidepanel > header small { font-size: .625rem; }
body .ai-computer__scene .ai-scrape-sidepanel__content {
  display: grid;
  grid-template-rows: max-content repeat(5, minmax(0, 1fr));
  gap: .4375rem;
  padding: 1rem .875rem .875rem;
  overflow: hidden;
}
body .ai-computer__scene .ai-scrape-sidepanel__heading { margin-bottom: .625rem; }
body .ai-computer__scene .ai-scrape-sidepanel__heading > div { gap: .375rem; }
body .ai-computer__scene .ai-scrape-sidepanel__heading small { font-size: .375rem; font-weight: 600; letter-spacing: .1em; }
body .ai-computer__scene .ai-scrape-sidepanel__heading h4 { font-size: .8125rem; font-weight: 600; }
body .ai-computer__scene .ai-scrape-sidepanel__heading > span { font-size: .5625rem; white-space: nowrap; }
body .ai-computer__scene .ai-scrape-field {
  min-height: 0;
  margin-bottom: 0;
  padding: .375rem .5rem;
  border-color: #e1e4ee;
  border-radius: .5rem;
  box-shadow: 0 1px 3px rgba(44, 48, 74, .025);
}
body .ai-computer__scene .ai-scrape-field b { font-size: .6875rem; font-weight: 500; }
body .ai-computer__scene .ai-scrape-field small { font-size: .625rem; }
body .ai-computer__scene .ai-scrape-field > em { font-size: .5rem; border-color: #e8eaf2; color: #73798a; }
body .ai-computer__scene .ai-scrape-field > i {
  width: .625rem;
  height: .625rem;
  font-size: .375rem;
  line-height: 1;
  font-weight: 600;
}
body .ai-computer__scene .ai-scrape-sidepanel > footer {
  position: static;
  flex-shrink: 0;
  margin-top: auto;
  padding: .625rem .875rem;
}
body .ai-computer__scene .ai-scrape-sidepanel > footer :is(button, strong) {
  height: 1.875rem;
  font-size: .5625rem;
  line-height: 1.25;
}
body .ai-computer__scene .ai-scrape-sidepanel > footer strong {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .3125rem;
  background: #4f57d0;
  font-weight: 500;
  box-shadow: none;
}
body .ai-computer__scene .ai-scrape-sidepanel > footer strong span { margin: 0; }
body .ai-computer__scene .ai-story-results {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1rem;
}
body .ai-computer__scene .ai-story-results .ai-result-card {
  position: static;
  min-width: 0;
  width: auto;
  min-height: 4.75rem;
  padding: .75rem 1rem;
  align-content: center;
  line-height: 1.35;
  box-shadow: 0 .375rem 1rem rgba(37, 40, 91, .06);
}
body .ai-computer__scene .ai-result-card small { font-size: .5625rem; }
body .ai-computer__scene .ai-result-card strong { font-size: .75rem; font-weight: 600; }
body .ai-computer__scene .ai-computer__flow { opacity: .22; }
body .ai-computer__scene .ai-computer__lid {
  padding: .375rem;
  border-radius: 1rem;
  border-color: rgba(41, 44, 67, .14);
  background: #282b43;
  box-shadow: 0 1.25rem 3rem rgba(35, 39, 75, .1), inset 0 0 0 1px rgba(255, 255, 255, .08);
}
body .ai-computer__scene .ai-browser-ui { border-radius: .6875rem; }
body .ai-computer__scene .ai-browser-ui__bar { background: #202338; }
body .ai-computer__scene .ai-browser-ui__address { background: rgba(255, 255, 255, .055); font-size: .625rem; }
body .ai-computer__scene .ai-computer__camera { top: .125rem; width: .125rem; height: .125rem; }
body .ai-computer__scene .ai-computer__glow { opacity: .3; }
body .ai-computer__scene .ai-computer__aura { opacity: .3; }
@media (max-width: 767px) {
  body .ai-computer__scene .ai-story-results { display: none; }
}
body:not(.has-story-motion) .ai-computer__scene .ai-story-results { display: none; }

/* A larger desktop device uses the actual space below the story heading. */
@media (min-width: 992px) {
  body.has-story-motion .ai-story__sticky {
    height: 100svh;
    min-height: 100svh;
    padding: 0 max(var(--site-gutter), calc((100vw - var(--site-content-width)) / 2)) 2rem;
    align-content: stretch;
  }
  body.has-story-motion .ai-story__header {
    left: max(var(--site-gutter), calc((100vw - var(--site-content-width)) / 2));
    max-width: calc(100% - var(--site-gutter) * 2);
  }
  body.has-story-motion .ai-story__stage {
    box-sizing: border-box;
    min-height: 0;
    height: 100%;
    padding-top: var(--story-header-space, 19rem);
    grid-template-columns: minmax(15.625rem, .27fr) minmax(0, 1fr);
    gap: clamp(1.5rem, 2vw, 2.75rem);
  }
  body.has-story-motion .ai-computer {
    min-width: 0;
    width: 100%;
    max-width: 64.6875rem;
  }
}

/* Enhancement follows capability, not window width. Narrow desktop windows
   retain the canvas, flipping copy and scroll-driven page navigation. */
body .ai-ecosystem--3d.is-webgl-ready { min-height: 100svh; }
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__stage {
  height: 100svh;
  min-height: 0;
  padding: 0;
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__canvas { display: block; }
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__fallback {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__heading {
  position: absolute;
  inset: 6.25rem auto auto 50%;
  width: calc(100% - 3rem);
  margin: 0;
  transform: translateX(-50%);
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__phase-copy {
  position: absolute;
  inset: 50% var(--site-gutter) auto auto;
  display: grid;
  width: clamp(12rem, 32vw, 21.25rem);
  min-height: 0;
  margin: 0;
  transform: translateY(-50%);
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__phase-copy article {
  display: grid;
  grid-area: 1 / 1;
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__phase-copy [data-ecosystem-copy="cards"] {
  opacity: 0 !important;
  visibility: hidden !important;
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__progress {
  position: absolute;
  inset: auto auto 2rem 50%;
  display: block;
  width: min(66.25rem, calc(100% - 3rem));
  margin: 0;
  transform: translateX(-50%);
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__progress ol {
  display: flex;
  flex-wrap: nowrap;
  gap: .25rem;
  overflow: visible;
}
body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__progress li { min-width: 0; margin-left: 0; }

@media (max-width: 991px) {
  body.has-story-motion .ai-story {
    height: 410vh;
    min-height: 0;
    padding: 0;
  }
  body.has-story-motion .ai-story__sticky {
    position: sticky;
    top: 0;
    height: 100svh;
    min-height: 100svh;
    padding: 6.25rem var(--site-gutter) 1.5rem;
  }
  body.has-story-motion .ai-story__header {
    position: absolute;
    top: 6.25rem;
    left: var(--site-gutter);
    width: calc(100% - var(--site-gutter) * 2);
    margin: 0;
  }
  body.has-story-motion .ai-story__header h2 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
  body.has-story-motion .ai-story__stage {
    display: grid;
    grid-template-columns: minmax(0, .32fr) minmax(0, 1fr);
    gap: 1.25rem;
    padding-top: 8rem;
    align-items: center;
  }
  body.has-story-motion .ai-story__steps {
    position: relative;
    display: block;
    width: 100%;
    height: 16rem;
  }
  body.has-story-motion .ai-story-step {
    position: absolute;
    inset: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  body.has-story-motion .ai-story-step h3 { font-size: clamp(1.125rem, 2.7vw, 1.75rem); }
  body.has-story-motion .ai-story-step p { font-size: .8125rem; }
  body.has-story-motion .ai-computer { min-width: 0; width: 100%; margin: 0; }
  body.has-story-motion :is(.ai-data-stream, .ai-computer__scan-beam) { display: block; }
}

@media (max-width: 600px) {
  body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__phase-copy {
    inset: 68% auto auto 50%;
    width: calc(100% - 3rem);
    transform: translate(-50%, -50%);
  }
  body .ai-ecosystem--3d.is-webgl-ready .ai-ecosystem__copy-face { padding: .875rem; }
  body.has-story-motion .ai-story__stage {
    grid-template-columns: minmax(0, 1fr);
    padding-top: 8rem;
    gap: 1rem;
  }
  body.has-story-motion .ai-story__steps { order: 2; height: 9rem; }
  body.has-story-motion .ai-story-step h3 { margin-block: .5rem; }
}

/* The autoplay story stays in document flow, so below desktop the heading,
   artwork and active step stack in one column instead of reserving room for
   the former pinned header. Steps share one grid cell: the box takes the tallest
   step's height while they still cross-fade. */
@media (max-width: 991px) {
  body.has-story-motion .ai-story.is-autoplay { min-height: 0; }
  body.has-story-motion .ai-story.is-autoplay .ai-story__sticky { height: auto; min-height: 0; padding-bottom: 3rem; }
  body.has-story-motion .ai-story.is-autoplay .ai-story__header { position: relative; top: auto; left: auto; width: auto; margin: 0 0 1.5rem; }
  body.has-story-motion .ai-story.is-autoplay .ai-story__stage { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding-top: 0; }
  body.has-story-motion .ai-story.is-autoplay .ai-story__steps { order: 2; display: grid; height: auto; }
  body.has-story-motion .ai-story.is-autoplay .ai-story-step { position: relative; inset: auto; grid-area: 1 / 1; }
}
