/* ==========================================================================
   Breakpoints. Base styles target >= 1200px; these rules step down.
   Checked at 320, 375, 390, 430, 768, 1024, 1280, 1440 and 1920.
   ========================================================================== */

@media (max-width: 1439px) {
  .hdr-join { display: none; }
}

@media (max-width: 1279px) {
  :root { --header-h: 64px; }
  .nav, .nav__signin { display: none; }
  .burger { display: grid; margin-left: 0; }
  .search-btn { margin-left: auto; }
  .site-header__cta { margin-left: 0; }
  .widgets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .how { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .how__step::after { display: none; }
  .ready { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
  .recs { grid-column: 1 / -1; }
  .recs__list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s-5); }
}
@media (min-width: 1280px) {
  .mnav { display: none; }
}

@media (max-width: 1100px) {
  .hero__top { grid-template-columns: minmax(0, 1fr); }
  .hero__side { padding-top: var(--s-3); }
}

@media (max-width: 1040px) {
  /* hero pipeline turns vertical */
  .stage__grid, .stage__foot { grid-template-columns: minmax(0, 1fr); }
  .stage__grid > .wire--h, .stage__foot > .wire--h, .ba__body > .wire--h, .arch > .wire--h { width: 2px; min-width: 0; height: 28px; justify-self: center; background: linear-gradient(180deg, var(--ai) 50%, transparent 50%) 0 0 / 2px 12px repeat-y; animation-name: march-y; }
  .stage__grid > .wire--h::after, .stage__foot > .wire--h::after, .ba__body > .wire--h::after, .arch > .wire--h::after { right: auto; left: 50%; top: auto; bottom: -1px; transform: translateX(-50%) rotate(135deg); }
  .clips__row { grid-template-columns: repeat(3, minmax(0, 108px)); }
  .float, .beams { display: none; }
  .engine { gap: var(--s-5); }
  .stage__grid > .wire--h::before, .stage__foot > .wire--h::before, .ba__body > .wire--h::before, .arch > .wire--h::before { left: -5px; top: 0; width: 12px; height: 100%; animation-name: wire-dot-y; }
  .chan { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
  .proc { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
  .engine, .arch, .assess { grid-template-columns: minmax(0, 1fr); }
  .arch > .wire--h { background-image: linear-gradient(180deg, var(--ai-on-ink) 50%, transparent 50%); }
  .arch__lane ul { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
  .assess__result { position: static; }
  .io-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shelf { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .passport, .kg, .demo, .ent { grid-template-columns: minmax(0, 1fr); }
  .passport__shot { position: static; max-width: 560px; }
}

@media (max-width: 960px) {
  .sec-head, .split, .split--wideviz, .split--creators, .story, .faq, .cta__in, .page-hero__in, .form-split, .ci, .live, .la, .ba__body { grid-template-columns: minmax(0, 1fr); }
  .split--rev .split__copy { order: 0; }
  .story__viz, .faq__intro, .form-split__copy { position: static; }
  .story.is-live .story__steps li:not(.is-active) { opacity: 1; }
  .live__video { width: min(100%, 330px); margin-inline: auto; }
  .cta__path { justify-content: flex-start; padding-right: 24px; }
  .plans { grid-template-columns: minmax(0, 1fr); }
  .how--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gov__panel { grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }
  .gov__steps { grid-template-columns: repeat(5, max-content); }
  .plan__for { min-height: 0; }
  .dash { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .dash__side { display: none; }
  .flow6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .flow6 li:nth-child(3)::after { display: none; }
  .pd { grid-template-columns: 140px repeat(2, minmax(0, 1fr)); }
  .mega__in { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 860px) {
  .eco__pulses { display: none; }
  .eco { aspect-ratio: auto; display: grid; gap: var(--s-4); }
  .eco__lines { display: none; }
  .eco__hub { position: static; transform: none; order: -1; justify-self: center; }
  .eco__nodes { position: static; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--s-3); }
  .eco__node { position: static; transform: none; min-width: 0; }
  .statuslegend { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer__top { grid-template-columns: minmax(0, 1fr); }
  .footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-6) var(--s-5); }
  .footer__base { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
  .stages3 { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .stagecard::after { display: none; }
  .how { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ready { grid-template-columns: minmax(0, 1fr); }
  .recs__list { grid-template-columns: minmax(0, 1fr); }
  .la__list--after { grid-template-columns: minmax(0, 1fr); }
  .live__side { grid-template-columns: minmax(0, 1fr); }
  .ba__assets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ent__grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
  .hero .net, .hero::after { height: 420px; }
  .ticker__track span { padding-inline: 16px; }
  .btn-row .btn { flex: 1 1 100%; }
  .site-header__cta { display: none; }
  .mnav__group ul { grid-template-columns: minmax(0, 1fr); }
  .stage__grid, .stage__foot { padding: var(--s-4); }
  .shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .io-list { grid-template-columns: minmax(0, 1fr); }
  .assess__row { grid-template-columns: minmax(0, 1fr) 40px; }
  .assess__row label { grid-column: 1 / -1; }
  .assess__row small { grid-column: 1 / -1; }
  .assess__form { padding-inline: var(--s-4); }
  .gov__panel { padding: var(--s-5); }
  .code pre { padding: var(--s-4); font-size: .75rem; }
  .engine__col:last-child .io-list { grid-template-columns: minmax(0, 1fr); }
  .pipeline { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pipeline li { font-size: .6875rem; }
  .caps { grid-template-columns: minmax(0, 1fr); }
  .benefits { grid-template-columns: minmax(0, 1fr); }
  .flow6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow6 li::after { display: none; }
  .capture__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .split__viz--phone { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .rec__grid, .an, .form__grid, .pp__foot { grid-template-columns: minmax(0, 1fr); }
  .pp__mrz { font-size: .5625rem; letter-spacing: .08em; }
  .widgets { grid-template-columns: minmax(0, 1fr); }
  .w--wide, .w--tall { grid-column: auto; }
  .pd { grid-template-columns: minmax(0, 1fr); }
  .pd__img { grid-row: auto; max-width: 180px; }
  .pd__info { grid-column: auto; }
  .lpanel--product { grid-template-columns: 96px minmax(0, 1fr); gap: var(--s-4); }
  .rec__head { grid-template-columns: 96px minmax(0, 1fr); gap: var(--s-4); }
  .rec__name, .pp__name { font-size: 1.375rem; }
  .newsletter__row { flex-direction: column; }
  .cta__path li::after { display: none; }
  .an__chart { overflow-x: auto; }
  .an__chart .chart { min-width: 440px; }
  .sv { grid-template-columns: minmax(0, 1fr); }
  .sv__product, .sv__customer { grid-column: auto; }

  /* passport: pins become chips under the image, the table becomes rows */
  .passport__shot { grid-template-columns: minmax(0, 1fr); gap: var(--s-3); }
  .pins { display: flex; flex-wrap: wrap; margin-left: 0; }
  .pins li { min-width: 0; flex: 1 1 130px; }
  .pins li::before, .pins li::after { display: none; }
  .pp__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pp__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .pp__table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--s-3); padding: 10px var(--s-4); border-bottom: 1px solid var(--line); }
  .pp__table th, .pp__table td { padding: 0; border: 0; }
  .pp__table tbody th { white-space: normal; }
  .pp__table td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .pp__table td:last-child { grid-column: 2; grid-row: 1; }
  .pp__table tr.is-ai { background: var(--ai-soft); }
}

@media (max-width: 420px) {
  .how, .how--four, .statuslegend, .footer__cols { grid-template-columns: minmax(0, 1fr); }
  .ba__assets { grid-template-columns: minmax(0, 1fr); }
  [data-ba="before"] .ba__chip { transform: translate(calc(var(--x) * .5), 0) rotate(calc(var(--r) * .6)); }
  .pcard { grid-template-columns: 84px minmax(0, 1fr); }
  .rbar { grid-template-columns: 104px minmax(0, 1fr) 26px; gap: var(--s-2); }
  .hbars li { grid-template-columns: 78px minmax(0, 1fr) 30px; }
  .audit__list li { grid-template-columns: 72px minmax(0, 1fr); }
  .audit__list time { display: none; }
  .eco__nodes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cta__path { gap: var(--s-4) var(--s-5); }
  .cta__path li::after { right: -16px; }
}

@media (min-width: 1920px) {
  :root { --w: 1280px; --w-wide: 1480px; }
}
