/* Weazel News — shared site styles (desktop + phone) */
:root { --gut: 112px; --sp: 1; --fsL: 1; }
html, body { margin: 0; }
*, *::before, *::after { box-sizing: border-box; }
#root > div { width: 100% !important; max-width: 1440px; margin: 0 auto; height: auto !important; min-height: 100vh; }
img, video, svg { max-width: 100%; }
.wz-menu-btn { display: none; }

/* Screens narrower than the desktop design */
@media (max-width: 1280px) {
  :root { --gut: 48px; }
  #root > div > header nav { gap: 14px !important; font-size: 14px !important; }
}

/* Tablets and phones */
@media (max-width: 900px) {
  :root { --gut: 16px; --sp: .5; --fsL: .5; }
  #root * { max-width: 100% !important; }
  #root [data-m="1"] { grid-template-columns: minmax(0, 1fr) !important; height: auto !important; }
  #root [data-m="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; height: auto !important; }
  #root [data-m] > * { grid-column: auto !important; grid-row: auto !important; }
  #root [data-row] { flex-wrap: wrap; }
  #root [data-fixw] { width: 100% !important; }
  #root img[data-fixw]:not([style*="object-fit: cover"]) { height: auto !important; }
  #root img[data-cover] { width: 100% !important; }
  #root table { display: block; overflow-x: auto; }
  #root td, #root th { padding: 10px 8px !important; }
  #root [style*="display: flex"]:has(> button), #root [style*="display: flex"]:has(> [style*="margin-left: auto"]) { flex-wrap: wrap; }
  #root h1, #root h2, #root h3 { overflow-wrap: break-word; }
  #root [data-colcount] { column-count: 1 !important; }

  /* Header: logo + menu button, links drop down */
  #root > div > header { height: auto !important; min-height: 64px; padding: 8px 16px !important; flex-wrap: wrap; position: relative; }
  #root > div > header > a img { width: 48px !important; height: 48px !important; }
  .wz-menu-btn { display: flex; align-items: center; justify-content: center; margin-left: auto; width: 48px; height: 48px; border: 2px solid #ffffff; background: transparent; color: #ffffff; cursor: pointer; padding: 0; }
  .wz-menu-btn span, .wz-menu-btn span::before, .wz-menu-btn span::after { display: block; width: 22px; height: 2px; background: #ffffff; position: relative; content: ""; }
  .wz-menu-btn span::before { position: absolute; top: -7px; }
  .wz-menu-btn span::after { position: absolute; top: 7px; }
  #root > div > header nav { display: none !important; width: 100%; flex-direction: column; align-items: stretch !important; gap: 0 !important; padding: 8px 0 4px; }
  body.wz-menu-open #root > div > header nav { display: flex !important; }
  #root > div > header nav a { padding: 12px 4px !important; border-bottom: 1px solid rgba(255,255,255,.25) !important; font-size: 17px; }

  /* Footer */
  #root footer [data-row] { gap: 18px !important; }
  #root footer > div > div { flex-wrap: wrap; gap: 14px 22px !important; }
}
