/* Valencia Medcare — mobile responsive layer (added 2026-06-30)
   Non-invasive overlay: the site is built with inline styles and no media
   queries, so this stacks the multi-column grids, fixes header overflow with a
   hamburger menu, and keeps the comparison table readable on phones.
   Works with mobile.js (which builds the hamburger and tags a few elements). */

/* base (desktop): hamburger hidden, menu passes through untouched */
.vm-burger{display:none;align-items:center;justify-content:center;width:38px;height:40px;border:0;background:transparent;cursor:pointer;color:var(--green-900,#16352C);padding:0;margin-left:0}
.vm-burger svg{width:26px;height:26px;display:block}
.vm-menu{display:contents}

@media (max-width: 768px){
  /* stack every multi-column grid into a single column */
  [style*="grid-template-columns"]{grid-template-columns:1fr !important}
  [style*="grid-template-columns"] > *{min-width:0}

  /* let space-between button/CTA rows inside sections wrap (not the header) */
  section [style*="display: flex"][style*="justify-content: space-between"]{flex-wrap:wrap}
  .vm-stack{flex-direction:column !important;align-items:flex-start !important;gap:18px !important;flex-wrap:wrap}

  /* header → hamburger menu; keep logo + Schedule + menu icon on one row */
  .vm-burger{display:inline-flex}
  header > div{flex-wrap:nowrap !important;align-items:center}
  header nav{flex-wrap:nowrap !important;gap:6px;align-items:center;justify-content:flex-end}
  .vm-menu{display:none;position:absolute;top:100%;right:10px;left:10px;flex-direction:column;gap:2px;padding:8px;background:var(--surface-page,#FAF8F4);border:1px solid var(--border-default,rgba(31,77,63,.18));border-radius:14px;box-shadow:0 10px 30px rgba(26,26,26,.14),0 24px 64px rgba(31,77,63,.18);z-index:60}
  header.vm-open .vm-menu{display:flex}
  .vm-menu a{padding:13px 14px !important;border-radius:9px}

  /* comparison table: keep the 3-column compare, fit it to the screen width */
  .vm-cmp-wrap > [style*="grid-template-columns"]{grid-template-columns:1.25fr 1fr 1fr !important}
  .vm-cmp-wrap > [style*="grid-template-columns"] > *{min-width:0;overflow-wrap:anywhere;word-break:break-word}
}
