/* Namma Ambulance: phone layout fixes (applies at 640px and below). */
.m-menu-btn, .m-menu-panel, .m-total-bar { display: none; }

@media (max-width: 640px) {
  html { -webkit-text-size-adjust: 100%; }
  body { padding-bottom: 78px; }

  /* Header: one row (logo, Book now, Menu); other links move into the menu */
  [data-m-nav] { padding: 8px 12px !important; gap: 8px !important; flex-wrap: nowrap !important; }
  [data-m-nav] > :first-child { min-width: 0; }
  [data-m-nav] > :first-child > div:last-child { font-size: 16px !important; white-space: nowrap; }
  [data-m-links] { flex-wrap: nowrap !important; gap: 8px !important; }
  [data-m-links] > a:not(:last-of-type) { display: none !important; }
  [data-m-links] > a:last-of-type { padding: 12px 14px !important; white-space: nowrap; }
  .m-menu-btn {
    display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
    border: 0; border-radius: 8px; background: #F3E4C8; color: #2B2118; cursor: pointer;
    box-shadow: 1px 2px 0 rgba(120,90,50,.25); flex: none;
  }
  .m-menu-panel.open {
    display: flex; flex-direction: column; position: fixed; left: 10px; right: 10px; z-index: 60;
    background: #FBF3E2; box-shadow: 4px 6px 0 rgba(120,90,50,.25), 0 10px 30px rgba(43,33,24,.18);
    padding: 6px; border-radius: 10px; max-height: 70vh; overflow: auto;
  }
  .m-menu-panel a {
    display: flex; align-items: center; min-height: 48px; padding: 0 14px; font-weight: 700; font-size: 16px;
    color: #2B2118 !important; border-bottom: 1px dashed rgba(120,90,50,.25);
  }
  .m-menu-panel a:last-child { border-bottom: 0; }

  /* Floating emergency call: one compact line, never wider than the screen */
  [data-m-float] {
    white-space: nowrap; font-size: 15px !important; padding: 12px 18px !important; gap: 8px !important;
    max-width: calc(100vw - 24px); bottom: 12px !important;
  }

  /* Comfortable tap targets in the footer and small inline actions */
  [data-screen-label="Footer"] a { display: inline-block; padding: 7px 0; }
  a[href^="tel:"], a[href^="mailto:"] { min-height: 32px; }

  /* Stop iPhones zooming into form fields */
  input:not([type="range"]):not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px !important; }

  /* Fare Calculator: live total pinned above the call button */
  .m-total-bar.show {
    display: flex; position: fixed; left: 12px; right: 12px; bottom: 72px; z-index: 49; align-items: center;
    justify-content: space-between; gap: 12px; padding: 10px 16px; border-radius: 10px; border: 0;
    background: #2B2118; color: #FFF4E4; font: 800 17px/1.2 'Bricolage Grotesque', sans-serif;
    box-shadow: 3px 5px 0 rgba(0,0,0,.25); cursor: pointer; text-align: left;
  }
  .m-total-bar small { font: 700 13px/1.2 'Kalam', cursive; color: #FFD44D; }
}

@media (max-width: 640px) {
  [data-m-ribbon] { flex-wrap: nowrap !important; gap: 10px !important; padding: 7px 10px !important; font-size: 12px !important; letter-spacing: .04em !important; white-space: nowrap; }
  [data-m-ribbon] a { padding: 6px 10px !important; }
}

/* Tap-target sizing (44px guideline, 40px minimum) */
@media (max-width: 640px) {
  [data-screen-label="Footer"] a { padding: 11px 0 !important; }
  a[href="/"]:not([data-m-nav] a) { min-height: 42px; display: inline-flex !important; align-items: center; }
  a[href^="tel:"]:not(p a):not([data-m-float]), a[href^="mailto:"]:not(p a) { min-height: 42px; display: inline-flex !important; align-items: center; }
  .leaflet-touch .leaflet-bar a { width: 40px !important; height: 40px !important; line-height: 40px !important; font-size: 20px !important; }
  input[type="range"] { height: 36px; }
  button { min-height: 40px; }
  .leaflet-container button, svg button, button[style*="position:absolute"], button[style*="position: absolute"] { min-height: 0 !important; }
  a[href="/faq/"] { min-height: 40px; display: inline-flex !important; align-items: center; }
}

