@media (max-width: 768px) {
  :root {
    --max-width: min(calc(100% - 24px), 100%);
  }

  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    min-width: 0;
  }

  main,
  header,
  footer,
  section {
    max-width: 100%;
  }

  img,
  video,
  canvas,
  iframe,
  svg {
    max-width: min(100%, 100vw) !important;
  }

  video {
    object-fit: cover !important;
    object-position: center center !important;
  }

  .site-header .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 12px !important;
  }

  .header-bar {
    min-height: 56px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  .brand {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 76px) !important;
    min-height: 56px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: clamp(0.72rem, 3.2vw, 0.9rem) !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
  }

  .nav-toggle {
    position: relative !important;
    z-index: 70 !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    margin-left: auto !important;
    align-self: center !important;
    transform: none !important;
  }

  .site-nav {
    top: 56px !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100svh - 70px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.nav-open:not(.home-page) .site-header .site-nav {
    background: rgba(255, 255, 255, 0.98) !important;
    color: #151515 !important;
  }

  body.nav-open:not(.home-page) .site-header .site-nav .nav-link,
  body.nav-open:not(.home-page) .site-header .site-nav .nav-link:not(.is-active),
  body.nav-open:not(.home-page) .site-header .site-nav .nav-link__label,
  body.nav-open:not(.home-page) .site-header .site-nav .submenu-toggle {
    color: #151515 !important;
  }

  body.nav-open:not(.home-page) .site-header .site-nav .nav-link:hover,
  body.nav-open:not(.home-page) .site-header .site-nav .nav-link.is-active {
    color: var(--accent) !important;
    background: #faf7f6 !important;
  }

  body.nav-open:not(.home-page) .site-header .site-nav .mega-menu,
  body.nav-open:not(.home-page) .site-header .site-nav .mega-menu-inner {
    background: #ffffff !important;
    color: #151515 !important;
  }

  body.nav-open:not(.home-page) .site-header .site-nav .mega-menu-title,
  body.nav-open:not(.home-page) .site-header .site-nav .mega-item-content span {
    color: #64748b !important;
  }

  body.nav-open:not(.home-page) .site-header .site-nav .mega-item-content strong {
    color: #1e293b !important;
  }

  .nav-item,
  .nav-link {
    min-width: 0 !important;
  }

  .nav-link {
    white-space: normal !important;
    line-height: 1.3 !important;
  }

  .mega-menu {
    width: auto !important;
    max-width: calc(100vw - 48px) !important;
    margin: 0 6px 8px !important;
    overflow: hidden !important;
  }

  .mega-menu-inner,
  .solutions-mega,
  .mega-grid,
  .nav-item--about .mega-grid,
  .grid-3,
  .split-grid,
  .meta-grid,
  .footer-grid,
  .stats-row,
  .dashboard-shell,
  .home-footer__matrix,
  .software-suite {
    grid-template-columns: 1fr !important;
  }

  .mega-menu-inner {
    display: grid !important;
  }

  .mega-menu-divider {
    width: 100% !important;
    height: 1px !important;
  }

  .dashboard-shell > *,
  [class*="col-span-"] {
    grid-column: auto !important;
  }

  [class*="grid-cols-2"],
  [class*="grid-cols-3"],
  [class*="grid-cols-4"],
  [class*="grid-cols-5"],
  [class*="grid-cols-6"],
  [class*="grid-cols-7"],
  [class*="grid-cols-8"],
  [class*="grid-cols-9"],
  [class*="grid-cols-10"],
  [class*="grid-cols-11"],
  [class*="grid-cols-12"] {
    grid-template-columns: 1fr !important;
  }

  [class*="md:flex-row"],
  [class*="lg:flex-row"],
  [class*="xl:flex-row"] {
    flex-direction: column !important;
  }

  aside[class*="md:flex"] {
    display: none !important;
  }

  main[class*="md:pl-72"] {
    padding-left: 0 !important;
  }

  .container,
  [class*="max-w-screen"],
  [class*="max-w-7xl"],
  [class*="max-w-6xl"],
  [class*="max-w-5xl"],
  [class*="max-w-4xl"],
  [class*="max-w-3xl"],
  [class*="max-w-2xl"],
  [class*="max-w-xl"] {
    max-width: calc(100vw - 24px) !important;
  }

  [class*="px-8"],
  [class*="md:px-8"],
  [class*="md:px-12"],
  [class*="md:px-16"],
  [class*="md:px-24"],
  [class*="lg:px-8"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  [class*="py-32"],
  [class*="md:py-32"],
  [class*="lg:py-32"] {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  .home-hero--photo {
    min-height: 100svh !important;
    margin-top: -56px !important;
    padding: 112px 16px 56px !important;
    display: flex !important;
    align-items: center !important;
  }

  .home-hero--photo::before {
    background-size: cover !important;
    background-position: center center !important;
    transform: none !important;
  }

  .home-hero--photo .hero-center {
    width: 100% !important;
    max-width: 100% !important;
    padding-top: clamp(48px, 10svh, 96px) !important;
    padding-inline: 0 !important;
  }

  .home-hero--photo .hero-center h1 {
    font-size: clamp(2rem, 10vw, 3rem) !important;
    line-height: 1.15 !important;
    letter-spacing: 0.02em !important;
    overflow-wrap: anywhere !important;
  }

  .home-hero--photo .hero-center > p {
    max-width: 100% !important;
    margin-top: 16px !important;
    padding-inline: 8px !important;
    font-size: clamp(1rem, 4.8vw, 1.35rem) !important;
    line-height: 1.45 !important;
    letter-spacing: 0.04em !important;
  }

  .home-hero--photo .hero-actions {
    width: 100% !important;
    margin-top: 24px !important;
    padding: 0 8px !important;
  }

  .home-page .hero-target {
    width: 100% !important;
    padding: 14px 0 !important;
  }

  .home-page .hero-start-button {
    width: min(100%, 280px) !important;
    max-width: calc(100vw - 48px) !important;
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 0 18px !important;
    font-size: 0.86rem !important;
  }

  .home-page .hero-crosshair {
    width: 100vw !important;
    height: 100svh !important;
  }

  .hero-center h1,
  .page-copy h1,
  [class*="text-7xl"],
  [class*="text-6xl"],
  [class*="text-5xl"] {
    font-size: clamp(2rem, 9vw, 3.2rem) !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
  }

  .hero-center > p,
  .page-copy p,
  [class*="text-lg"] {
    font-size: clamp(0.95rem, 4vw, 1.08rem) !important;
    line-height: 1.7 !important;
  }

  .solutions-gallery__viewport {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow-x: auto !important;
  }

  .solutions-gallery__inner {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .solutions-gallery__track {
    gap: 16px !important;
    padding-inline: 0 12px !important;
  }

  .solution-showcase-card {
    width: calc(100vw - 32px) !important;
    min-width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
  }

  .solutions-gallery__controls {
    max-width: calc(100vw - 24px) !important;
  }

  .remote-hearing__video {
    object-fit: cover !important;
    object-position: center center !important;
    transform: none !important;
  }

  .remote-hearing__content,
  .remote-hearing__panel,
  .speech-orb,
  .hardware-showcase,
  .software-suite {
    max-width: 100vw !important;
  }

  .remote-hearing__content {
    width: calc(100vw - 32px) !important;
  }

  .card,
  .meta-card,
  .placeholder-card,
  .mega-card,
  .mega-item-card,
  .product-card,
  .solution-showcase-card,
  .hardware-product,
  .software-card-swap,
  .software-swap-card,
  [class*="product-card"],
  [class*="solution"][class*="card"] {
    max-width: calc(100vw - 24px) !important;
    min-width: 0 !important;
  }

  .product-card,
  .card,
  .meta-card,
  .placeholder-card,
  .mega-card,
  .mega-item-card {
    width: 100% !important;
  }

  .hardware-showcase {
    padding-left: 16px !important;
    padding-right: 16px !important;
    overflow: hidden !important;
  }

  .hardware-showcase__intro {
    width: 100% !important;
    max-width: 100% !important;
  }

  .hardware-showcase__intro h2,
  .hardware-showcase__intro p:not(.hardware-showcase__eyebrow) {
    white-space: normal !important;
  }

  .hardware-showcase__carousel {
    width: 100% !important;
    padding-left: 42px !important;
    padding-right: 42px !important;
  }

  .hardware-showcase__grid {
    min-height: 500px !important;
    max-width: 100% !important;
  }

  .hardware-product {
    width: min(82vw, 360px) !important;
    max-width: calc(100vw - 72px) !important;
  }

  .hardware-product__visual > img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .software-suite {
    grid-template-columns: 1fr !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    overflow: hidden !important;
  }

  .software-card-swap {
    width: 100% !important;
    max-width: calc(100vw - 32px) !important;
    height: 430px !important;
    min-height: 430px !important;
  }

  .software-swap-card {
    width: min(100%, calc(100vw - 32px)) !important;
    height: 410px !important;
    min-height: 410px !important;
    padding: 20px !important;
  }

  .home-footer__seal,
  .home-footer__seal h2,
  .home-footer__seal strong {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
}
