/* Landing-specific pieces that were inline React styles in the design export. */

html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 16px; }
[hidden] { display: none !important; }

/* Segmented control: access type and month filter */
.bx-seg { height: 36px; border-radius: 7px; border: 0; font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; background: transparent; color: #8FA3B9; }
.bx-seg[aria-selected="true"] { background: #19334F; color: #E6EDF5; box-shadow: inset 0 0 0 1px #2B4462; }
.bx-seg-sm { height: 32px; padding: 0 12px; font-size: 13px; }
.bx-seg-sm[aria-selected="true"] { box-shadow: none; }

/* Exchange picker */
.bx-choice { height: 44px; border-radius: 8px; font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; border: 1px solid #57718D; background: transparent; color: #8FA3B9; transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
.bx-choice[aria-checked="true"] { border-color: #7EA5CF; background: #19334F; color: #E6EDF5; }
.bx-seg:focus-visible, .bx-choice:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }

/* FAQ chevron */
.bx-faq-icon { flex: none; width: 36px; height: 36px; border-radius: 9999px; display: inline-grid; place-items: center; border: 1px solid #2B4462; background: #121B26; color: #7EA5CF; transition: transform .3s cubic-bezier(.2,.8,.2,1), background-color .2s ease, border-color .2s ease, color .2s ease; }
.bx-faq-q[aria-expanded="true"] .bx-faq-icon { border-color: #7EA5CF; background: #7EA5CF; color: #0B1118; transform: rotate(180deg); }

/* Kill switch label */
.bx-run { font-size: 12px; font-weight: 500; padding: 2px 8px; border-radius: 6px; background: #0F2A1F; color: #3DD68C; }
.bx-run[data-stopped] { background: #212B36; color: #8FA3B9; }

/* Form */
.bx-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.bx-field[aria-invalid="true"] { border-color: var(--loss); }
.bx-form-msg { margin: 0; font-size: 14px; line-height: 20px; padding: 10px 12px; border-radius: 8px; background: #121B26; border: 1px solid #2B4462; }
.bx-form-msg[data-kind="ok"] { border-color: #1E5A3F; background: var(--profit-soft); color: var(--profit); }
.bx-form-msg[data-kind="error"] { border-color: #5A2A2E; background: var(--loss-soft); color: var(--loss); }

/* Phones and small tablets: the design is 1440px wide, scale type and padding down */
@media (max-width: 720px) {
  h1 { font-size: 40px !important; line-height: 44px !important; }
  h2 { font-size: 30px !important; line-height: 36px !important; }
  section > div, section { padding-left: 16px !important; padding-right: 16px !important; }
  header > div { padding-left: 16px !important; padding-right: 16px !important; }
  header nav { display: none !important; }
  #top > div { padding-top: 48px !important; padding-bottom: 56px !important; }
  #top [style*="left: -28px"] { position: static !important; margin-top: 12px; }
  #access > div > div { padding: 24px !important; }
  [style*="flex: 1 1 460px"], [style*="flex: 1 1 560px"], [style*="flex: 1.6 1 560px"],
  [style*="flex: 1 1 440px"], [style*="flex: 1 1 420px"], [style*="flex: 1 1 400px"],
  [style*="flex: 2 1 560px"] { flex-basis: 100% !important; }
  [style*="minmax(340px"] { grid-template-columns: 1fr !important; }
}