/* Staging-only mobile card density review, 2026-10-28.
 * Keep the approved calculator width, position and main summary-card size.
 * The three recommendation cards and three benefit cards are compact peers.
 * No calculation / configuration / submission JavaScript is changed.
 */
@media (max-width:600px) {
  /* Recommended internet speeds: all three visible without sideways scrolling. */
  body.experience-ui #internet-recommendations {
    min-width:0!important;
    max-width:100%!important;
    overflow-x:clip!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-cards {
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
    grid-auto-columns:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    gap:6px!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-card {
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:0!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    border-radius:13px!important;
    scroll-snap-align:none!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-art {
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    width:auto!important;
    min-height:0!important;
    height:76px!important;
    margin:6px 6px 0!important;
    padding:6px!important;
    gap:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-art .speed-signal-3d {
    display:none!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-art > span {
    position:static!important;
    top:auto!important;
    right:auto!important;
    left:auto!important;
    align-self:flex-start!important;
    transform:none!important;
    font-size:8px!important;
    line-height:1.2!important;
    letter-spacing:0!important;
    margin:0!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-art > b {
    position:static!important;
    top:auto!important;
    right:auto!important;
    left:auto!important;
    align-self:flex-start!important;
    transform:none!important;
    width:auto!important;
    max-width:100%!important;
    font-size:28px!important;
    line-height:1!important;
    margin:2px 0 0!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-art > i {
    position:static!important;
    top:auto!important;
    right:auto!important;
    left:auto!important;
    align-self:flex-start!important;
    transform:none!important;
    width:auto!important;
    font-size:9px!important;
    line-height:1!important;
    margin:0!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-art > small {
    display:none!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-copy {
    display:flex!important;
    flex-direction:column!important;
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    flex:1 1 auto!important;
    margin:0!important;
    padding:7px 6px 6px!important;
    gap:4px!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-copy > span {
    font-size:9px!important;
    line-height:1.15!important;
    margin:0!important;
    overflow-wrap:anywhere!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-copy h3 {
    font-size:11px!important;
    line-height:1.2!important;
    margin:0!important;
    word-break:keep-all!important;
    overflow-wrap:anywhere!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-copy p {
    display:none!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-copy button {
    width:100%!important;
    min-width:0!important;
    min-height:32px!important;
    height:32px!important;
    margin:auto 0 0!important;
    padding:4px 1px!important;
    font-size:9px!important;
    line-height:1.15!important;
    gap:0!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    border-radius:8px!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #internet-recommendations .internet-speed-copy button i {
    display:none!important;
  }

  /* Internet benefit / installation / gift: one compact row of three. */
  body.experience-ui #internet-benefits {
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    grid-auto-rows:auto!important;
    align-items:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    gap:7px!important;
    padding:6px 0!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #internet-benefits > .internet-check-heading {
    grid-column:1 / -1!important;
    grid-row:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0 0 8px!important;
  }
  body.experience-ui #internet-benefits > .internet-check-card {
    grid-column:auto!important;
    grid-row:auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    margin:0!important;
    padding:10px 7px!important;
    gap:5px!important;
    border-radius:13px!important;
    box-sizing:border-box!important;
    opacity:1!important;
    transform:none!important;
  }
  body.experience-ui #internet-benefits .internet-check-number {
    display:grid!important;
    place-items:center!important;
    width:25px!important;
    height:25px!important;
    min-width:25px!important;
    min-height:25px!important;
    margin:0 0 3px!important;
    padding:0!important;
    font-size:10px!important;
    line-height:1!important;
    border-radius:9px!important;
  }
  body.experience-ui #internet-benefits .internet-check-card h3 {
    width:100%!important;
    font-size:12px!important;
    line-height:1.25!important;
    margin:0!important;
    word-break:keep-all!important;
    overflow-wrap:anywhere!important;
  }
  body.experience-ui #internet-benefits .internet-check-card p {
    width:100%!important;
    font-size:10px!important;
    line-height:1.3!important;
    margin:0!important;
    word-break:keep-all!important;
    overflow-wrap:anywhere!important;
  }
  body.experience-ui #internet-benefits .internet-check-card a {
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:28px!important;
    margin:auto 0 0!important;
    padding:5px 0 0!important;
    gap:2px!important;
    font-size:9px!important;
    line-height:1.2!important;
    white-space:normal!important;
    word-break:keep-all!important;
    overflow-wrap:anywhere!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #internet-benefits .internet-check-card a i {
    flex:0 0 auto!important;
    font-size:12px!important;
  }

  /* Retire the unneeded detail drawer / consultation action / helper line.
     Retain the approved 288px outer estimate size and readable live totals. */
  body.experience-ui[data-page="internet"] [data-ui-name="C03"] > .internet-estimate-details,
  body.experience-ui[data-page="internet"] [data-ui-name="C03"] > #summaryAction,
  body.experience-ui[data-page="internet"] [data-ui-name="C03"] > #summaryStatus {
    display:none!important;
  }
  body.experience-ui[data-page="internet"] #internet-quote [data-ui-name="C03"].internet-summary.estimate-card {
    grid-template-areas:"overview facts"!important;
    grid-template-rows:260px!important;
    height:288px!important;
    min-height:288px!important;
    align-content:start!important;
  }
  body.experience-ui[data-page="internet"] #internet-quote [data-ui-name="C03"].internet-summary.estimate-card:has(#quickDiscountRow:not([hidden])) {
    grid-template-rows:minmax(260px,auto)!important;
    min-height:288px!important;
  }
  body.experience-ui[data-page="internet"] #internet-quote [data-ui-name="C03"] > .estimate-overview,
  body.experience-ui[data-page="internet"] #internet-quote [data-ui-name="C03"] > .internet-quick-facts {
    height:260px!important;
    min-height:260px!important;
    max-height:none!important;
  }

  /* FAQ: preserve the five-point contract checklist as a slim disclosure. */
  body.experience-ui #signup-notice.signup-notice-panel {
    width:100%!important;
    margin:12px 0!important;
    padding:0!important;
    border-radius:12px!important;
    overflow:hidden!important;
  }
  body.experience-ui #signup-notice > summary {
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-height:44px!important;
    height:auto!important;
    padding:10px 12px!important;
    gap:8px!important;
    box-sizing:border-box!important;
  }
  body.experience-ui #signup-notice > summary h2 {
    margin:0!important;
    padding:0!important;
    font-size:13px!important;
    line-height:1.25!important;
    word-break:keep-all!important;
  }
  body.experience-ui #signup-notice > summary span {
    margin:0!important;
    font-size:10px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
  }
}
