/* Phone layout helpers used by /js/mobile-fit.js. Nothing here applies above 700px. */
@media (max-width:700px){
  .mf-tight{padding-top:36px !important;padding-bottom:36px !important;}
  .mf-tight .section-head,.mf-tight .v2-head{margin-bottom:22px !important;}

  /* stacked cards become a swipeable row */
  .mf-swipe{
    display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;
    grid-template-columns:none !important;columns:auto !important;column-count:auto !important;
    gap:12px !important;overflow-x:auto !important;overflow-y:hidden !important;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
    align-items:stretch !important;
  }
  .mf-swipe::-webkit-scrollbar{display:none;}
  .mf-swipe > *{
    flex:0 0 84% !important;max-width:84% !important;min-width:0 !important;width:auto !important;
    scroll-snap-align:start;margin:0 !important;break-inside:auto;
  }
  .mf-swipe > *:only-child{flex-basis:100% !important;max-width:100% !important;}
  .mf-dots{display:flex;justify-content:center;gap:7px;margin:12px 0 2px;}
  .mf-dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(31,43,39,.18);cursor:pointer;transition:width .25s ease,background .25s ease;}
  .mf-dots button.on{width:20px;border-radius:4px;background:#AF8A54;}
  .mf-dots--light button{background:rgba(255,255,255,.35);}
  .mf-dots--light button.on{background:#E5C9AA;}

  /* big pictures and diagrams shrink to leave room for the words */
  .mf-shrink{max-height:var(--mf-max,40vh) !important;width:auto !important;max-width:100% !important;margin-left:auto !important;margin-right:auto !important;object-fit:contain;}

  /* tap-to-open rows as a two-column grid of tiles; an opened tile spans both columns */
  .mf-accgrid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;}
  .mf-accgrid > *{margin:0 !important;min-width:0;padding:10px 11px !important;}
  .mf-accgrid > [open],.mf-accgrid > .open,.mf-accgrid > .is-open,.mf-accgrid > .active{grid-column:1 / -1;}
  .mf-accgrid h3,.mf-accgrid h4,.mf-accgrid summary,.mf-accgrid .v2-acc-q{font-size:13px !important;line-height:1.3 !important;}
  .mf-accgrid summary,.mf-accgrid .v2-acc-q{gap:8px !important;padding:0 !important;}
  .mf-accgrid .chevron,.mf-accgrid .step-plus,.mf-accgrid .cause-num,.mf-accgrid .myth-num{display:none !important;}
  .mf-accgrid [class*="icon"],.mf-accgrid [class*="-ico"]{width:28px !important;height:28px !important;min-width:28px;}
  .mf-accgrid [class*="icon"] svg,.mf-accgrid [class*="-ico"] svg{width:15px !important;height:15px !important;}
  .mf-accgrid small,.mf-accgrid .sub,.mf-accgrid [class*="-sub"],.mf-accgrid [class*="tag"]{display:none !important;}

  /* tile grids three across */
  .mf-tiles{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:7px !important;}
  .mf-tiles > *{padding:10px 6px !important;min-height:0 !important;}
  .mf-tiles > * span,.mf-tiles > * p{font-size:11.5px !important;line-height:1.25 !important;}

  /* bullet lists: first three, then Show all */
  .mf-more{display:inline-block;margin:6px 0 0;padding:0;border:0;background:none;font:inherit;font-size:13px;font-weight:600;color:#AF8A54;cursor:pointer;}
  .mf-listclamp > li:nth-child(n+4){display:none !important;}

  /* short in-section call-to-action boxes */
  .mid-cta{padding:14px 16px !important;gap:12px !important;}
  .mid-cta p{font-size:13px !important;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
  .mid-cta .btn-primary{width:100%;text-align:center;}

  /* pictures inside swipe cards */
  .mf-swipe .team-photo{height:220px !important;}

  /* topic page template pieces that only repeat what's next to them */
  .cause-panel-empty,.flow{display:none !important;}
  .cause-panel:not(.active){display:none !important;}
  .web-caption{margin-top:2px !important;}
  .orbit{width:min(250px,66vw) !important;height:min(250px,66vw) !important;}
  .gut-diagram-wrap{margin-bottom:16px !important;}
  /* long quotes inside compact tiles */
  .mf-accgrid summary q,.mf-accgrid summary p,.mf-accgrid summary blockquote,.mf-accgrid .myth-quote{display:-webkit-box !important;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:12.5px !important;}
  .mf-accgrid [open] summary q,.mf-accgrid [open] summary p,.mf-accgrid [open] .myth-quote{-webkit-line-clamp:unset;}

  /* a little over: squeeze spacing further */
  .mf-tighter{padding-top:16px !important;padding-bottom:16px !important;}
  .mf-tighter .section-head,.mf-tighter .v2-head{margin-bottom:14px !important;}
  .mf-tighter .section-head h2,.mf-tighter .v2-head h2{font-size:26px !important;}
  .mf-tighter .eyebrow,.mf-tighter .section-label{margin-bottom:8px !important;}
  .mf-tighter .mid-cta{margin-top:14px !important;}

  /* the intake tracker is an illustration; the steps beside it carry the content */
  .onboard-grid .dash{display:none !important;}

  /* condition and hormone tabs: one row of small chips */
  .cond-tabs,.horm-tabs{display:flex !important;gap:8px !important;overflow-x:auto;scrollbar-width:none;margin-left:-20px;margin-right:-20px;padding:0 20px 4px;grid-template-columns:none !important;}
  .cond-tabs::-webkit-scrollbar,.horm-tabs::-webkit-scrollbar{display:none;}
  .cond-tab,.horm-tab{flex:0 0 auto !important;flex-direction:row !important;gap:6px !important;padding:9px 14px !important;border-radius:999px !important;min-height:0 !important;}
  .cond-tab h3,.horm-tab h3{font-size:13px !important;margin:0 !important;white-space:nowrap;}
  .cond-tab .ct-ico,.horm-tab .ht-ico{width:22px !important;height:22px !important;margin:0 !important;}
  .cond-tab .ct-ico svg,.horm-tab .ht-ico svg{width:13px !important;height:13px !important;}
  .horm-tab p,.horm-tab small,.cond-tab p{display:none !important;}

  .pillar-detail-empty{display:none !important;}
  .pillar-detail-panel{margin-top:12px !important;}

  .approach.mf-swipe > *{background:#fff;border:1px solid rgba(31,43,39,.08);border-radius:16px;padding:20px 18px !important;}

  /* swipe items that had no card of their own */
  .mf-swipe > .mf-card{background:#fff;border:1px solid rgba(31,43,39,.08);border-radius:16px;padding:20px 18px !important;box-shadow:0 8px 24px rgba(31,43,39,.05);}
  .mf-swipe > figure.mf-card{padding:0 0 14px !important;overflow:hidden;}
  .mf-swipe > figure.mf-card figcaption{padding:0 14px;}

  /* phone-sized type inside sections that run long */
  .mf-tight p,.mf-tight li{font-size:14.5px !important;line-height:1.55 !important;}
  .mf-tight h2{font-size:clamp(24px,7vw,29px) !important;line-height:1.15 !important;}
  .mf-tight h3{line-height:1.25 !important;}
  .mf-tighter p,.mf-tighter li{font-size:14px !important;line-height:1.5 !important;}
  .mf-tight .rx-label,.mf-tight .rx-ringlabel{font-size:13px !important;}
  /* step cards keep their own height in a swipe row */
  .mf-swipe.mf-natural{align-items:flex-start !important;}


  /* tap-to-open notes */
  .mf-coll{padding:0 !important;}
  .mf-coll-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:none;border:0;font:inherit;font-size:14px;font-weight:600;color:#1F2B27;text-align:left;cursor:pointer;}
  .mf-coll-head .step-plus{width:22px;height:22px;color:#6F7F7A;}
  .mf-coll > p{display:none !important;padding:0 16px 16px;margin:0 !important;}
  .mf-coll.is-open > p{display:block !important;}
  .mf-coll.is-open .step-plus .v{transform:scaleY(0);}

  /* sections that are still a little long: lose the in-section booking box
     (every page ends with one) and tighten panel headers */
  .mf-tighter .mid-cta{display:none !important;}
  .cond-panel-top,.horm-panel-top{padding:16px !important;}
  .cond-panel-top h3,.horm-panel-top h3{font-size:18px !important;}
  .checklist-intro{padding:12px 14px !important;}
  .checklist-intro p{font-size:13px !important;}
  .noct-grid.mf-accgrid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  .noct-grid.mf-accgrid h4{font-size:12px !important;}
  .apnea-flow{display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;}
  .apnea-flow > *{margin:0 !important;}
  .apnea-flow .flow-arrow,.apnea-flow > svg{display:none !important;}
  .mf-swipe .team-photo{height:190px !important;}
  .split-hero .image-side{height:330px !important;min-height:330px !important;}

  .mf-tighter .section-head p,.mf-tighter .v2-head p,.mf-tighter .section-sub{font-size:13.5px !important;}
  .noct-intro{padding:12px 14px !important;gap:10px !important;}
  .noct-intro p{font-size:13px !important;}
  .mf-tighter .cond-tabs,.mf-tighter .horm-tabs{margin-bottom:10px !important;}

  .mf-coll-head .step-plus svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;}
  .mf-coll-head .step-plus line{stroke-width:1.9;}
  .mf-coll-head .step-plus .v{transform-origin:12px 12px;transition:transform .25s ease;}
  .pillar-detail-panel:not(:has(.pillar-detail-item.active)){display:none !important;}

  /* When You Join (home and How It Works): compact step grid on phones */
  #how .step-tag{display:none !important;}
  #how .step[data-step="3"],#how .step[data-step="4"]{grid-column:span 3 !important;}
  #how .step[data-step="3"]:has([aria-expanded="true"]){grid-column:1 / -1 !important;}
  #how .step[data-step="3"] .step4-toggle p{display:none !important;}
  #how .step[data-step="3"]:has([aria-expanded="true"]) .step4-toggle p{display:block !important;}
  #how .report-video-wrap{display:none !important;}
  #how .step-body{min-height:0 !important;}

  #how .step-body p.step-p-collapsed{font-size:10.5px !important;line-height:1.4 !important;max-height:2.8em !important;overflow:hidden !important;}
  #how .step-body p.step-p-expanded{font-size:11.5px !important;line-height:1.45 !important;}
  #how .step-body h3{font-size:13px !important;}

  #how .step[data-step="4"] .step-read-more{display:inline-flex !important;}
  #how .step[data-step="4"] .step-body p.step-p-collapsed::after{display:block !important;}

  .checklist-intro{margin-bottom:12px !important;margin-top:0 !important;}
}
