/* ============================================================
   Taylor Oil Co. — Mobile responsive overrides
   The site is built with inline styles (no stylesheets), so mobile
   adaptation is done with !important overrides keyed to data-m="..."
   markers placed on the containers that need to change.
   Tokens (space-separated, so an element can carry several):
     c1        grid -> 1 column
     c2        grid -> 2 columns (then 1 column on small phones)
     c2hold    grid -> 2 columns at every mobile width
     stack     flex row -> column
     hide-m    hidden on mobile
     show-m    shown on mobile (pair with inline display:none)
     static-m  drop position:sticky/relative offset
     map-m     shrink a tall map panel
     gallery-m collapse the homepage photo mosaic
     nav-desktop / hdr-burger / hdr-logo-img / hdr-sub  (header bits)
   ============================================================ */

@media (max-width: 880px) {
  [data-m~="c1"]      { grid-template-columns: 1fr !important; }
  [data-m~="c2"]      { grid-template-columns: repeat(2, 1fr) !important; }
  [data-m~="c2hold"]  { grid-template-columns: repeat(2, 1fr) !important; }
  [data-m~="stack"]   { flex-direction: column !important; align-items: stretch !important; }
  [data-m~="hide-m"]  { display: none !important; }
  [data-m~="show-m"]  { display: flex !important; }
  [data-m~="static-m"]{ position: static !important; top: auto !important; }
  [data-m~="map-m"]   { height: 440px !important; }

  [data-m~="gallery-m"]      { grid-template-columns: repeat(2, 1fr) !important; grid-template-rows: auto !important; }
  [data-m~="gallery-m"] > *  { grid-column: auto !important; grid-row: auto !important; height: 210px !important; }

  /* ---- Header ---- */
  [data-m~="nav-desktop"]  { display: none !important; }
  [data-m~="hdr-burger"]   { display: inline-flex !important; }
  [data-m~="hdr-logo-img"] { height: 54px !important; }
}

@media (max-width: 560px) {
  :root { --container-pad: 16px; }
  [data-m~="c2"]        { grid-template-columns: 1fr !important; }
  [data-m~="gallery-m"] { grid-template-columns: 1fr !important; }
  [data-m~="hdr-sub"]   { display: none !important; }
}