/*
 * Healthy Impact mobile public experience — 2026-10-11.
 * One final, mobile-only typography and layout contract shared by animated
 * chapters and public detail/white pages. NOT loaded in private workspaces.
 * Desktop styles and cinematic video/scroll timing remain unchanged.
 */
@media(max-width:760px){
  html,body{overflow-x:clip!important}
  /* Navigation stays usable without scaling the wordmark or squeezing it. */
  html body #nav.hi-unified-ribbon{
    /* Match the logo image's white matte: one uninterrupted ribbon. */
    background:#fff!important;
    background-image:none!important;
    border-color:rgba(16,44,66,.1)!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    padding-inline:clamp(14px,4vw,20px)!important;
    gap:12px!important;
  }
  html body #nav.hi-unified-ribbon .nav-logo,
  html body #nav.hi-unified-ribbon .nav-logo-shell{
    min-width:0!important;
    max-width:min(145px,43vw)!important;
    background:#fff!important;
    background-image:none!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    filter:none!important;
  }
  html body #nav.hi-unified-ribbon .nav-logo-shell::before{
    display:none!important;
    content:none!important;
  }
  html body #nav.hi-unified-ribbon .nav-logo img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-height:46px!important;
    object-fit:contain!important;
    object-position:left center!important;
    mix-blend-mode:multiply!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    filter:none!important;
  }

  /* Cookie consent: previous centered-modal top:50% clashes with bottom:12px,
     creating a giant, partly clipped panel on phones. Keep it wholly on-screen. */
  body .analytics-consent{
    position:fixed!important;
    top:auto!important;bottom:12px!important;
    left:12px!important;right:12px!important;
    width:auto!important;max-width:none!important;
    height:auto!important;max-height:min(65dvh,440px)!important;
    transform:none!important;
    margin:0!important;
    box-sizing:border-box!important;
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
    padding:15px!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    border-radius:9px!important;
    box-shadow:0 15px 40px rgba(5,18,31,.38)!important;
  }
  body .analytics-consent strong{
    font:600 14px/1.3 Arial,Helvetica,sans-serif!important;
    letter-spacing:0!important;
    margin:0 0 4px!important;
  }
  body .analytics-consent p{
    font-size:12px!important;
    line-height:1.48!important;
    overflow-wrap:break-word!important;
  }
  body .analytics-consent-actions{
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
  }
  body .analytics-consent-actions .btn{
    min-width:0!important;
    width:100%!important;
    min-height:44px!important;
    padding:8px!important;
    font-size:11px!important;
    line-height:1.3!important;
    white-space:normal!important;
  }

  /* Full-screen Explore/Information menu: readable and calm, never giant. */
  :is(#app #mobile,body #mobile) .mobile-panel{
    height:100dvh!important;max-height:100dvh!important;
    overflow:hidden!important;
  }
  :is(#app #mobile,body #mobile) .close-wrap{
    padding:calc(12px + env(safe-area-inset-top)) 18px 4px!important;
  }
  :is(#app #mobile,body #mobile) .mobile-links.menu-layout{
    display:block!important;box-sizing:border-box!important;
    min-width:0!important;max-width:100%!important;
    padding:4px 22px 12px!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
  :is(#app #mobile,body #mobile) .menu-group+.menu-group{
    margin-top:16px!important;
  }
  :is(#app #mobile,body #mobile) .menu-section-label{
    margin:10px 0 6px!important;
    padding-bottom:7px!important;
    font:700 9px/1.3 Arial,Helvetica,sans-serif!important;
    letter-spacing:.14em!important;
  }
  :is(#app #mobile,body #mobile) .menu-primary-grid{
    width:100%!important;max-width:100%!important;
    min-width:0!important;
  }
  :is(#app #mobile,body #mobile) .menu-primary-grid > :is(a,button){
    box-sizing:border-box!important;min-width:0!important;
    width:100%!important;min-height:0!important;
    padding:9px 0!important;
    font:400 clamp(17px,4.8vw,21px)/1.18 Arial,Helvetica,sans-serif!important;
    letter-spacing:.012em!important;
    overflow-wrap:break-word!important;word-break:normal!important;
    white-space:normal!important;
  }
  :is(#app #mobile,body #mobile) .menu-primary-grid > :is(a,button).active{
    padding-left:12px!important;
  }
  :is(#app #mobile,body #mobile) .menu-legal-links > :is(a,button){
    min-height:0!important;padding:8px 0!important;
    font:600 10.5px/1.3 Arial,Helvetica,sans-serif!important;
    letter-spacing:.045em!important;
  }
  :is(#app #mobile,body #mobile) .mobile-footer.menu-actions{
    position:static!important;inset:auto!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;max-width:100%!important;
    min-width:0!important;min-height:0!important;
    box-sizing:border-box!important;
    flex:0 0 auto!important;
    gap:8px!important;align-items:stretch!important;
    margin:0!important;
    padding:10px 22px calc(12px + env(safe-area-inset-bottom))!important;
    border-top:1px solid rgba(255,255,255,.18)!important;
  }
  :is(#app #mobile,body #mobile) .menu-actions-label{
    position:static!important;
    grid-column:1/-1!important;align-self:start!important;
    margin:0!important;padding:0!important;
    font:700 9px/1.25 Arial,Helvetica,sans-serif!important;
    letter-spacing:.14em!important;
  }
  :is(#app #mobile,body #mobile) .menu-actions :is(a,button){
    display:flex!important;align-items:center!important;justify-content:center!important;
    align-self:stretch!important;
    box-sizing:border-box!important;
    width:100%!important;min-width:0!important;
    height:42px!important;min-height:42px!important;max-height:42px!important;
    margin:0!important;padding:0 7px!important;
    font:700 10px/1.2 Arial,Helvetica,sans-serif!important;
    letter-spacing:.045em!important;
    white-space:normal!important;text-align:center!important;
  }

  /* Public white/detail pages — moderate headlines and tidy content cards. */
  .detail-page .v40-page-hero h1{
    font-size:clamp(27px,7.5vw,34px)!important;
    line-height:1.1!important;
    letter-spacing:-.02em!important;
    overflow-wrap:break-word!important;
    text-wrap:balance!important;
  }
  .detail-page .v40-page-hero p,
  .detail-page .detail-section p,
  .detail-page .detail-step p,
  .detail-page .detail-section li,
  .detail-page .detail-numbered p{
    font-size:14px!important;line-height:1.56!important;
    overflow-wrap:break-word!important;
  }
  .detail-page .detail-section h2,
  .detail-page .detail-step h2{
    font-size:clamp(20px,5.6vw,24px)!important;
    line-height:1.22!important;
    overflow-wrap:break-word!important;
  }
  .detail-page .v40-page-hero{
    padding-block:28px!important;
  }
  .detail-page .v40-section{
    padding-block:30px 38px!important;
  }
  .detail-page .detail-hero,
  .detail-page .detail-story,
  .legal-copy.container.narrow{
    width:calc(100% - 36px)!important;
    min-width:0!important;max-width:100%!important;
  }
  .page-hero h1{
    font-size:clamp(28px,7.5vw,35px)!important;
    line-height:1.1!important;
    overflow-wrap:break-word!important;
  }
  .public-overlay-title,.public-login-panel h1{
    font-size:clamp(28px,7.5vw,34px)!important;
    line-height:1.1!important;
  }
  .public-overlay input:not([type="checkbox"]),
  .public-overlay select,.public-overlay textarea{
    font-size:16px!important; /* prevent iOS focus zoom */
  }

  /* Existing desktop Home shading fades away before the aircraft. On phones,
     the text occupies more of the viewport, so extend that subtle contrast
     overlay to keep the white headline readable over bright clouds/jet. */
  .track #home::before{
    background:linear-gradient(90deg,
      rgba(6,27,47,.72) 0%,
      rgba(6,27,47,.58) 55%,
      rgba(6,27,47,.44) 100%)!important;
  }

  /* Cinematic chapters — avoid overlarge headings and cramped card grids. */
  .track .section.pad{
    padding-top:84px!important;
    padding-bottom:12px!important;
    padding-inline:18px!important;
  }
  .track #home .section-inner,
  .track #about .section-inner,
  .track #services .section-inner,
  .track #market .section-inner,
  .track #strategic .section-inner,
  .track #industries .section-inner{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-inline:0!important;
    transform:none!important;
  }
  .track .section .section-inner{
    box-sizing:border-box!important;
    width:100%!important;max-width:100%!important;min-width:0!important;
    max-height:calc(100svh - 96px)!important;
    overflow-x:clip!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-width:none!important;
  }
  .track .section .section-inner::-webkit-scrollbar{display:none!important}
  .track .section .stagger{min-width:0!important;max-width:100%!important}
  .track #home .title,
  .track #home .title em,
  .track #about .title,
  .track #services .title,
  .track #market .title,
  .track #strategic .title,
  .track #industries .title{
    max-width:100%!important;
    font-size:clamp(25px,7.2vw,32px)!important;
    line-height:1.08!important;letter-spacing:-.025em!important;
    text-wrap:balance!important;overflow-wrap:break-word!important;
  }
  .track .section .eyebrow{
    font-size:9px!important;line-height:1.35!important;
    margin-bottom:7px!important;letter-spacing:.11em!important;
  }
  .track .section .body,.track .section .home-intro{
    font-size:12.5px!important;
    line-height:1.48!important;
    margin-top:9px!important;overflow-wrap:break-word!important;
  }
  .track .section .list{margin-top:10px!important}
  .track .section .list li{
    min-width:0!important;
    padding:5px 0!important;
  }
  .track .section .list li span:first-child{font-size:9px!important}
  .track .section .list li span:last-child{
    min-width:0!important;
    font-size:11.5px!important;line-height:1.36!important;
    overflow-wrap:break-word!important;
  }
  /* On phones five long About achievements must NOT occupy three thin columns. */
  .track #about .list{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;
  }
  .track #about .list li{
    display:grid!important;
    grid-template-columns:26px minmax(0,1fr)!important;
    gap:7px!important;
    padding:5px 0!important;text-align:left!important;
    border-right:0!important;
    border-bottom:1px solid rgba(244,247,249,.16)!important;
  }
  .track #about .list li span:first-child{margin:0!important}
  .track #about .list li span:last-child{
    font-size:12.5px!important;line-height:1.4!important;
    min-width:0!important;max-width:100%!important;
    font-weight:400!important;white-space:normal!important;
    overflow-wrap:break-word!important;
  }

  /* The desktop About proof grid had min-height:96px and full-height
     border lines on each item. Those declarations still won on iPhones,
     stacking five enormous, centered cards and hiding the last item.
     Reset their entire mobile geometry and make compact numbered rows. */
  .track #about .section-inner{
    text-align:left!important;
  }
  .track #about .eyebrow,
  .track #about .title,
  .track #about .body,
  .track #about .section-action{
    text-align:left!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  .track #about .list{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-auto-rows:auto!important;
    align-content:start!important;
    gap:0!important;
    width:100%!important;max-width:100%!important;
    height:auto!important;min-height:0!important;
    margin:10px 0 0!important;
    padding:0!important;
    border-top:1px solid rgba(244,247,249,.24)!important;
    border-right:0!important;
    border-bottom:0!important;
    border-left:0!important;
    box-sizing:border-box!important;
  }
  .track #about .list li,
  .track #about .list li:not(:last-child){
    display:grid!important;
    grid-template-columns:29px minmax(0,1fr)!important;
    grid-template-rows:auto!important;
    align-items:start!important;
    justify-items:stretch!important;
    gap:8px!important;
    width:100%!important;min-width:0!important;
    min-height:0!important;max-height:none!important;height:auto!important;
    margin:0!important;
    padding:7px 2px!important;
    box-sizing:border-box!important;
    text-align:left!important;
    border:0!important;
    border-bottom:1px solid rgba(244,247,249,.23)!important;
    background:transparent!important;
  }
  .track #about .list li span:first-child{
    display:block!important;
    margin:1px 0 0!important;
    padding:0!important;
    color:rgba(240,248,255,.83)!important;
    font:600 10px/1.4 Arial,Helvetica,sans-serif!important;
    letter-spacing:.1em!important;
    text-align:left!important;
    white-space:nowrap!important;
  }
  .track #about .list li span:last-child{
    display:block!important;
    margin:0!important;padding:0!important;
    color:#fff!important;
    text-align:left!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:12px!important;line-height:1.38!important;
    letter-spacing:0!important;
  }
  .track #about .body{
    font-size:12.5px!important;line-height:1.45!important;
    max-width:100%!important;
  }
  .track #about .section-action{
    margin-top:10px!important;
  }
  .track .section .pill-row{
    gap:5px!important;margin-top:10px!important;
  }
  .track #home .home-deal-grid,
  .track #market .market-summary-grid,
  .track #strategic .strategic-growth-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .track #home .home-deal-pill{
    min-height:0!important;
    padding:7px 9px!important;
    border:1px solid rgba(231,240,247,.42)!important;
    box-sizing:border-box!important;
  }
  .track #home .home-deal-pill strong{
    font-size:11px!important;line-height:1.28!important;
  }
  .track #home .home-deal-pill small{
    font-size:10px!important;line-height:1.32!important;
    margin-top:2px!important;
  }
  .track .section .pill{
    min-width:0!important;max-width:100%!important;
    padding:7px 9px!important;
    font-size:11px!important;line-height:1.33!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
  }
  .track .section .section-action{
    margin-top:10px!important;
    min-height:39px!important;
    padding:9px 12px!important;
    max-width:100%!important;
  }
  .track .section .section-action .label{
    font-size:10px!important;line-height:1.3!important;
    white-space:normal!important;
  }
}
@media(max-width:360px){
  body .analytics-consent-actions{
    grid-template-columns:minmax(0,1fr)!important;
  }
}
@media(max-width:380px){
  :is(#app #mobile,body #mobile) .mobile-links.menu-layout{
    padding-inline:18px!important;
  }
  :is(#app #mobile,body #mobile) .mobile-footer.menu-actions{
    padding-inline:18px!important;
  }
  :is(#app #mobile,body #mobile) .menu-primary-grid > :is(a,button){
    font-size:17px!important;
  }
  .track .section .title,.track #home .title em{
    font-size:clamp(25px,7vw,30px)!important;
  }
}
@media(max-width:760px) and (max-height:650px){
  :is(#app #mobile,body #mobile) .mobile-links.menu-layout{
    padding-block:0 6px!important;
  }
  :is(#app #mobile,body #mobile) .menu-group+.menu-group{margin-top:12px!important}
  :is(#app #mobile,body #mobile) .menu-primary-grid > :is(a,button){
    padding:6px 0!important;
    font-size:17px!important;
  }
  :is(#app #mobile,body #mobile) .menu-legal-links > :is(a,button){
    padding:6px 0!important;
  }
  .track .section .section-inner{
    max-height:calc(100svh - 88px)!important;
  }
  .track .section .title,.track #home .title em{
    font-size:clamp(24px,6.8vw,29px)!important;
  }
  .track #about .list li,
  .track #about .list li:not(:last-child){padding:6px 3px!important}
  .track #about .body{font-size:12px!important;line-height:1.38!important}
  .track #about .list li span:last-child{font-size:11.75px!important;line-height:1.32!important}
}
@media(min-width:761px) and (max-width:1023px){
  /* Tablet readability without giant open-menu links. */
  :is(#app #mobile,body #mobile) .menu-primary-grid > :is(a,button){
    font-size:clamp(20px,2.5vw,25px)!important;
    line-height:1.2!important;
  }
}


/* iPhone About: place compact milestone list near the white header.
   The shared section vertically centers content, leaving a tall
   empty strip before Who We Are on taller phones. About-only override. */
@media (max-width:760px){
  .track .scene .overlay #about.section.pad{
    align-items:flex-start!important;
    padding-top:84px!important;
    padding-bottom:12px!important;
  }
}