/* MowerFixAI V3.9.70 — mobile-first professional system */
@media (max-width: 820px){
  html{font-size:16px;-webkit-text-size-adjust:100%}
  body{overflow-x:hidden;background:#f6f8f8!important}
  body,button,input,select,textarea{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
  img,svg,video,canvas{max-width:100%;height:auto}

  /* Consistent compact mobile header */
  .app-header,.topbar,.site-header,.navbar,.nav-shell{
    min-height:64px!important;padding:8px 12px!important;gap:8px!important;
    position:sticky!important;top:0!important;z-index:1000!important;
    background:#082131!important;color:#fff!important;border-bottom:1px solid rgba(255,255,255,.10)!important;
    box-shadow:0 7px 22px rgba(3,18,28,.16)!important
  }
  .brand-button{gap:8px!important;min-width:0!important;color:#fff!important;font-size:17px!important}
  .brand-logo{width:38px!important;height:38px!important;flex:0 0 38px!important}
  .brand-button span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}
  .language-select{width:42px!important;max-width:42px!important;min-width:42px!important;height:42px!important;padding:6px!important;font-size:0!important;color:#fff!important;background:#103143!important;border:1px solid rgba(255,255,255,.16)!important}
  .language-select option{font-size:15px;color:#111;background:#fff}
  .mf-header-actions{margin-left:auto!important;gap:6px!important}
  .mf-top-home{display:none!important}
  .mf-top-signin{height:40px!important;min-height:40px!important;padding:0 11px!important;background:#f28c18!important;color:#071b27!important;border:0!important;border-radius:9px!important;font-size:11px!important;font-weight:900!important}
  .version-pill{display:none!important}

  /* Remove desktop-only floating clutter */
  .mf-home{display:none!important}
  .mf-home-subscribe-banner{margin:0!important;border-radius:0!important;border:0!important;padding:10px 14px!important;background:#fff3df!important;gap:9px!important}
  .mf-home-subscribe-banner div{font-size:12px!important;line-height:1.35!important}
  .mf-home-subscribe-banner a{min-height:42px!important;padding:10px 14px!important;border-radius:9px!important}

  /* Base page rhythm */
  main,.main,.page,.page-shell,.container,.app-main{width:100%!important;max-width:100%!important;margin:0!important;padding-left:14px!important;padding-right:14px!important}
  .app-main{padding-top:14px!important;padding-bottom:92px!important}
  body:has(.mfx-v4-home) .app-main,body:has(.mfx-pro-home) .app-main{padding:0!important}
  h1{font-size:clamp(2rem,10vw,3rem)!important;line-height:1.02!important;letter-spacing:-.045em!important}
  h2{font-size:clamp(1.55rem,7vw,2.15rem)!important;line-height:1.08!important}
  h3{font-size:1.15rem!important}
  p,li{font-size:15px;line-height:1.55}

  .card,.panel,.box,.tile,.guide-card,.result-card,.dealer-card,.diagram-card,.faq-item,.account-card,.repair-card,.content-card,.seo-content{
    border-radius:15px!important;box-shadow:0 8px 24px rgba(8,31,45,.08)!important;border:1px solid #dfe7ea!important
  }
  .card,.panel,.box,.guide-card,.result-card,.dealer-card,.diagram-card,.account-card,.repair-card{padding:16px!important}

  /* Forms and actions feel app-quality on touch */
  input,select,textarea{font-size:16px!important;min-height:48px!important;width:100%!important}
  button,.btn,.button,[class*="cta"]{min-height:46px;touch-action:manipulation}
  .actions,.search,.result-title,.part-row{gap:10px!important}
  .search{display:grid!important;grid-template-columns:1fr!important}
  .search .btn,.search button{width:100%!important}
  .actions>.btn,.actions>button,.actions>a.btn{flex:1 1 100%!important;width:100%!important}

  /* Data displays */
  table{display:block!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;border-radius:12px!important}
  th,td{min-width:120px;font-size:13px!important;padding:9px!important}
  .quick-grid,.stats{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .quick-card{min-height:108px!important;padding:14px!important}

  /* Unified V4 homepage on mobile */
  body:has(.mfx-v4-home){background:#fff!important;padding-bottom:72px!important}
  body:has(.mfx-v4-home) .app-header{background:#071f2e!important}
  .mfx-v4-hero{min-height:auto!important;background:#dbe6e7!important}
  .mfx-v4-bg{object-position:52% 48%!important;filter:brightness(1.08) saturate(1.02) contrast(.99)!important}
  .mfx-v4-overlay{background:linear-gradient(180deg,rgba(5,23,32,.22) 0%,rgba(5,24,33,.12) 25%,rgba(6,25,34,.55) 62%,rgba(4,21,30,.88) 100%)!important}
  .mfx-v4-wrap{display:block!important;padding:34px 16px 190px!important;min-height:690px!important}
  .mfx-v4-copy{max-width:none!important;background:rgba(255,255,255,.92)!important;color:#0c2632!important;border:1px solid rgba(255,255,255,.75)!important;border-radius:18px!important;padding:22px 18px!important;box-shadow:0 18px 44px rgba(5,24,33,.20)!important;backdrop-filter:blur(7px)!important}
  .mfx-v4-kicker{font-size:10px!important;letter-spacing:1.3px!important;margin-bottom:10px!important;color:#cf6400!important}
  .mfx-v4-copy h1{font-size:clamp(42px,13vw,58px)!important;line-height:.94!important;letter-spacing:-2.4px!important;color:#0b2430!important;margin-bottom:15px!important}
  .mfx-v4-copy h1 span{color:#f06f00!important}
  .mfx-v4-copy>p{font-size:15px!important;line-height:1.5!important;color:#485d66!important;margin-bottom:16px!important}
  .mfx-v4-searchbar{display:grid!important;grid-template-columns:42px 1fr!important;width:100%!important;margin-bottom:12px!important;border-radius:12px!important;overflow:hidden!important;box-shadow:0 10px 26px rgba(5,25,34,.12)!important}
  .mfx-v4-searchbar>span{padding-left:13px!important;font-size:21px!important}
  .mfx-v4-searchbar input{min-height:46px!important;padding:11px 8px!important;font-size:15px!important}
  .mfx-v4-searchbar button{grid-column:1/-1!important;min-height:46px!important;background:#f28c18!important;color:#0a1c25!important}
  .mfx-v4-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .mfx-v4-primary,.mfx-v4-secondary{width:100%!important;min-height:50px!important;border-radius:10px!important;font-size:14px!important}
  .mfx-v4-secondary{background:#0a2b38!important;border-color:#0a2b38!important;color:#fff!important}
  .mfx-v4-saved{color:#21404d!important;font-size:12px!important}
  .mfx-v4-proof{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px 10px!important;margin-top:15px!important;color:#3d5661!important;font-size:10px!important}
  .mfx-v4-proof span{white-space:normal!important}
  .mfx-v4-product{display:none!important}
  .mfx-v4-coverage{position:relative!important;left:auto!important;bottom:auto!important;transform:none!important;width:calc(100% - 28px)!important;margin:-118px 14px 0!important;grid-template-columns:1fr 1fr!important;border-radius:15px!important;overflow:hidden!important;background:rgba(5,29,40,.94)!important;box-shadow:0 15px 34px rgba(4,23,32,.22)!important}
  .mfx-v4-coverage div{padding:14px 13px!important}
  .mfx-v4-coverage b{font-size:20px!important}
  .mfx-v4-coverage span{font-size:10px!important}
  .mfx-v4-brands{padding:25px 14px 22px!important}
  .mfx-v4-brands>div{display:grid!important;grid-template-columns:1fr 1fr!important;gap:13px 8px!important;margin-top:15px!important}
  .mfx-v4-brands b{font-size:13px!important;text-align:center!important}
  .mfx-v4-services{padding:43px 14px 48px!important}
  .mfx-v4-heading{margin-bottom:24px!important}
  .mfx-v4-heading h2{font-size:34px!important}
  .mfx-v4-heading p{font-size:14px!important}
  .mfx-v4-grid{grid-template-columns:1fr!important;gap:10px!important}
  .mfx-v4-card{min-height:170px!important;border-radius:14px!important;padding:21px 18px!important;box-shadow:0 7px 22px rgba(8,31,45,.06)!important}
  .mfx-v4-card h3{font-size:19px!important}
  .mfx-v4-split{display:grid!important;grid-template-columns:1fr!important;padding:0 14px!important;margin-bottom:45px!important;gap:10px!important}
  .mfx-v4-darkpanel,.mfx-v4-lightpanel{padding:28px 20px!important;border-radius:15px!important}
  .mfx-v4-darkpanel h2,.mfx-v4-lightpanel h2{font-size:30px!important}
  .mfx-v4-models{padding:0 14px!important;margin-bottom:45px!important}
  .mfx-v4-modelchips{display:grid!important;grid-template-columns:1fr!important}
  .mfx-v4-modelchips button,.mfx-v4-modelchips a{border-radius:10px!important;text-align:left!important}
  .mfx-v4-final{display:block!important;padding:34px 18px!important}
  .mfx-v4-final h2{font-size:32px!important}
  .mfx-v4-final button{width:100%!important;margin-top:18px!important;border-radius:10px!important}

  /* Better mobile diagnosis flow */
  .hero{border-radius:18px!important;padding:22px 18px!important}
  .hero h1{font-size:38px!important}
  .option-grid{gap:9px!important}
  .option{min-height:52px!important;padding:14px!important;border-radius:12px!important}
  .confidence{width:58px!important;height:58px!important}
  .result-title{align-items:flex-start!important}
  .verified{padding:12px!important}

  /* Fixed bottom navigation: compact, safe-area aware */
  .bottom-nav{grid-template-columns:repeat(7,minmax(56px,1fr))!important;overflow-x:auto!important;overscroll-behavior-x:contain!important;padding:6px 7px calc(7px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.98)!important;box-shadow:0 -8px 26px rgba(8,31,45,.10)!important}
  .bottom-nav button{min-width:56px!important;padding:4px 2px!important}
  .bottom-nav span{font-size:18px!important}.bottom-nav small{font-size:9px!important}

  /* SEO/fault pages */
  article,.content-card,.seo-content{padding:16px!important;margin:12px 0!important}
  .breadcrumbs,.breadcrumb{font-size:12px!important;overflow-wrap:anywhere}
}

@media (max-width: 390px){
  .brand-button span{max-width:112px!important;font-size:15px!important}
  .mfx-v4-copy h1{font-size:42px!important}
  .mfx-v4-proof{grid-template-columns:1fr!important}
  .quick-grid,.stats{grid-template-columns:1fr!important}
}