/* QA mobile width containment + shared mobile UX. Desktop is untouched. */
/* Deployment refresh: include r10 after QA head stylesheet update. */

/* Homepage hero: show one contextual CTA that follows the active visual. */
body[data-page="home"] .home-showcase .hero-actions .btn {
  display: none !important;
}
body[data-page="home"] .home-showcase .hero-actions a[href="/services"] {
  display: inline-flex !important;
}
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(3).active) .hero-actions a[href="/services"],
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(4).active) .hero-actions a[href="/services"],
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(5).active) .hero-actions a[href="/services"],
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(6).active) .hero-actions a[href="/services"] {
  display: none !important;
}
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(3).active) .hero-actions a[href="products.html"] {
  display: inline-flex !important;
}
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(4).active) .hero-actions a[href="ventures.html"],
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(5).active) .hero-actions a[href="ventures.html"],
body[data-page="home"] .home-showcase:has(figure.home-showcase-slide:nth-of-type(6).active) .hero-actions a[href="ventures.html"] {
  display: inline-flex !important;
}

@media (max-width: 640px) {
  body[data-page="home"] {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden !important;
  }

  body[data-page="home"] .wrap,
  body[data-page="home"] .section,
  body[data-page="home"] .product-carousel,
  body[data-page="home"] .product-carousel-viewport,
  body[data-page="home"] .product-carousel-slide,
  body[data-page="home"] .release-product-grid,
  body[data-page="home"] .release-product-copy,
  body[data-page="home"] .release-product-visual,
  body[data-page="home"] .product,
  body[data-page="home"] .product-main,
  body[data-page="home"] .product-copy,
  body[data-page="home"] .venture-grid,
  body[data-page="home"] .page-grid,
  body[data-page="home"] .aurel,
  body[data-page="home"] .planlead-feature,
  body[data-page="home"] .kitverio-pro-feature {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body[data-page="home"] .product-carousel-viewport,
  body[data-page="home"] .product,
  body[data-page="home"] .release-product-slide {
    overflow: hidden !important;
  }

  body[data-page="home"] .release-product-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body[data-page="home"] .release-product-copy,
  body[data-page="home"] .product-copy {
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body[data-page="home"] .release-product-copy {
    padding: 16px 12px !important;
  }

  body[data-page="home"] .release-product-copy h2,
  body[data-page="home"] .release-product-copy p,
  body[data-page="home"] .product-copy h2,
  body[data-page="home"] .product-copy p,
  body[data-page="home"] .product-desc,
  body[data-page="home"] .platform-difference,
  body[data-page="home"] .release-price {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere;
  }

  body[data-page="home"] .release-product-copy .buy,
  body[data-page="home"] .product-copy .buy,
  body[data-page="home"] .catalog-buy {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body[data-page="home"] .release-product-copy .buy .btn,
  body[data-page="home"] .product-copy .buy .btn,
  body[data-page="home"] .catalog-buy .btn {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 100% !important;
    box-sizing: border-box !important;
  }

  body[data-page="home"] .chips {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body[data-page="home"] .product-carousel-prev {
    left: 6px !important;
  }

  body[data-page="home"] .product-carousel-next {
    right: 6px !important;
  }

  /* Shared phone hero system: compact, readable and consistent across the site. */
  .page-hero.enhanced-hero {
    min-height: 445px !important;
    height: auto !important;
    padding: 34px 0 28px !important;
    align-items: center !important;
  }

  .page-hero.enhanced-hero .enhanced-hero-slide {
    inset: 0 !important;
  }

  .page-hero.enhanced-hero .enhanced-hero-orbit {
    display: none !important;
  }

  .page-hero.enhanced-hero .enhanced-hero-content {
    width: min(calc(100% - 24px), var(--max)) !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  .page-hero.enhanced-hero .eyebrow {
    margin: 0 0 10px !important;
    font-size: .62rem !important;
    letter-spacing: .15em !important;
  }

  .page-hero.enhanced-hero h1 {
    max-width: 12ch !important;
    font-size: clamp(2rem, 10.5vw, 2.7rem) !important;
    line-height: .98 !important;
    letter-spacing: -.042em !important;
  }

  .page-hero.enhanced-hero .lead {
    max-width: 100% !important;
    margin-top: 12px !important;
    font-size: .84rem !important;
    line-height: 1.42 !important;
  }

  .page-hero.enhanced-hero .enhanced-message-stage {
    min-height: 48px !important;
    margin-top: 13px !important;
    max-width: 100% !important;
  }

  .page-hero.enhanced-hero .enhanced-message {
    gap: 8px !important;
    max-width: 100% !important;
    font-size: .69rem !important;
    line-height: 1.3 !important;
  }

  .page-hero.enhanced-hero .enhanced-message:before {
    width: 22px !important;
    flex: 0 0 22px !important;
  }

  .page-hero.enhanced-hero .enhanced-hero-dots {
    display: none !important;
  }

  /* Home hero uses the same phone scale instead of a tall desktop stage. */
  body[data-page="home"] .home-showcase,
  body[data-page="home"] .home-showcase-inner {
    min-height: 515px !important;
  }

  body[data-page="home"] .home-showcase-inner {
    padding-top: 24px !important;
    padding-bottom: 22px !important;
  }

  body[data-page="home"] .home-showcase-copy {
    min-height: 300px !important;
    max-width: 100% !important;
  }

  body[data-page="home"] .home-showcase h1 {
    font-size: clamp(2.1rem, 10.5vw, 2.75rem) !important;
    line-height: .97 !important;
  }

  body[data-page="home"] .home-showcase .hero-lead {
    margin-top: 12px !important;
    font-size: .84rem !important;
    line-height: 1.42 !important;
  }

  body[data-page="home"] .home-showcase-statement {
    margin-top: 11px !important;
    font-size: .7rem !important;
  }

  body[data-page="home"] .home-showcase-controls {
    display: none !important;
  }

  /* Service detail hero: remove the old 680px phone minimum. */
  body[data-page="services"][data-service-slug] .r6-service-hero,
  body[data-page="services"][data-service-slug] .r6-service-hero .r2-detail-copy {
    min-height: 475px !important;
    height: auto !important;
  }

  body[data-page="services"][data-service-slug] .r6-service-hero .r2-detail-copy {
    justify-content: center !important;
    padding-top: 36px !important;
    padding-bottom: 30px !important;
  }

  body[data-page="services"][data-service-slug] .r2-detail-copy .eyebrow {
    font-size: .62rem !important;
    letter-spacing: .14em !important;
  }

  body[data-page="services"][data-service-slug] .r2-detail-copy h1 {
    max-width: 13ch !important;
    font-size: clamp(2rem, 9.6vw, 2.65rem) !important;
    line-height: .98 !important;
  }

  body[data-page="services"][data-service-slug] .r6-message-stage {
    min-height: 72px !important;
    margin-top: 10px !important;
  }

  body[data-page="services"][data-service-slug] .r6-hero-message {
    font-size: .82rem !important;
    line-height: 1.32 !important;
  }

  body[data-page="services"][data-service-slug] .r6-hero-dots {
    display: none !important;
  }

  body[data-page="services"][data-service-slug] .hero-actions {
    gap: 6px !important;
    margin-top: 10px !important;
  }

  body[data-page="services"][data-service-slug] .hero-actions .btn {
    min-height: 38px !important;
    padding: 8px 11px !important;
    font-size: .68rem !important;
  }

  /* Services + Digital Products filters become a single swipeable row, not a large panel. */
  body[data-page="services"] .repair-services-heading-row,
  body[data-page="products"] .product-filter-heading {
    display: block !important;
    margin-bottom: 8px !important;
  }

  body[data-page="services"] .repair-services-heading-row > p,
  body[data-page="products"] .product-filter-heading > p {
    display: none !important;
  }

  body[data-page="services"] .repair-services-heading-row .section-title,
  body[data-page="products"] .product-filter-heading h2 {
    margin-bottom: 0 !important;
    font-size: 1.35rem !important;
    line-height: 1.08 !important;
  }

  body[data-page="products"] .product-filter-shell {
    padding: 12px 0 2px !important;
  }

  body[data-page="services"] .repair-service-filter,
  body[data-page="products"] .product-filter {
    position: relative !important;
    top: auto !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 6px !important;
    padding: 2px 0 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  body[data-page="services"] .repair-service-filter::-webkit-scrollbar,
  body[data-page="products"] .product-filter::-webkit-scrollbar {
    display: none !important;
  }

  body[data-page="services"] .repair-service-filter button,
  body[data-page="products"] .product-filter button {
    flex: 0 0 auto !important;
    min-height: 36px !important;
    padding: 7px 11px !important;
    border: 1px solid rgba(255,255,255,.11) !important;
    border-radius: 999px !important;
    background: rgba(10,21,36,.92) !important;
    color: #b8c2d3 !important;
    font-size: .7rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    scroll-snap-align: start;
  }

  body[data-page="services"] .repair-service-filter button.active,
  body[data-page="products"] .product-filter button.active {
    border-color: transparent !important;
    background: linear-gradient(180deg, var(--gold2), var(--gold)) !important;
    color: #08101b !important;
    box-shadow: 0 7px 18px rgba(217,170,74,.16) !important;
  }

  body[data-page="services"] .repair-filter-status,
  body[data-page="products"] .product-filter-status {
    margin: 3px 1px 0 !important;
    font-size: .64rem !important;
  }
}

@media (max-width: 380px) {
  .page-hero.enhanced-hero {
    min-height: 420px !important;
  }

  .page-hero.enhanced-hero h1,
  body[data-page="home"] .home-showcase h1 {
    font-size: 2rem !important;
  }

  body[data-page="services"][data-service-slug] .r6-service-hero,
  body[data-page="services"][data-service-slug] .r6-service-hero .r2-detail-copy {
    min-height: 450px !important;
  }
}
