/* Healthy Impact — canonical public mobile responsiveness.
   Shared by the animated public site and white detail pages.
   All rules are mobile-only; desktop and animation logic stay untouched. */

.menu-actions-label{display:none!important}

@media(max-width:1023px){
  /* Public mobile ribbon: same geometry/logo/hamburger in both shells. */
  #nav.nav,.detail-public-nav.nav{
    left:0!important;right:0!important;transform:none!important;
    width:100%!important;max-width:none!important;height:78px!important;min-height:78px!important;
    margin:0!important;padding:14px clamp(16px,4vw,20px)!important;
    display:flex!important;align-items:center!important;gap:12px!important;
    border-radius:0!important;box-sizing:border-box!important;
  }
  #nav.nav{top:0!important}
  .detail-public-nav.nav{
    position:fixed!important;top:0!important;z-index:90!important;
    color:#173147!important;background:rgba(248,250,251,.97)!important;
    border:0!important;border-bottom:1px solid rgba(16,44,66,.10)!important;
    box-shadow:none!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;
  }

  #nav .hamburger,.detail-public-nav .hamburger{
    order:1!important;display:flex!important;flex:0 0 32px!important;
    width:32px!important;min-width:32px!important;height:32px!important;
    flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;
    gap:4px!important;margin:0!important;padding:0!important;border:0!important;background:none!important;
  }
  #nav .hamburger i,.detail-public-nav .hamburger i{
    display:block!important;height:2px!important;background:currentColor!important;
  }
  #nav .hamburger i:nth-child(1),#nav .hamburger i:nth-child(2),
  .detail-public-nav .hamburger i:nth-child(1),.detail-public-nav .hamburger i:nth-child(2){width:24px!important}
  #nav .hamburger i:nth-child(3),.detail-public-nav .hamburger i:nth-child(3){width:16px!important}

  #nav .nav-logo,.detail-public-nav .nav-logo{
    order:2!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;
    flex:0 1 auto!important;min-width:0!important;max-width:min(145px,44vw)!important;
    margin:0 auto 0 0!important;padding:0!important;border:0!important;background:none!important;
  }
  #nav .nav-logo-shell,.detail-public-nav .nav-logo-shell{
    display:flex!important;align-items:center!important;justify-content:flex-start!important;
    width:min(145px,44vw)!important;min-width:0!important;height:46px!important;max-height:46px!important;
    margin:0!important;padding:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;
  }
  #nav .nav-logo img,.detail-public-nav .nav-logo img{
    display:block!important;width:100%!important;max-width:145px!important;
    height:auto!important;max-height:46px!important;object-fit:contain!important;object-position:left center!important;
  }
  #nav .nav-left,.detail-public-nav .nav-left{display:none!important}
  #nav .nav-right,.detail-public-nav .nav-right{
    order:3!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;
    gap:8px!important;min-width:0!important;margin:0!important;padding:0!important;border:0!important;
  }
  #nav .nav-right button,.detail-public-nav .nav-right button{
    min-height:38px!important;padding:0 10px!important;white-space:nowrap!important;
    font-size:10.5px!important;line-height:1!important;letter-spacing:.05em!important;
  }

  /* Canonical full-screen menu used by both animated and detail pages. */
  #mobile.mobile-overlay{
    position:fixed!important;inset:0!important;z-index:500!important;
    width:100%!important;height:100dvh!important;max-width:100%!important;overflow:hidden!important;
    background:#1f3850!important;color:#fff!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;
    transition:opacity .35s cubic-bezier(.4,0,.2,1),visibility .35s!important;
    font-family:'Helvetica Neue ME','Helvetica Neue',Helvetica,Arial,sans-serif!important;
  }
  #mobile.mobile-overlay.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
  #mobile .mobile-panel{
    position:relative!important;width:100%!important;height:100dvh!important;min-height:0!important;max-height:100dvh!important;
    display:flex!important;flex-direction:column!important;overflow:hidden!important;
    transform:translateY(-20px)!important;transition:transform .35s cubic-bezier(.4,0,.2,1)!important;
  }
  #mobile.open .mobile-panel{transform:none!important}
  #mobile .close-wrap{
    flex:0 0 auto!important;display:flex!important;justify-content:flex-end!important;align-items:center!important;
    padding:calc(18px + env(safe-area-inset-top)) 22px 10px!important;
  }
  #mobile .close{
    display:grid!important;place-items:center!important;width:40px!important;min-width:40px!important;height:40px!important;
    padding:0!important;border:1px solid rgba(255,255,255,.30)!important;border-radius:50%!important;
    background:transparent!important;color:#fff!important;font-size:25px!important;line-height:1!important;cursor:pointer!important;
  }
  #mobile .mobile-links.menu-layout{
    flex:1 1 auto!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
    padding:12px clamp(24px,6vw,48px) 20px!important;
    display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(220px,.75fr)!important;
    align-content:start!important;align-items:start!important;gap:clamp(30px,6vw,64px)!important;
    overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important;
  }
  #mobile .menu-group{min-width:0!important}
  #mobile .menu-section-label,#mobile .menu-actions-label{
    display:block!important;margin:0 0 10px!important;padding:0 0 10px!important;
    border-bottom:1px solid rgba(255,255,255,.18)!important;color:rgba(255,255,255,.50)!important;
    font-size:10px!important;line-height:1.2!important;font-weight:700!important;letter-spacing:.16em!important;text-transform:uppercase!important;
  }
  #mobile .menu-primary-grid{
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    width:100%!important;max-width:none!important;min-width:0!important;gap:0!important;
  }
  #mobile .menu-primary-grid>button,#mobile .menu-legal-links>button{
    width:100%!important;min-width:0!important;margin:0!important;border:0!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;border-radius:0!important;
    background:none!important;color:rgba(255,255,255,.72)!important;text-align:left!important;text-transform:uppercase!important;
    white-space:normal!important;overflow-wrap:break-word!important;cursor:pointer!important;
    font-family:'Helvetica Neue ME','Helvetica Neue',Helvetica,Arial,sans-serif!important;
  }
  #mobile .menu-primary-grid>button{
    position:relative!important;padding:13px 0!important;font-size:clamp(21px,3.8vw,30px)!important;
    line-height:1.12!important;font-weight:400!important;letter-spacing:.015em!important;
  }
  #mobile .menu-primary-grid>button.active{color:#fff!important;padding-left:10px!important}
  #mobile .menu-primary-grid>button.active::before{
    content:""!important;position:absolute!important;left:0!important;top:50%!important;width:4px!important;height:4px!important;
    border-radius:50%!important;background:#fff!important;transform:translateY(-50%)!important;
  }
  #mobile .menu-legal-links{
    display:grid!important;grid-template-columns:1fr!important;gap:0!important;width:100%!important;min-width:0!important;
    margin:0!important;padding:0!important;border:0!important;
  }
  #mobile .menu-legal-links>button{
    padding:11px 0!important;font-size:12px!important;line-height:1.25!important;font-weight:600!important;letter-spacing:.08em!important;
  }
  #mobile .mobile-footer.menu-actions{
    position:static!important;inset:auto!important;flex:0 0 auto!important;width:100%!important;
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;justify-content:stretch!important;align-items:stretch!important;
    gap:10px!important;padding:14px clamp(24px,6vw,48px) calc(18px + env(safe-area-inset-bottom))!important;
    border-top:1px solid rgba(255,255,255,.18)!important;background:#1f3850!important;color:#fff!important;
    font-size:12px!important;letter-spacing:.12em!important;text-transform:uppercase!important;
  }
  #mobile .menu-actions-label{grid-column:1/-1!important;margin:0!important}
  #mobile .menu-actions>button{
    width:100%!important;min-width:0!important;min-height:44px!important;margin:0!important;padding:0 14px!important;
    border:1px solid rgba(255,255,255,.35)!important;border-radius:0!important;background:transparent!important;color:#fff!important;
    font-size:11px!important;line-height:1.15!important;font-weight:700!important;letter-spacing:.10em!important;
    text-align:center!important;text-transform:uppercase!important;white-space:normal!important;
  }
  #mobile .menu-actions .menu-login{background:#fff!important;color:#1f3850!important;border-color:#fff!important}

  /* White public pages sit below their fixed ribbon; private hubs are not targeted. */
  .detail-public-nav~main{
    max-width:100%!important;min-width:0!important;padding-top:78px!important;overflow-x:clip!important;
  }
  .detail-public-nav~.public-footer{max-width:100%!important;min-width:0!important;overflow-x:clip!important}
}

