/**
 * Mobile layout — grids, hardware, device, platform bands.
 * Tokens & global components: responsive-system.css + mobile-design-system.css
 * Desktop (≥1025px) is untouched.
 */

/* ── Phone: overflow + layout-specific grids (extends mobile-design-system catch-all) ── */
@media (max-width: 768px) {
  html,
  body {
    overflow-x: clip;
    max-width: 100%;
  }

  main,
  .section,
  .section-inner,
  .page-hero,
  header,
  footer {
    max-width: 100%;
    min-width: 0;
  }

  img,
  video,
  svg,
  iframe {
    max-width: 100%;
    height: auto;
  }
}

/* ── Tablet: 2-column grids ── */
@media (max-width: 1024px) and (min-width: 769px) {
  :is(
    .suite-grid,
    .eco-cat-grid,
    .eco-platform-grid,
    .eco-integ-grid,
    .eco-industry-grid,
    .eco-hw-products,
    .integ-value-grid,
    .consumables-grid,
    .cmp-industries-grid,
    .cmp-values-grid,
    .home-why-rail,
    .home-trust-rail,
    .home-chal-list,
    .solx-benefits-grid,
    .solx-outcomes-grid,
    .prod-hw-categories,
    .dash-preview-capability-grid,
    .builder-software-grid,
    .device-related
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: var(--space-card-gap) !important;
  }

  .products-page--ecosystem .prod-hw-categories,
  .products-page--ecosystem .eco-integ-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ── Phone: 1 column — full-width stacked cards ── */
@media (max-width: 768px) {
  :is(
    .suite-grid,
    .eco-cat-grid,
    .eco-platform-grid,
    .eco-integ-grid,
    .eco-industry-grid,
    .eco-hw-products,
    .integ-value-grid,
    .consumables-grid,
    .consumables-band,
    .cmp-impact-rail,
    .cmp-industries-grid,
    .cmp-values-grid,
    .cmp-awards-track,
    .cmp-eco-grid,
    .home-why-rail,
    .home-trust-rail,
    .home-chal-list,
    .home-timeline-stages,
    .trust-grid,
    .footer-proof-grid,
    .footer-links-grid,
    .solx-benefits-grid,
    .solx-outcomes-grid,
    .solx-proof-grid,
    .builder-layout,
    .demo-product-grid,
    .prod-cap-grid,
    .prod-hw-grid,
    .prod-value-panel,
    .prod-rfid-features,
    .prod-erp-grid
  ) {
    grid-template-columns: 1fr !important;
    gap: var(--space-card-gap) !important;
    width: 100%;
    max-width: none;
  }

  .products-page--ecosystem :is(
    .suite-grid,
    .eco-cat-grid,
    .eco-platform-grid,
    .eco-integ-grid,
    .eco-industry-grid,
    .eco-hw-products,
    .prod-hw-categories,
    .integ-value-grid
  ) {
    grid-template-columns: 1fr !important;
  }

  /* Full-width vertical cards */
  :is(
    .suite-card,
    .prod-hw-category-card,
    .eco-cat-card,
    .eco-integ-card,
    .eco-industry-card,
    .eco-hw-product,
    .prod-rfid-hw-card,
    .prod-rfid-feature,
    .prod-erp-item,
    .cmp-impact-item,
    .home-why-card,
    .trust-logo-card
  ) {
    width: 100%;
    max-width: none;
    min-width: 0;
    box-sizing: border-box;
  }

  :is(
    .suite-card-body,
    .prod-hw-category-body,
    .eco-cat-card,
    .eco-integ-card,
    .builder-panel
  ) {
    padding: var(--space-card-pad);
  }

  /* Card titles — layout-specific selectors */
  :is(
    .suite-card-head h3,
    .prod-hw-category-body strong,
    .eco-cat-card strong,
    .eco-integ-card strong,
    .eco-industry-card strong,
    .eco-hw-product strong,
    .cmp-impact-item h3
  ) {
    font-weight: 700;
    line-height: 1.3;
  }

  /* Platform cinema */
  .home-page .home-plat-cinema {
    min-height: 0;
  }

  .home-page .home-plat-cinema-copy {
    width: calc(100% - 2 * var(--page-gutter));
    max-width: none;
    margin-inline: var(--page-gutter);
  }

  /* Prevent horizontal overflow from wide children */
  .section,
  .section-inner,
  .suite-grid,
  .prod-hw-categories,
  .eco-cat-grid,
  .eco-integ-grid {
    overflow-x: clip;
  }

  .brand,
  .brand.brand--wordmark,
  .demo-button,
  .mobile-toggle {
    min-width: unset;
  }

  /* Adaptive utility — never multi-column on phone */
  .u-grid-auto {
    grid-template-columns: 1fr !important;
    gap: var(--space-card-gap) !important;
  }

  /* Comparison / builder / device grids */
  :is(
    .dash-preview-capability-grid,
    .builder-software-grid,
    .device-details-grid,
    .device-related,
    .device-meta
  ) {
    grid-template-columns: 1fr !important;
    gap: var(--space-card-gap) !important;
    width: 100%;
    max-width: none;
  }

  /* Products platform bands — full width within gutter */
  .products-page .platform-band-grid,
  .products-page .platform-band-grid--reverse {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding-inline: var(--page-gutter);
    box-sizing: border-box;
  }

  .products-page .platform-band-content h3 {
    font-size: var(--text-section);
  }

  /* Device detail — stacked layout, larger centered media */
  .device-layout {
    grid-template-columns: 1fr !important;
    gap: var(--space-card-gap);
  }

  .device-hero {
    padding-top: max(88px, calc(72px + env(safe-area-inset-top, 0px)));
  }

  .device-media {
    min-height: 0;
    height: auto;
    padding: var(--space-card-pad);
    border-radius: 20px;
  }

  .device-gallery-main img,
  .device-media img {
    width: auto;
    max-width: min(100%, 420px);
    max-height: min(52vw, 360px);
    margin-inline: auto;
    object-fit: contain;
  }

  .device-gallery-thumbs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }

  .device-copy h1 {
    font-size: var(--text-hero);
    line-height: 1.12;
  }

  .device-tagline {
    font-size: var(--text-card-title);
  }

  .device-summary {
    font-size: var(--text-body);
    max-width: none;
  }

  .device-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .device-actions :is(.primary-action, .secondary-action) {
    width: 100%;
    min-height: 44px;
    justify-content: center;
  }

  .device-details-grid article {
    padding: var(--space-card-pad);
  }

  .device-related-card {
    width: 100%;
  }

  .device-related-card img {
    height: auto;
    min-height: 120px;
    max-height: 200px;
    object-fit: contain;
  }

  /* Hardware catalog — device cards & line sections */
  .hardware-page .hw-line-header {
    grid-template-columns: 1fr !important;
    gap: var(--space-card-gap);
    padding-inline: 0;
  }

  .hardware-page .hw-line-visual {
    min-height: 0;
    height: auto;
    padding: var(--space-card-pad);
  }

  .hardware-page .hw-line-visual img {
    width: auto;
    max-width: min(100%, 220px);
    margin-inline: auto;
    object-fit: contain;
  }

  .hardware-page .hw-line-copy h2 {
    font-size: var(--text-section);
  }

  .hardware-page .hw-device-grid,
  .hardware-page .hw-line-offerings {
    grid-template-columns: 1fr !important;
    gap: var(--space-card-gap) !important;
  }

  .hardware-page .hw-device-card {
    width: 100%;
    max-width: none;
    min-width: 0;
    height: auto;
    transform: none;
  }

  .hardware-page .hw-card-media {
    aspect-ratio: auto;
    min-height: 160px;
    padding: 24px;
  }

  .hardware-page .hw-card-media img {
    width: auto;
    max-width: min(100%, 200px);
    max-height: 160px;
    margin-inline: auto;
    object-fit: contain;
  }

  .hardware-page .hw-card-body h3 {
    font-size: var(--text-card-title);
  }

  .hardware-page .hw-card-tagline {
    font-size: var(--text-body);
  }

  .hardware-page .hw-offering-card {
    padding: var(--space-card-pad);
  }

  .hardware-page .hw-cta-band {
    flex-direction: column;
    align-items: stretch;
    padding: var(--space-card-pad);
  }

  .hardware-page .hw-cta-actions {
    flex-direction: column;
    width: 100%;
  }

  .hardware-page .hw-cta-actions :is(.primary-action, .secondary-action, .suite-learn) {
    width: 100%;
    min-height: 44px;
    justify-content: center;
  }

  .hardware-page .hw-jump-nav a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* Overflow audit — common fixed-width culprits */
  :is(
    table,
    pre,
    code,
    .mega-menu,
    .solx-nav-track,
    .home-partner-marquee-viewport
  ) {
    max-width: 100%;
  }
}

