/* Contact options share the site's blue palette and spacing. */
.reseller-trigger {
  display: inline-flex;
  align-items: center;
  padding: 0;
  border: 0;
  background: none;
  color: #91baff;
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
}
.reseller-trigger:hover { color: #c2d9ff; }
.desktop-nav .reseller-trigger { font-size: 12px; font-weight: 600; }
.mobile-menu .reseller-trigger { display: block; width: 100%; padding: 11px 0; text-align: left; }
.reseller-trigger:focus-visible, .reseller-close:focus-visible, .reseller-contact:focus-visible { outline: 2px solid #80b1ff; outline-offset: 4px; }
html.reseller-open { overflow: hidden; padding-right: var(--reseller-scrollbar, 0px); }
.reseller-dialog {
  box-sizing: border-box;
  width: min(520px, calc(100% - 40px));
  max-width: none;
  max-height: calc(100dvh - 40px);
  margin: auto;
  padding: 34px;
  border: 1px solid #7393c338;
  border-radius: 14px;
  background: #1c2330;
  color: #f3f6fc;
  box-shadow: 0 24px 90px #0008;
  overflow: auto;
  overscroll-behavior: contain;
}
.reseller-dialog::backdrop { background: #080d18c9; backdrop-filter: blur(6px); }
.reseller-close {
  position: absolute;
  top: 20px;
  right: 20px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid #7293c32e;
  border-radius: 6px;
  background: #253044;
  color: #9fb3d0;
  cursor: pointer;
}
.reseller-close:hover { background: #31425d; color: white; }
.reseller-close .icon { width: 17px; height: 17px; }
.reseller-eyebrow { margin: 0 48px 20px 0; color: #82adf0; font-size: 10px; font-weight: 700; letter-spacing: 2px; line-height: 1.5; }
.reseller-dialog h2 { margin: 0; font-size: 28px; font-weight: 800; line-height: 1.3; letter-spacing: -.7px; }
.reseller-dialog h2:focus { outline: none; }
#reseller-description { margin: 12px 0 0; color: #a6b4c9; font-size: 13px; line-height: 1.8; }
.reseller-contacts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
.reseller-contact {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 20px;
  border: 1px solid #718fb333;
  border-radius: 8px;
  background: #242e3e;
  transition: border-color .18s, background .18s;
}
.reseller-contact:hover { border-color: #619aff; background: #2a3850; }
.reseller-contact-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.reseller-contact-top > .icon { width: 17px; height: 17px; color: #87a1c5; }
.reseller-contact-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 8px; background: #3d83eb20; color: #88b7ff; }
.reseller-contact-icon .icon { width: 23px; height: 23px; }
.reseller-contact strong { font-size: 16px; font-weight: 700; line-height: 1.5; }
.reseller-contact-detail { margin-top: 4px; color: #9dafc7; font-size: 12px; line-height: 1.5; }
.reseller-note { margin: 24px 0 0; color: #8f9eb5; font-size: 11px; line-height: 1.8; }
@media (max-width: 450px) {
  .reseller-dialog { width: calc(100% - 32px); max-height: calc(100dvh - 32px); padding: 24px; }
  .reseller-close { top: 16px; right: 16px; }
  .reseller-eyebrow { font-size: 9px; margin-bottom: 20px; }
  .reseller-dialog h2 { font-size: 24px; letter-spacing: -.5px; }
  #reseller-description { font-size: 12px; }
  .reseller-contacts { gap: 10px; margin-top: 24px; }
  .reseller-contact { padding: 16px 12px; }
  .reseller-contact-top { gap: 8px; margin-bottom: 20px; }
  .reseller-contact strong { font-size: 14px; }
  .reseller-contact-detail { font-size: 11px; }
  .reseller-note { margin-top: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .reseller-contact { transition: none; }
}