@media(max-width:760px){
  #nav .nav-right,.detail-public-nav .nav-right{display:none!important}

  /* Animated pages: dimensional/wrapping hardening only. */
  .scene,.overlay,.section,.section-inner,.copy-left,.copy-center,.copy-right{max-width:100%!important;min-width:0!important}
  .pad{padding-left:clamp(18px,5.5vw,24px)!important;padding-right:clamp(18px,5.5vw,24px)!important}
  .title,.body,.list,.pill-row,.section-action{max-width:100%!important;min-width:0!important}
  .title,.body,.pill,.list li,.list li span,.section-action .label{overflow-wrap:break-word!important;word-break:normal!important}
  .pill-row,.list{width:100%!important}
  .pill{max-width:100%!important;min-width:0!important;white-space:normal!important}
  .list li{min-width:0!important}
  .section-action,.section-action .label{white-space:normal!important}

  /* Detail pages. */
  .detail-page,.detail-page .v40-page-hero,.detail-page .v40-section{
    width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:clip!important;
  }
  .detail-page .v40-page-hero{padding-top:34px!important;padding-bottom:32px!important}
  .detail-page .v40-section{padding-top:34px!important;padding-bottom:44px!important}
  .detail-page .detail-hero,.detail-page .detail-story,.page-hero .container.narrow,.legal-copy.container.narrow{
    width:calc(100% - 36px)!important;max-width:760px!important;min-width:0!important;margin-inline:auto!important;
  }
  .detail-page .v40-page-hero h1{
    max-width:100%!important;font-size:clamp(30px,9vw,40px)!important;line-height:1.06!important;overflow-wrap:break-word!important;
  }
  .detail-page .v40-page-hero p{max-width:100%!important;font-size:15px!important;line-height:1.55!important;overflow-wrap:break-word!important}
  .detail-page .detail-section,.detail-page .detail-step,.detail-page .detail-numbered li,.detail-page .detail-step>div{
    min-width:0!important;max-width:100%!important;
  }
  .detail-page .detail-section h2,.detail-page .detail-step h2{
    max-width:100%!important;font-size:clamp(21px,6vw,25px)!important;line-height:1.2!important;overflow-wrap:break-word!important;
  }
  .detail-page .detail-section p,.detail-page .detail-step p,.detail-page .detail-section li,.detail-page .detail-numbered p{
    max-width:100%!important;font-size:15px!important;line-height:1.62!important;overflow-wrap:break-word!important;
  }
  .detail-page .detail-section ul,.detail-page .detail-sublist{max-width:100%!important;padding-left:1.2rem!important}

  /* Legal pages. */
  .page-hero{width:100%!important;max-width:100%!important;padding:36px 0 30px!important;overflow-x:clip!important}
  .page-hero h1{max-width:100%!important;font-size:clamp(34px,10vw,46px)!important;line-height:1.04!important;overflow-wrap:break-word!important}
  .detail-public-nav~main>.section{padding:36px 0 50px!important}
  .legal-copy{min-width:0!important;max-width:100%!important;font-size:14.5px!important;line-height:1.7!important;overflow-wrap:break-word!important}
  .legal-copy h2{max-width:100%!important;font-size:22px!important;line-height:1.2!important;overflow-wrap:break-word!important}
  .legal-note{max-width:100%!important}

  /* Contact + Secure Login side drawers. */
  .public-overlay-backdrop{width:100%!important;max-width:100%!important;overflow:hidden!important}
  .public-overlay{
    width:100%!important;max-width:100%!important;height:100dvh!important;max-height:100dvh!important;
    padding:calc(16px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom))!important;
    border-left:0!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .public-overlay-close{top:0!important;width:40px!important;min-width:40px!important;height:40px!important}
  .public-overlay-body{width:100%!important;max-width:none!important;min-width:0!important;margin-top:8px!important}
  .public-overlay-title,.public-login-panel h1{
    max-width:100%!important;font-size:clamp(31px,9vw,40px)!important;line-height:1.04!important;overflow-wrap:break-word!important;
  }
  .public-overlay-lede,.public-login-panel>p{max-width:100%!important;font-size:14px!important;line-height:1.6!important}
  .public-overlay .form-grid{grid-template-columns:1fr!important;gap:14px!important}
  .public-overlay form,.public-overlay form>*,.public-overlay label,.public-overlay .form-grid>*{min-width:0!important;max-width:100%!important}
  .public-overlay input:not([type="checkbox"]),.public-overlay select,.public-overlay textarea{
    width:100%!important;max-width:100%!important;min-width:0!important;font-size:16px!important;
  }
  .public-overlay textarea{min-height:120px!important}
  .public-overlay button[type="submit"]{min-height:48px!important}

  /* Public footer. */
  .public-footer{padding:40px 0 20px!important;overflow-x:clip!important}
  .public-footer .container{width:calc(100% - 36px)!important;max-width:760px!important;min-width:0!important}
  .public-footer-main,.public-footer-main-clean{grid-template-columns:1fr!important;gap:28px!important}
  .public-footer-brand,.public-footer-cta{min-width:0!important;max-width:100%!important}
  .public-footer .brand-logo,.public-footer .healthy-impact-logo{
    width:min(220px,72vw)!important;max-width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;
  }
  .public-footer-main-clean .public-footer-cta{justify-self:start!important;max-width:none!important}
  .footer-contact-link{max-width:100%!important;font-size:20px!important;white-space:normal!important;overflow-wrap:break-word!important}
  .public-footer-bottom{margin-top:34px!important;gap:8px!important;flex-direction:column!important;align-items:flex-start!important}
}

