/* Shared mobile rhythm, loaded after the imported product styles. The locale
   attribute supplies enough specificity to override product/section variants. */
@media (max-width: 900px) {
  [data-static-product][data-showcase-locale] {
    --product-mobile-title: clamp(1.875rem, 7.7vw, 2.25rem);
    --product-mobile-heading: clamp(1.5rem, 6.2vw, 1.75rem);
    word-break: keep-all;
    overflow-wrap: anywhere;
  }

  [data-static-product][data-showcase-locale] :is(.container, .inner, .hero-inner) {
    width: 100%;
    max-width: none;
    padding-inline: 1.25rem;
  }

  [data-static-product][data-showcase-locale] > section {
    padding-block: 3.5rem;
  }

  [data-static-product][data-showcase-locale] > .hero {
    padding-block: 8rem 3.5rem;
  }

  /* ARI's imported hero includes an empty badge row above its heading. */
  [data-static-product="ari"] .hero-inner > div:first-child:has(+ h1) {
    display: none !important;
  }

  [data-static-product][data-showcase-locale] .hero h1 {
    max-width: 100%;
    margin-bottom: 1.25rem;
    color: var(--black, var(--g900));
    font-size: var(--product-mobile-title);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -.035em;
    text-wrap: balance;
  }

  /* Replace desktop line breaks with spaces, including in translated copy. */
  [data-static-product][data-showcase-locale] :is(h1, h2, .sec-title, .audit-title, .hero-sub) br {
    display: none;
  }

  [data-static-product][data-showcase-locale] :is(.hero-desc, .hero-desc2, .hero-sub, .hero-sub2) {
    max-width: 100%;
    margin-bottom: 0;
    font-size: 1rem;
    line-height: 1.7;
    letter-spacing: -.015em;
  }

  [data-static-product][data-showcase-locale] :is(.hero-desc2, .hero-sub2) {
    margin-top: .75rem;
  }

  [data-static-product][data-showcase-locale] :is(.hero-btns, .hero-actions) {
    width: 100%;
    margin-block: 1.75rem 0;
  }

  [data-static-product][data-showcase-locale] :is(.btn-primary, .btn-hero-primary, .btn-cta, .btn-cta-primary) {
    width: 100%;
    min-height: 3rem;
    padding: .875rem 1.25rem;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
  }

  [data-static-product][data-showcase-locale] :is(.sec-title, .audit-title, .product-overview h3, .cta-box h2, .final-cta h2) {
    margin-bottom: 1.5rem;
    font-size: var(--product-mobile-heading);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.025em;
    text-wrap: balance;
  }

  [data-static-product][data-showcase-locale] :is(.sec-title, .audit-title):has(+ :is(.sec-sub, .sec-desc, .audit-sub)) {
    margin-bottom: .875rem;
  }

  [data-static-product][data-showcase-locale] :is(.sec-sub, .sec-desc, .audit-sub, .block-lead, .product-overview p) {
    margin-bottom: 1.5rem;
    font-size: 1rem;
    line-height: 1.7;
  }

  [data-static-product][data-showcase-locale] :is(.pain-grid, .pain-cards, .ca-grid, .apply-grid, .why-grid, .notify-channels, .proof-boxes) {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }

  [data-static-product][data-showcase-locale] :is(.pain-card, .trust-card, .uc-card, .apply-card, .why-card, .audit-card, .acc-card, .compare-col, .resident-card, .scenario-demo, .arch-frame) {
    padding: 1.25rem;
  }

  [data-static-product][data-showcase-locale] :is(.pain-card, .trust-card, .uc-card, .apply-card, .why-card, .audit-card, .feat-card) h4 {
    font-size: 1.125rem;
    line-height: 1.5;
  }

  [data-static-product][data-showcase-locale] :is(.pain-card, .trust-card, .uc-card, .apply-card, .why-card, .audit-card, .feat-card, .ca-item) p {
    font-size: .9375rem;
    line-height: 1.7;
  }

  [data-static-product][data-showcase-locale] :is(.pain-card, .trust-card) .ph-sq {
    margin-bottom: 1.25rem;
  }

  [data-static-product][data-showcase-locale] :is(.pain-grid, .flow-steps, .deploy-steps, .compare-grid, .acc-grid, .scenario-demo, .faq-list) {
    margin-top: 1.5rem;
  }

  [data-static-product][data-showcase-locale] .sec-title + :is(.pain-grid, .flow-steps, .deploy-steps, .compare-grid, .acc-grid, .scenario-demo, .faq-list) {
    margin-top: 0;
  }

  [data-static-product][data-showcase-locale] .product-overview {
    margin-bottom: 1.5rem;
  }

  [data-static-product][data-showcase-locale] .sub-divider {
    margin-top: 2.5rem;
  }

  [data-static-product][data-showcase-locale] .cmp-wrap {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
  }

  [data-static-product][data-showcase-locale] .cmp-table {
    min-width: 40rem;
  }

  [data-static-product][data-showcase-locale] .cmp-table :is(th, td) {
    padding: .875rem 1rem;
    font-size: .875rem;
    line-height: 1.6;
  }

  [data-static-product][data-showcase-locale] .faq-q {
    padding-block: 1.125rem;
    gap: 1rem;
  }

  [data-static-product][data-showcase-locale] .faq-q h4 {
    font-size: 1rem;
    line-height: 1.6;
  }

  [data-static-product][data-showcase-locale] .faq-item .faq-a {
    font-size: .9375rem;
    line-height: 1.7;
  }

  [data-static-product][data-showcase-locale] :is(.container.cta-box, .container.final-cta-inner) {
    width: calc(100% - 2.5rem);
    min-height: 0;
    padding: 2rem 1.25rem;
    background-size: cover;
  }

  /* Product-specific layouts follow the same single-column reading order. */
  [data-static-product="ari"] .flow-steps {
    align-items: stretch;
  }

  [data-static-product="ari"] .flow-step {
    width: 100%;
    padding: 0;
  }

  [data-static-product="svce"] .feat-card {
    flex-direction: column;
    gap: 1rem;
    padding: 1.25rem;
  }

  [data-static-product="lens"] .hero-demo {
    height: auto;
    aspect-ratio: 1.6;
    background-size: contain;
  }

  [data-static-product="codingagent"] .market-img {
    /* The imported chart has a fixed inline height. Keep the whole chart visible. */
    height: auto !important;
    aspect-ratio: 1.6;
    background-size: contain !important;
  }

  [data-static-product="codingagent"] .audit-log {
    padding: 1rem;
    overflow-x: auto;
  }

  [data-static-product="monicare"] .stats-bar {
    padding-bottom: 0;
  }

  [data-static-product="monicare"][data-showcase-locale] .stats-inner {
    width: calc(100% - 2.5rem);
    padding: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-static-product="monicare"] .stat-item {
    padding: 1.25rem .875rem;
    border-right: none;
    border-bottom: 1px solid var(--g100);
  }

  [data-static-product="monicare"] .stat-item:nth-last-child(-n + 2) {
    border-bottom: none;
  }

  [data-static-product="monicare"] :is(.stat-num, .stat-num em, .stat-num span) {
    font-size: clamp(1.5rem, 6.9vw, 2rem);
    line-height: 1.2;
    letter-spacing: -.035em;
  }

  [data-static-product="monicare"] :is(.sd-header, .compare-col-header) {
    flex-wrap: wrap;
    gap: .75rem;
  }

  [data-static-product="monicare"] .tl-item {
    gap: .75rem;
  }

  [data-static-product="monicare"] :is(.tl-content, .audit-side, .profile-side) {
    min-width: 0;
  }

  [data-static-product="monicare"] :is(.at-header, .at-row) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 1.2fr);
    gap: .5rem;
    padding: .75rem;
  }

  [data-static-product="monicare"] .rc-row {
    align-items: flex-start;
    gap: .75rem;
  }
}