/* One call button on screen at a time (phones) */
@media (max-width: 640px) {
  [data-m-ribbon] { display: none !important; }
  [data-m-float] { transition: opacity .25s, transform .25s !important; }
  [data-m-float].m-hide { opacity: 0 !important; pointer-events: none !important; transform: translateX(-50%) translateY(120%) !important; }
  body.m-float-hidden .m-total-bar.show { bottom: 12px; }
  [data-m-nav] > :first-child > div:last-child { font-size: 16px !important; }
}
@media (max-width: 400px) {
  [data-m-nav] > :first-child > div:last-child > div { display: none !important; }
  [data-m-nav] > :first-child > div:first-child { width: 34px !important; height: 34px !important; }
}

/* ---------- Phone spacing & sizing system ---------- */
@media (max-width: 640px) {
  /* One heading scale on every page: fills a phone without touching the edges */
  h1 { font-size: min(44px, 12vw) !important; line-height: 1.02 !important; }

  /* Cards: same inner padding and the same gap everywhere */
  [data-surface][style*="padding:26px 24px"], [data-surface][style*="padding: 26px 24px"],
  [data-surface][style*="padding:28px 26px"], [data-surface][style*="padding: 28px 26px"],
  [data-surface][style*="padding:24px 22px"], [data-surface][style*="padding: 24px 22px"] {
    padding: 22px 20px 24px !important;
  }

  /* Footer: even rhythm; undo the tap-size rules that made some rows taller */
  [data-screen-label="Footer"] a,
  [data-screen-label="Footer"] a[href^="tel:"],
  [data-screen-label="Footer"] a[href^="mailto:"],
  [data-screen-label="Footer"] a[href="/faq/"] {
    display: block !important; min-height: 0 !important; padding: 10px 0 !important; line-height: 1.3;
  }
}

@media (max-width: 380px) {
  [data-surface][style*="padding:26px 24px"], [data-surface][style*="padding: 26px 24px"],
  [data-surface][style*="padding:28px 26px"], [data-surface][style*="padding: 28px 26px"],
  [data-surface][style*="padding:24px 22px"], [data-surface][style*="padding: 24px 22px"] {
    padding: 20px 16px 22px !important;
  }
  /* Header: logo never shrinks; smaller Book now so everything fits */
  [data-m-nav] > :first-child > div:first-child { flex: none; }
  [data-m-links] > a:last-of-type { padding: 11px 11px !important; font-size: 13px !important; }
  [data-m-nav] > :first-child > div:last-child { font-size: 15px !important; }
}

@media (max-width: 340px) {
  /* Very narrow phones: the red cross logo alone, the name is in the hero */
  [data-m-nav] > :first-child > div:last-child { display: none !important; }
}

@media (max-width: 400px) {
  /* Columns designed with 200-399px minimum widths must shrink on small phones */
  [style*="min-width:2"], [style*="min-width: 2"], [style*="min-width:3"], [style*="min-width: 3"] { min-width: 0 !important; }
}

@media (max-width: 640px) {
  /* Links inside footer sentences stay inline */
  [data-screen-label="Footer"] p a { display: inline !important; padding: 0 !important; }
}

@media (max-width: 640px) {
  [data-m-nav] > :first-child { min-height: 44px; min-width: 44px; }
}

@media (max-width: 640px) {
  a[href*="google.com/maps"], a[href*="maps.google"], a[href*="maps.apple"] { min-height: 42px; display: inline-flex !important; align-items: center; }
}