@media(max-width:639px){
  #mobile .mobile-links.menu-layout{display:block!important;padding:4px 24px 18px!important}
  #mobile .menu-group+.menu-group{margin-top:24px!important}
  #mobile .menu-primary-grid>button{padding:10px 0!important;font-size:clamp(20px,6.2vw,27px)!important;line-height:1.1!important}
  #mobile .menu-legal-links>button{padding:9px 0!important;font-size:11px!important}
  #mobile .mobile-footer.menu-actions{
    grid-template-columns:1fr!important;gap:8px!important;padding:12px 24px calc(16px + env(safe-area-inset-bottom))!important;
  }
  #mobile .menu-actions>button{min-height:42px!important}
}

@media(max-width:430px){
  .detail-page .detail-step,.detail-page .detail-numbered li{
    grid-template-columns:1fr!important;gap:8px!important;padding:22px 0!important;
  }
  .detail-page .detail-index{padding-top:0!important}
  .analytics-consent{left:10px!important;right:10px!important;width:auto!important;max-width:none!important}
  .analytics-consent-actions{display:grid!important;grid-template-columns:1fr!important}
}

@media(max-width:360px){
  #nav.nav,.detail-public-nav.nav{padding-left:14px!important;padding-right:14px!important}
  #nav .nav-logo,.detail-public-nav .nav-logo,#nav .nav-logo-shell,.detail-public-nav .nav-logo-shell{
    max-width:132px!important;width:132px!important;
  }
  #mobile .close-wrap{padding-left:18px!important;padding-right:18px!important}
  #mobile .mobile-links.menu-layout{padding-left:20px!important;padding-right:20px!important}
  #mobile .mobile-footer.menu-actions{padding-left:20px!important;padding-right:20px!important}
}

@media(max-width:760px) and (max-height:680px){
  #mobile .close-wrap{padding-top:12px!important;padding-bottom:6px!important}
  #mobile .menu-primary-grid>button{padding-top:8px!important;padding-bottom:8px!important}
  #mobile .menu-group+.menu-group{margin-top:18px!important}
  #mobile .mobile-footer.menu-actions{padding-top:10px!important;padding-bottom:calc(10px + env(safe-area-inset-bottom))!important}
  .public-overlay{padding-top:12px!important}
}