/* Tablet container rhythm */
@media (max-width: 1024px) and (min-width: 769px) {
  .section-inner,
  .header-inner,
  .footer-inner {
    padding-inline: var(--page-gutter);
  }

  :is(
    .dash-preview-capability-grid,
    .builder-software-grid,
    .device-details-grid
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: var(--space-card-gap) !important;
  }
}

/* Touch: disable hover lifts — see mobile-design-system.css */

/* ══════════════════════════════════════════════════════════════
   PAGE-SCOPED MOBILE FIXES — overflow, stacking, densify
   ══════════════════════════════════════════════════════════════ */

/* Tablet (≤1024px): stack remaining split layouts */
@media (max-width: 1024px) {
  :is(
    .platform-layout,
    .platform-band-grid,
    .platform-band-grid--reverse,
    .cmp-who-layout,
    .operations-showcase,
    .operations-layer,
    .prod-value-panel,
    .demo-layout,
    .demo-booking-layout
  ) {
    grid-template-columns: 1fr !important;
    display: grid;
    gap: var(--space-card-gap, 1rem);
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .hero-card-panel {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .platform-workflow {
    flex-wrap: wrap;
    gap: 8px;
    max-width: 100%;
  }
}

/* Phone (≤768px): page overflow + legal/contact/comparison */
@media (max-width: 768px) {
  .hero-card-panel {
    min-width: 0 !important;
    width: 100% !important;
  }

  /* Contact / demo */
  .demo-page .demo-booking-stage {
    padding-inline: var(--page-gutter) !important;
    padding-bottom: var(--space-section-sm) !important;
  }

  .demo-page .demo-form-card {
    width: 100%;
    max-width: none;
    padding: var(--space-card-pad) !important;
  }

  .demo-page .demo-personalize,
  .demo-page .demo-booking-inner {
    width: 100%;
    max-width: none;
  }

  /* Privacy / legal */
  .legal-hero > .section-inner,
  .page-hero.legal-hero > .section-inner {
    padding-top: calc(max(56px, calc(48px + env(safe-area-inset-top, 0px))) + 8px) !important;
  }

  .legal-body,
  .legal-content,
  .legal-hero + .section .section-inner {
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: normal;
  }

  /* Device */
  .device-page .device-hero-inner {
    padding-top: max(72px, calc(56px + env(safe-area-inset-top, 0px))) !important;
    padding-bottom: var(--space-section-sm) !important;
  }

  .device-gallery-thumbs {
    grid-template-columns: repeat(auto-fit, minmax(64px, 1fr)) !important;
  }

  /* Solutions sticky nav */
  .solx-page .solx-nav-track {
    padding-inline: 4px;
  }

  /* Catalogue modal */
  .catalogue-modal,
  .catalogue-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Footer densify */
  .site-footer .footer-shell.section-inner {
    padding-inline: var(--page-gutter) !important;
  }

  .footer-legal-row {
    flex-wrap: wrap;
    gap: 8px;
  }
}

/* Small phone (≤640px) */
@media (max-width: 640px) {
  .hardware-page .hw-card-media {
    min-height: 140px;
    padding: 16px;
  }

  .hardware-page .hw-card-media img {
    max-height: 130px;
  }

  .device-gallery-main img,
  .device-media img {
    max-height: min(48vw, 280px);
  }

  .demo-page .demo-form-card {
    padding: 1rem !important;
    border-radius: 16px;
  }

  .demo-page .demo-product-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  .company-page .cmp-impact-item {
    padding-inline: 0;
  }

  .company-page .cmp-impact-item + .cmp-impact-item {
    border-left: 0;
    border-top: 1px solid rgba(16, 24, 32, 0.1);
    padding-top: 12px;
  }
}