@media (min-width: 1920px) {
  .hero h1 { font-size: 86px; }
  .hero-art { width: 133%; }
  .hero-layout { max-height: 1100px; margin-block: auto; }
  .hero-stage { display: flex; align-items: center; }
}
@media (max-width: 1199px) {
  :root { --gutter: 40px; }
  .nav-links { gap: 17px; }.nav-links a { font-size: 10px; }
  .nav-shell { gap: 20px; }.nav-cta { gap: 8px; padding-inline: 12px; }
  .hero h1 { font-size: clamp(48px,5.2vw,64px); }
  .hero-actions { gap: 20px; flex-wrap: wrap; }
  .hero-art { width: 135%; margin-left: -8%; }
  .services-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .featured,.mobile-service { grid-column: auto; }
  .service-card:not(.featured):not(.mobile-service) { min-height: 285px; }
  .contact-channels > a { padding-inline: 15px; gap: 12px; }
  .contact-channels strong { font-size: 11px; }.contact-channels .channel-arrow { display: none; }
  .about-grid { gap: 6%; }.code-row { gap: 14px; font-size: 10px; }
  .footer-bottom { flex-wrap: wrap; }
}
@media (max-width: 1023px) {
  .nav-links, .nav-cta { display: none; }.menu-toggle { display: block; }
  .nav-shell { height: 78px; }
  .hero h1 { font-size: clamp(44px,5.5vw,56px); }
  .hero-description { font-size: 13px; }.hero-copy .eyebrow { font-size: 9px; }
  .hero-actions { gap: 10px; }.hero-actions .button { font-size: 11px; padding-inline: 16px; gap: 16px; }.hero-actions .text-link { font-size: 10px; }
  .hero-footnote { font-size: 9px; }
  .hero-art { width: 139%; }.art-coordinates { font-size: 6px; }.art-caption { font-size: 7px; }.art-caption i { margin-inline: 6px; }
  .hero-bottom-note { display: none; }
  .section-kicker > .mono { display: none; }
  .beliefs-grid { gap: 7%; }.beliefs-copy .lead { font-size: 19px; }.beliefs-copy p:not(.lead) { font-size: 13px; }
  .audience-grid { gap: 6%; }.outcomes h3 { font-size: 19px; }.outcomes p { font-size: 12px; }
  .heading-row { gap: 30px; }.heading-row > p { max-width: 230px; font-size: 13px; }
  .tech-options { gap: 7px; }.tech-node > span:not(.tech-letter):not(.mongo-mark) { font-size: 10px; }.tech-node small { font-size: 6px; }
  .tech-hint { display: none; }
  .about-grid { grid-template-columns: 1fr; gap: 50px; }.about-copy { max-width: 600px; }.about-copy h2 br:last-child { display: none; }.editor-wrap { max-width: 600px; width: 100%; margin-inline: auto; }.code-row { font-size: 12px; }
  .contact-channels > a { padding-inline: 12px; }.contact-channels > a > .icon { display: none; }
}
@media (max-width: 767px) {
  :root { --gutter: 24px; --space-section: 82px; }
  html { scroll-padding-top: 95px; }
  .nav-shell { height: 72px; }.brand { font-size: 16px; }.brand-mark { font-size: 32px; margin-right: 10px; }.brand-mark > span { top: 21px; left: 6px; width: 8px; }
  h2 { font-size: clamp(36px,8vw,52px); }
  .hero, .motion-enabled .hero { height: auto; min-height: 0; }
  .hero-stage { position: relative; height: auto; min-height: 0; padding-top: 105px; }
  .hero-layout { display: flex; flex-direction: column; height: auto; padding-top: 0; gap: 0; }
  .hero-copy { width: 100%; padding-bottom: 0; }
  .hero-copy .eyebrow { font-size: 9px; margin-bottom: 23px; }
  .hero h1 { font-size: clamp(38px,9.1vw,63px); line-height: 1.08; }
  .hero-description { font-size: 13px; margin-top: 24px; line-height: 1.7; }.desktop-break { display: none; }
  .hero-actions { gap: 16px; margin-top: 26px; }.hero-actions .button { font-size: 11px; min-height: 48px; padding: 14px 17px; gap: 14px; }.hero-actions .text-link { font-size: 10px; gap: 9px; }.hero-actions .text-link .icon { width: 16px; }
  .hero-footnote { margin-top: 20px; font-size: 9px; }
  .hero-art { margin: 4px -5% 0; width: 110%; max-width: 560px; aspect-ratio: 800 / 640; }
  .art-coordinates { display: none; }.art-caption { bottom: 4%; font-size: 7px; left: 17%; right: 17%; }.art-caption i { margin-inline: 12px; }
  .hero-bottom { position: relative; height: 72px; }.scroll-cue { font-size: 8px; gap: 10px; }.scroll-line { height: 25px; }.motion-label { font-size: 8px; }
  .hero-chapter { display: none; }
  .hero-grid { mask-image: linear-gradient(transparent,#0008); background-size: 60px 60px; }
  .section-kicker { margin-bottom: 36px; gap: 14px; }.eyebrow { font-size: 9px; margin-bottom: 23px; }
  .beliefs-grid { grid-template-columns: 1fr; gap: 32px; }.statement { font-size: clamp(38px,9vw,54px); }.beliefs-copy .section-symbol { display: none; }.beliefs-copy .lead { font-size: 20px; }.beliefs-copy p:not(.lead) { font-size: 13px; }
  .metrics { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 46px; padding-top: 30px; }.metrics strong { font-size: 34px; }.metrics > div > span { font-size: 9px; line-height: 1.7; }.metrics p { display: none; }
  .audience-grid { grid-template-columns: 1fr; gap: 44px; }.audience .section-heading h2 br:nth-child(2) { display: none; }.audience .section-heading > p { font-size: 13px; }.audience-note { margin-top: 24px; font-size: 9px; }
  .outcomes li { padding-block: 25px; gap: 19px; }.outcomes h3 { font-size: 20px; }.outcomes p { font-size: 12px; }.outcome-arrow { font-size: 19px; }
  .heading-row { display: block; margin-bottom: 32px; }.heading-row > p { max-width: 350px; margin-top: 22px; }
  .services-grid { grid-template-columns: 1fr; gap: 16px; }.service-card { padding: 25px; }.featured, .mobile-service { min-height: 485px; }.service-card:not(.featured):not(.mobile-service) { min-height: 268px; }.service-card h3 { font-size: 23px; }.service-card p { font-size: 13px; }.featured .card-copy, .mobile-service .card-copy { max-width: 95%; }.featured .card-copy h3, .mobile-service .card-copy h3 { font-size: 26px; }.card-tags { font-size: 7px; }.card-top { margin-bottom: 32px; }.card-top .mono { font-size: 8px; }
  .web-preview, .phone-preview { height: 225px; }.mock-content { padding: 14px; }.mock-numbers b { font-size: 21px; }.mock-chart { gap: 6px; }.mock-phone { left: 34%; }.phone-platform { left: -6px; }
  .technology .section-heading { text-align: left; }.technology .eyebrow { justify-content: flex-start; }.technology .section-heading > p { margin-inline: 0; font-size: 13px; }
  .ecosystem { margin-top: 32px; }.ecosystem-core { padding-bottom: 30px; }.ecosystem-trunk { height: 15px; }.core-mark { width: 58px; height: 58px; font-size: 39px; }
  .tech-options { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }.tech-options::before { display: none; }.tech-node { margin-top: 0; gap: 18px; padding: 19px 3px 16px; border-radius: 9px; }.tech-node::before { display: none; }.tech-node > span:not(.tech-letter):not(.mongo-mark) { font-size: 9px; }.tech-node small { font-size: 6px; margin-top: -12px; }.tech-logo,.tech-letter { width: 28px; height: 28px; }.tech-letter { line-height: 28px; }.ts-mark { font-size: 16px; line-height: 34px; }.mongo-mark { height: 28px; }.tech-detail { margin-top: 16px; min-height: 114px; align-items: flex-start; padding-top: 15px; }.tech-detail > .status-dot { margin-top: 8px; }.tech-detail p { font-size: 11px; }.tech-detail strong { font-size: 12px; }
  .about-grid { gap: 32px; }.about-copy .lead { font-size: 18px; }.about-copy h2 { margin-bottom: 26px; }.code-editor { transform: none; }.code-row { font-size: 9px; padding-inline: 12px; gap: 12px; min-height: 24px; line-height: 24px; }.line-number { font-size: 8px; width: 13px; }.code-content { padding-block: 20px; }.editor-tabs > .mono { display: none; }.editor-toolbar { height: 41px; }.editor-terminal { padding: 16px; }.editor-terminal p { font-size: 9px; }.engineering-values { font-size: 9px; padding: 0; gap: 13px; margin-top: 23px; }
  .contact { padding-bottom: 40px; }.contact-heading { text-align: left; }.contact-heading .eyebrow { justify-content: flex-start; }.contact-heading h2 { font-size: clamp(37px,8.5vw,54px); }.contact-heading h2 > br { display: none; }.contact-heading p { font-size: 13px; }.contact-heading .button { font-size: 12px; gap: 16px; }
  .contact-channels { grid-template-columns: 1fr; margin-top: 50px; }.contact-channels > a { padding: 26px 0; gap: 18px; }.contact-channels > a + a { border-left: 0; border-top: 1px solid var(--border); }.contact-channels > a > .icon { display: block; }.contact-channels .channel-arrow { display: block; }.contact-channels strong { font-size: 14px; }.contact-channels > a > span { gap: 8px; }
  .footer-top { flex-wrap: wrap; gap: 24px; padding-bottom: 24px; }.footer-top p { margin-left: auto; font-size: 9px; }.back-top { margin-left: 0; }.footer-bottom { flex-direction: column; align-items: flex-start; gap: 22px; font-size: 8px; }.footer-bottom nav { flex-wrap: wrap; gap: 14px; font-size: 10px; }.floating-contact { right: 16px; bottom: 16px; padding: 12px; }.floating-contact > span { display: none; }
}
@media (max-width: 389px) {
  .hero h1 { font-size: 35px; }.hero-actions { gap: 8px; }.hero-actions .button { font-size: 10px; padding-inline: 13px; gap: 12px; }.hero-actions .text-link { font-size: 9px; gap: 5px; }.tech-options { grid-template-columns: repeat(3,minmax(0,1fr)); }.tech-node:last-child { grid-column: 2; }.code-row { font-size: 8.5px; gap: 8px; }.code-content { padding-block: 16px; }.footer-top p { font-size: 8px; }.editor-terminal p { font-size: 8px; }
}
@media (min-width: 768px) and (max-height: 740px) {
  .hero-stage { min-height: 640px; }.hero { min-height: 640px; }.motion-enabled .hero { min-height: 1200px; }.hero-layout { padding-top: 100px; }.hero-copy .eyebrow { margin-bottom: 18px; }.hero-description { margin-top: 18px; }.hero-actions { margin-top: 22px; }.hero-footnote { margin-top: 18px; }.hero-bottom { height: 62px; }.hero-art { max-height: 530px; }.hero h1 { font-size: clamp(45px,4.7vw,67px); }
}
/* Preference changes apply immediately, including before the module loads. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal.is-pending { opacity: 1; transform: none; }
  .hero, .motion-enabled .hero { height: auto; min-height: 0; }
  .hero-stage { position: relative; }
  .hero-copy, .hero-art { transform: none !important; opacity: 1 !important; }
  .hero-chapter { display: none; }
  .code-editor { transform: none; }
}
.motion-paused { scroll-behavior: auto; }
.motion-paused *, .motion-paused *::before, .motion-paused *::after { animation-play-state: paused !important; transition: none !important; }
.motion-paused .reveal { opacity: 1; transform: none; }
/* Manual pause freezes the current composition without changing scroll geometry. */
@media (forced-colors: active) {
  .button-primary { background: ButtonFace; color: ButtonText; border: 1px solid ButtonText; }
  .tech-node[aria-pressed="true"] { outline: 2px solid Highlight; }
}