/* mobile.css: loaded last on every page. Phone and tablet fixes from the mobile audit. */
/* promo strip: one short line on phones, header carries the trial button */
.promobar .tb-short{display:none}
@media (max-width:1100px){
  .promobar{height:40px;overflow:hidden}
  .promobar .wrap{height:40px;min-height:0;padding-top:0;padding-bottom:0;flex-wrap:nowrap;gap:0}
  .promobar .tb-cta{display:none}
  .promobar .tb-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  header{position:sticky;top:-40px;z-index:90}
  html{scroll-padding-top:76px}
  .nav.open{max-height:calc(100vh - 72px);max-height:calc(100dvh - 72px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
}
@media (max-width:640px){
  .promobar .tb-txt{display:none}
  .promobar .tb-short{display:inline-flex;align-items:center;min-height:40px;font-weight:600;color:#1D3358;text-decoration:underline;text-underline-offset:2px}
}
/* Home link only inside the collapsed menu */
.nav .mhome{display:none}
@media (max-width:1100px){.nav .mhome{display:flex;align-items:center}}
/* header tap targets */
@media (max-width:1100px){
  .lockup{display:inline-flex;align-items:center;min-height:44px}
  .menubtn{min-width:44px;min-height:44px;justify-content:center}
  .hdrcta{min-height:44px}
  .ddpanel a{min-height:44px;display:flex;align-items:center}
}
/* breadcrumb trail */
.crumbs{background:#fff;border-bottom:1px solid #EEF1F5}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:0 4px;font:500 14px/1.3 var(--font-b,Inter,Arial,sans-serif);color:#4B5563}
.crumbs li{display:flex;align-items:center}
.crumbs li+li::before{content:"\203A";margin:0 8px 0 4px;color:#9AA4B2;font-size:16px}
.crumbs a{color:#1D3358;text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:40px}
.crumbs a:hover{text-decoration:underline}
.crumbs a svg{width:16px;height:16px;flex:0 0 16px}
.crumbs [aria-current]{color:#4B5563;min-height:40px;display:inline-flex;align-items:center}
@media (max-width:640px){.crumbs ol{font-size:15px}.crumbs a,.crumbs [aria-current]{min-height:44px}}
/* back to top */
.totop{position:fixed;right:16px;bottom:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:80;width:48px;height:48px;border-radius:50%;border:0;background:#284C86;color:#fff;display:grid;place-items:center;box-shadow:0 8px 20px rgba(20,24,31,.28);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s;cursor:pointer}
.totop.on{opacity:1;visibility:visible;transform:none}
.totop svg{width:22px;height:22px}
@media (min-width:1101px){.totop{display:none}}
/* phones: readable labels, comfortable taps */
@media (max-width:640px){
  .finder b,.stats li,.stat li,section.tinted li span,.badge,.tag,.tg,p.n,.rk,.live,.fam,.lbl2,.dk,.soon,.open-tag,.now-open-lbl,section .n,p.tag,span.tag{font-size:13px!important}
  a.more{display:inline-flex;align-items:center;min-height:44px}
  .clear,#clear{min-height:44px}
  footer .fgrid li a{display:inline-flex;align-items:center;min-height:40px}
  footer .fgrid ul{gap:0}
  footer .legal a{display:inline-block;padding:9px 0}
  .toc a{display:inline-flex;align-items:center;min-height:40px;font-size:15px}
  /* On-this-page and type chips wrap instead of sliding off the edge */
  .chipbar .chips{flex-wrap:wrap;overflow:visible;justify-content:center;gap:8px}
  .chipbar .chips a{min-height:44px;display:inline-flex;align-items:center}
  /* long section intros read left-aligned */
  .sechead.long,.shead.long{text-align:left}
  .sechead.long p,.shead.long p{margin-left:0;margin-right:0}
  /* home tiles: one per row, picture beside the words */
  .tiles{grid-template-columns:minmax(0,1fr)!important;gap:14px}
  .tile{display:grid!important;grid-template-columns:116px minmax(0,1fr);column-gap:16px;align-items:center;text-align:left!important;padding:14px!important}
  .tile .ti{grid-row:1/span 3;margin:0!important;aspect-ratio:1/1;width:116px}
  .tile h3{margin:0 0 6px;font-size:18px}
  .tile p{min-height:0!important;margin:0 0 6px;font-size:15px}
  .tile a.more{margin-top:0;padding-top:0;min-height:40px}
  /* contact card email fits the card */
  .lbl2+b,.reach a[href^="mailto"],a[href^="mailto:info"]{overflow-wrap:anywhere}
}
@media (max-width:400px){.reach b,.reach a{font-size:15px}}
/* Checkup: action buttons follow you down the checklist */
@media (max-width:700px){
  #symptoms~.foot{position:sticky;bottom:0;z-index:6;background:#fff;margin:18px -16px -16px;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));box-shadow:0 -8px 18px -10px rgba(20,24,31,.25);border-radius:0 0 16px 16px}
}
footer .legal .lnks a{text-transform:none}
/* even hero spacing on phones */
@media (max-width:640px){.phero{padding-bottom:40px!important}}
/* dropdowns open on hover or tap, not merely because focus sits inside */
@media (min-width:1101px){.dd:focus-within:not(.open):not(:hover) .ddpanel{opacity:0;visibility:hidden}}
/* free badge on library and category cards */
.lc .ph{position:relative}
.freebadge{position:absolute;top:8px;left:8px;z-index:1;background:#E0A85A;color:#15181D;font:600 12px/1 Poppins,Inter,sans-serif;letter-spacing:.04em;padding:5px 9px;border-radius:999px;box-shadow:0 4px 10px -4px rgba(0,0,0,.35)}
/* free page card titles: finger-sized tap area on phones without changing the look */
@media (max-width:1100px){.fsec h4 a,.fsec h3.ct a{display:inline-block;padding:12px 0;margin:-12px 0}}
/* Free page: a four-card group sits four across on desktop, two by two on tablets */
@media (min-width:1101px){.fgrid.fgrid4{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.fgrid4 .wcard h4{font-size:18px}.fgrid4 .wc-more{display:none}.fgrid4 .wc-acts .btn{flex:1 1 100%;justify-content:center;text-align:center}.fgrid4 .wc-tag{letter-spacing:.08em}.fgrid4 .wc-free{display:none}}
@media (min-width:621px) and (max-width:1100px){.fgrid.fgrid4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.fsec .wc-free{display:none}

@media (max-width:1100px){body>header .nav>.dd{border-bottom-color:rgba(255,255,255,.14)}}
@media (max-width:1100px){footer .legal{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}}
/* Letter-size covers: show the whole page, footer line included */
.lc .ph img:not([src*="400x400"]){aspect-ratio:17/22}