/* Consent is a viewport utility, not an in-page CTA. */
html { scroll-padding-bottom: 168px; }
body:has([data-home-consent]:not(.hidden):not([hidden])) { padding-bottom: 148px; }
[data-home-consent] {
  position: fixed !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: max(12px, env(safe-area-inset-bottom)) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 2147483000 !important;
  box-sizing: border-box;
  width: min(720px, calc(100% - 24px)) !important;
  max-width: 720px !important;
  max-height: min(42vh, 220px);
  min-height: 0;
  margin: 0 !important;
  padding: 14px 16px !important;
  gap: 12px;
  flex-wrap: wrap;
  overflow: auto;
  box-shadow: 0 16px 42px rgb(0 0 0 / 28%);
}
[data-home-consent].hidden,
[data-home-consent][hidden] { display: none !important; }

[data-home-consent] p { flex: 1 1 320px; min-width: 0; margin-block: 0; overflow-wrap: anywhere; }
[data-home-consent] button {
  min-width: max-content;
  min-height: 44px;
  white-space: normal;
}

.hero-opportunity { max-width: 62ch; }

@media (max-width: 600px) {
  html { scroll-padding-bottom: 200px; }
  body:has([data-home-consent]:not(.hidden):not([hidden])) { padding-bottom: 176px; }
  [data-home-consent] {
    width: calc(100% - 16px) !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    max-height: min(50vh, 280px);
    margin: 0 !important;
    padding: 12px !important;
    gap: 8px;
  }
  [data-home-consent] p { flex-basis: 100%; }
  [data-home-consent] button { min-height: 44px; }
  form input:not([type="hidden"]):not([type="radio"]):not([type="checkbox"]),
  form select,
  form textarea,
  form button { min-height: 44px; box-sizing: border-box; }
}

/* Keep the useful upper forecast-board subject in view on a phone. */
@media (max-width: 600px) {
  .hero-frame .board {
    max-height: 430px;
    overflow: hidden;
  }
  .hero-frame .board .forecast-row:nth-of-type(n + 5) { display: none; }
  .hero-frame .hero-opportunity { font-size: 0.9rem; line-height: 1.35; }
}

@media (max-width: 340px) {
  .hero-frame .board { padding-inline: 12px; }
}