/* Customer2Pro Mobile App v2 — isolated mobile-only presentation layer */
@media (max-width:768px){
  :root{--c2p-app-bg:#f3f6fa;--c2p-app-surface:#fff;--c2p-app-navy:#063b78;--c2p-app-green:#00c56a;--c2p-app-line:rgba(6,59,120,.10);--c2p-app-shadow:0 14px 38px rgba(15,23,42,.13)}
  html{background:var(--c2p-app-bg);scroll-behavior:smooth}
  body{background:var(--c2p-app-bg)!important;overflow-x:hidden!important;padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))!important}
  body.c2p-app-no-scroll{overflow:auto!important}
  *{-webkit-tap-highlight-color:transparent}
  a,button{touch-action:manipulation}

  /* Original home navigation becomes the clean app header; navigation lives in the app tab bar. */
  header.navbar{
    position:sticky!important;inset:0 0 auto 0!important;transform:none!important;width:100%!important;height:64px!important;min-height:64px!important;
    padding:calc(8px + env(safe-area-inset-top,0px)) 16px 8px!important;margin:0!important;border:0!important;border-bottom:1px solid var(--c2p-app-line)!important;
    border-radius:0!important;background:rgba(255,255,255,.94)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
    box-shadow:0 4px 18px rgba(15,23,42,.06)!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:24000!important
  }
  header.navbar .brand{display:flex!important;min-width:0!important;margin:0!important;align-items:center!important;justify-content:center!important}
  header.navbar .brand img{width:auto!important;max-width:174px!important;max-height:42px!important;height:auto!important}
  header.navbar>.links{display:none!important}

  /* One real mobile page per main destination while retaining all original markup/scripts in every page copy. */
  body[data-c2p-mobile-page="home"] main>.section:not(#inicio),
  body[data-c2p-mobile-page="services"] main>.section:not(#servicios),
  body[data-c2p-mobile-page="about"] main>.section:not(#nosotros),
  body[data-c2p-mobile-page="contact"] main>.section:not(#contacto){display:none!important}
  body[data-c2p-mobile-page]:not([data-c2p-mobile-page="home"]) #c2pEstimatePopup{display:none!important}
  body[data-c2p-mobile-page]:not([data-c2p-mobile-page="home"]).c2p-estimate-locked{overflow:auto!important}

  /* App page canvases */
  body[data-c2p-mobile-page] main{display:block!important;width:100%!important;padding:0 12px!important}
  body[data-c2p-mobile-page] main>.section{
    width:100%!important;min-height:calc(100dvh - 156px)!important;margin:12px auto 0!important;padding:24px 16px 34px!important;
    border-radius:28px!important;overflow:hidden!important;box-shadow:var(--c2p-app-shadow)!important
  }
  body[data-c2p-mobile-page] .down{display:none!important}
  body[data-c2p-mobile-page] .section-inner{width:100%!important;max-width:100%!important;margin:0!important;padding:0!important}
  body[data-c2p-mobile-page] .section-head{margin:0 0 22px!important;text-align:left!important}
  body[data-c2p-mobile-page] .section-head h2{font-size:clamp(30px,9vw,42px)!important;line-height:1.04!important;letter-spacing:-.035em!important;margin-bottom:10px!important}
  body[data-c2p-mobile-page] .section-head p{font-size:15px!important;line-height:1.55!important;margin:0!important;max-width:none!important}
  body[data-c2p-mobile-page] .eyebrow{font-size:11px!important;letter-spacing:.12em!important;margin-bottom:12px!important}

  /* Home screen keeps the complete original slider, now framed like an app screen. */
  body[data-c2p-mobile-page="home"] main{padding:0 10px!important}
  body[data-c2p-mobile-page="home"] #inicio{padding:0!important;min-height:calc(100dvh - 156px)!important}
  body[data-c2p-mobile-page="home"] #inicio .hero-slider{height:calc(100dvh - 156px)!important;min-height:560px!important;border-radius:28px!important;overflow:hidden!important}
  body[data-c2p-mobile-page="home"] #inicio .hero-slide{padding:28px 18px 112px!important;align-items:center!important}
  body[data-c2p-mobile-page="home"] #inicio .hero-content{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;width:100%!important;max-width:100%!important;margin:0!important}
  body[data-c2p-mobile-page="home"] #inicio h1{font-size:clamp(38px,12vw,58px)!important;line-height:.98!important;margin:0 0 14px!important}
  body[data-c2p-mobile-page="home"] #inicio p{font-size:15px!important;line-height:1.55!important;margin-bottom:18px!important}
  body[data-c2p-mobile-page="home"] #inicio .hero-helper,
  body[data-c2p-mobile-page="home"] #inicio .hero-forklift{justify-content:center!important;margin:0 auto!important}
  body[data-c2p-mobile-page="home"] #inicio .hero-helper img,
  body[data-c2p-mobile-page="home"] #inicio .hero-forklift img{max-width:min(76vw,360px)!important;max-height:32dvh!important;object-fit:contain!important}
  body[data-c2p-mobile-page="home"] #inicio .actions{display:flex!important;flex-direction:column!important;gap:10px!important;width:100%!important}
  body[data-c2p-mobile-page="home"] #inicio .actions>.btn{width:100%!important;min-height:50px!important;border-radius:16px!important}
  body[data-c2p-mobile-page="home"] #inicio .hero-slider-controls{right:16px!important;bottom:18px!important}
  body[data-c2p-mobile-page="home"] #inicio .hero-dots{bottom:30px!important}

  /* Services */
  body[data-c2p-mobile-page="services"] #servicios{display:block!important;background-position:center!important}
  body[data-c2p-mobile-page="services"] #servicios .services-edge-image{position:relative!important;inset:auto!important;width:100%!important;max-width:420px!important;max-height:280px!important;object-fit:contain!important;margin:0 auto 18px!important;display:block!important}
  body[data-c2p-mobile-page="services"] #servicios .section-inner{margin:0!important;padding:0!important}
  body[data-c2p-mobile-page="services"] #servicios .grid{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}
  body[data-c2p-mobile-page="services"] #servicios .card{padding:20px!important;border-radius:22px!important;box-shadow:0 10px 30px rgba(15,23,42,.11)!important}
  body[data-c2p-mobile-page="services"] #servicios .service-action .btn{min-height:50px!important;border-radius:16px!important}

  /* About */
  body[data-c2p-mobile-page="about"] #nosotros .about-layout{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}
  body[data-c2p-mobile-page="about"] #nosotros .about-main,
  body[data-c2p-mobile-page="about"] #nosotros .about-side{padding:20px!important;border-radius:22px!important}
  body[data-c2p-mobile-page="about"] #nosotros .stats{grid-template-columns:1fr 1fr!important;gap:10px!important}
  body[data-c2p-mobile-page="about"] #nosotros .stat{padding:14px!important;border-radius:16px!important}

  /* Contact */
  body[data-c2p-mobile-page="contact"] #contacto{display:block!important;padding-bottom:24px!important}
  body[data-c2p-mobile-page="contact"] #contacto .contact-grid{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}
  body[data-c2p-mobile-page="contact"] #contacto .contact-info,
  body[data-c2p-mobile-page="contact"] #contacto .contact-form{padding:20px!important;border-radius:22px!important}
  body[data-c2p-mobile-page="contact"] #contacto .form-row{grid-template-columns:1fr!important;gap:0!important}
  body[data-c2p-mobile-page="contact"] #contacto input,
  body[data-c2p-mobile-page="contact"] #contacto select,
  body[data-c2p-mobile-page="contact"] #contacto textarea{min-height:50px!important;border-radius:15px!important;font-size:16px!important}
  body[data-c2p-mobile-page="contact"] #contacto .btn{min-height:50px!important;border-radius:16px!important}
  body[data-c2p-mobile-page="contact"] #contacto>.footer{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin:22px -16px -24px!important;width:auto!important;padding:20px 16px 24px!important;border-radius:0 0 28px 28px!important}

  /* Store and account keep all original features; only their mobile framing is unified. */
  .store-main{padding-bottom:108px!important}
  .store-product-card,.store-cart-panel,.store-category-wrap select,.store-search-wrap input{border-radius:18px!important}
  .auth-page,.profile-pane,.auth-stage{padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))!important}
  .auth-shell,.form-inner,.profile-card{border-radius:26px!important}

  /* New app bottom navigation */
  .c2p-app-tabbar{
    position:fixed!important;left:10px!important;right:10px!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;height:72px!important;
    display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;align-items:stretch!important;gap:2px!important;padding:7px!important;
    background:rgba(255,255,255,.96)!important;backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important;border:1px solid rgba(6,59,120,.10)!important;
    border-radius:24px!important;box-shadow:0 16px 38px rgba(15,23,42,.19)!important;z-index:30000!important
  }
  .c2p-app-tabbar a{
    min-width:0!important;height:58px!important;padding:6px 1px!important;border-radius:18px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
    gap:4px!important;color:#63758a!important;font-size:9.5px!important;line-height:1!important;font-weight:800!important;text-align:center!important;white-space:nowrap!important;text-decoration:none!important
  }
  .c2p-app-tabbar a svg{width:20px!important;height:20px!important;display:block!important;fill:currentColor!important}
  .c2p-app-tabbar a[aria-current="page"]{background:#eaf2fb!important;color:var(--c2p-app-navy)!important}
  .c2p-app-tabbar a:active{transform:scale(.96)}

  /* Keep chat and floating language controls clear of the app tabbar. */
  #c2pChatButton{bottom:calc(96px + env(safe-area-inset-bottom,0px))!important;z-index:29000!important}
  #c2pChatPanel{bottom:calc(94px + env(safe-area-inset-bottom,0px))!important;max-height:calc(100dvh - 118px)!important}
  .c2p-desktop-lang-global,.store-lang-right{top:calc(74px + env(safe-area-inset-top,0px))!important;right:12px!important;z-index:25000!important}

  /* Hide old mobile profile drop-down from the home header; Profile is now a real app destination. */
  header.navbar .c2p-profile-nav{display:none!important}
}
@media (max-width:390px){
  .c2p-app-tabbar{left:6px!important;right:6px!important;padding-left:4px!important;padding-right:4px!important;gap:1px!important}
  .c2p-app-tabbar a{font-size:8.8px!important}
  .c2p-app-tabbar a svg{width:19px!important;height:19px!important}
}


/* Requested adjustment: remove ONLY the upper navigation buttons on mobile.
   The bottom app tab bar remains unchanged. */
@media (max-width:768px){
  header.navbar > nav.links,
  header.navbar > .links,
  header.navbar #links{
    display:none !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }
}
