/* Mobile conversion. Inline styles carry the desktop layout; these !important
   overrides restructure below 760px. The [style*=...] selectors intentionally
   match the inline declarations. */
@media (max-width:760px){
  html,body{overflow-x:hidden}
  /* every multi-column inline grid stacks to one column */
  #root [style*="grid-template-columns"],#root [style*="gridTemplateColumns"]{grid-template-columns:1fr !important}
  /* ...except true matrix grids: the calendar and the slot picker */
  #root [style*="repeat(7"]{grid-template-columns:repeat(7,1fr) !important}
  #root [style*="repeat(5"]{grid-template-columns:repeat(5,1fr) !important}
  /* header: tighter, wrapping nav */
  #root header{gap:14px !important;padding:0 16px !important;flex-wrap:wrap}
  #root header nav{gap:14px !important}
  /* generous desktop paddings come down */
  #root main section{padding-left:18px !important;padding-right:18px !important}
  /* the platform showcase panel: no right bleed on a small screen */
  #root [style*="mask-image"]{-webkit-mask-image:none !important;mask-image:none !important}
  /* sticky media panels get a sane height */
  #root [style*="aspect-ratio"]{max-height:56vh !important}
  /* big display type is handled by clamp(); tame fixed hero paddings */
  #root [style*="padding-left: max("],#root [style*="paddingLeft"]{padding-left:18px !important}
}
@media (max-width:760px){
  /* hit targets: form controls at 16px so iOS does not zoom on focus */
  input,select,textarea{font-size:16px !important}
}