/* Third World Solidarity: phone and tablet layout (the pages use inline styles, so rules here need !important). */
.tws-menu-btn { display: none; }

@media (max-width: 900px) {
  /* Top bar: keep it to one short line */
  .tws-topbar > div { padding: 6px 16px !important; justify-content: center !important; }
  .tws-topbar > div > div:first-child { display: none !important; }

  /* Header: logo on the left, menu button on the right, links in a drop-down */
  header > div { flex-wrap: nowrap !important; padding: 14px 16px !important; position: relative; }
  header > div > a:first-child img { height: 40px !important; }
  header > div > a:first-child > span:last-child { font-size: 18px !important; line-height: 1.2; }
  .tws-menu-btn {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    width: 48px; height: 48px; border: 2px solid #1E4D3A; border-radius: 10px;
    background: #FFFFFF; color: #1E4D3A; cursor: pointer; padding: 0;
  }
  .tws-menu-btn svg { width: 24px; height: 24px; }
  header nav[aria-label="Main"] {
    display: none !important; position: absolute; top: 100%; left: 0; right: 0; z-index: 50;
    flex-direction: column !important; align-items: stretch !important; gap: 0 !important;
    background: #FFFFFF; padding: 8px 16px 16px !important; box-shadow: 0 12px 24px rgba(30, 42, 36, .15);
  }
  header.tws-open nav[aria-label="Main"] { display: flex !important; }
  header nav[aria-label="Main"] > a { padding: 14px 4px !important; border-bottom: 1px solid #EFE7D8; font-size: 18px !important; }
  header nav[aria-label="Main"] > a:last-child { border-bottom: 0; margin-top: 12px; justify-content: center; text-align: center; }
}

@media (max-width: 700px) {
  /* Big headings */
  [style*="font-size: 80px"], [style*="font-size: 76px"], [style*="font-size: 72px"], [style*="font-size: 68px"], [style*="font-size: 64px"] { font-size: 40px !important; line-height: 1.1 !important; }
  [style*="font-size: 60px"], [style*="font-size: 58px"], [style*="font-size: 56px"], [style*="font-size: 54px"], [style*="font-size: 52px"] { font-size: 36px !important; line-height: 1.12 !important; }
  [style*="font-size: 50px"], [style*="font-size: 48px"], [style*="font-size: 46px"], [style*="font-size: 44px"], [style*="font-size: 42px"] { font-size: 31px !important; line-height: 1.15 !important; }
  [style*="font-size: 40px"], [style*="font-size: 38px"], [style*="font-size: 36px"], [style*="font-size: 34px"] { font-size: 27px !important; line-height: 1.2 !important; }
  [style*="font-size: 32px"], [style*="font-size: 30px"] { font-size: 24px !important; }

  /* Less empty space */
  [style*="padding: 96px"], [style*="padding: 112px"], [style*="padding: 120px"], [style*="padding: 80px"] { padding-top: 56px !important; padding-bottom: 56px !important; }
  [style*="padding: 0 24px 96px"] { padding-bottom: 56px !important; }
  [style*="padding: 64px 56px"], [style*="padding: 48px 56px"], [style*="padding: 56px"], [style*="padding: 48px"], [style*="padding: 44px"] { padding: 32px 22px !important; }
  [style*="gap: 64px"], [style*="gap: 56px"] { gap: 32px !important; }

  /* Wide grids become one column */
  [style*="grid-template-columns: repeat(auto-"]:not([style*="min(100%"]):not([style*="minmax(1"]):not([style*="minmax(20"]):not([style*="minmax(22"]):not([style*="minmax(24"]) { grid-template-columns: 1fr !important; }
  [style*="min-height: 460px"], [style*="min-height: 400px"], [style*="min-height: 480px"], [style*="min-height: 520px"] { min-height: 280px !important; }
  [style*="height: 440px"], [style*="height: 420px"], [style*="height: 400px"], [style*="height: 380px"] { height: 260px !important; }

  /* Event list rows */
  article [style*="flex: 0 0 220px"] { flex: 1 1 100% !important; width: 100% !important; height: 180px !important; }
  article [style*="flex: 0 0 220px"] img { width: 100% !important; height: 180px !important; }

  /* Nothing wider than the screen */
  img, iframe, video { max-width: 100%; }
}
