/* Support Center compact redesign — isolated to support.html only. */
.support-page {
  --support-max: 1120px;
  --support-radius: 18px;
  --support-radius-sm: 13px;
}

.support-page .support-main {
  min-height: calc(100vh - var(--header-h));
  padding: calc(var(--header-h) + 24px) 0 44px;
}

.support-page .support-hero-band {
  padding: 0;
  text-align: start;
}

.support-page .support-hero-band > .container,
.support-page .support-grid {
  width: min(var(--support-max), calc(100% - 32px));
}

.support-page .support-hero-band > .container {
  position: relative;
  overflow: hidden;
  padding: clamp(20px, 3vw, 30px);
  border: 1px solid var(--border);
  border-radius: 22px;
  background:
    linear-gradient(135deg,
      color-mix(in srgb, var(--surface-solid) 92%, var(--accent) 8%),
      color-mix(in srgb, var(--surface-solid) 96%, var(--lavender) 4%));
  box-shadow: 0 12px 34px rgba(69, 55, 128, .08);
}

.support-page .support-hero-band > .container::after {
  content: "";
  position: absolute;
  inline-size: 190px;
  block-size: 190px;
  inset-inline-end: -70px;
  inset-block-start: -95px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  pointer-events: none;
}

.support-page .section-kicker {
  padding: 5px 10px;
  gap: 7px;
  font-size: .76rem;
  font-weight: 750;
  box-shadow: none;
  backdrop-filter: none;
}

.support-page .section-kicker::before {
  inline-size: 6px;
  block-size: 6px;
  box-shadow: none;
}

.support-page .support-hero-band h1 {
  max-width: 760px;
  margin: 8px 0 5px;
  font-size: clamp(1.45rem, 2.7vw, 2rem);
  line-height: 1.45;
  font-weight: 850;
  letter-spacing: -.015em;
}

.support-page .support-hero-band .lead {
  max-width: 760px;
  font-size: clamp(.92rem, 1.4vw, 1.02rem);
  line-height: 1.9;
  color: var(--text-muted);
}

.support-page .support-grid {
  grid-template-columns: minmax(0, 1.48fr) minmax(290px, .82fr);
  gap: 18px;
  margin-top: 18px;
}

.support-page .support-assistant-card,
.support-page .support-contact-panel {
  border-radius: var(--support-radius);
  box-shadow: 0 10px 30px rgba(69, 55, 128, .08);
  backdrop-filter: none;
}

.support-page .support-assistant-card {
  min-height: 440px;
}

.support-page .assistant-topbar {
  gap: 10px;
  padding: 12px 15px;
}

.support-page .assistant-topbar h2,
.support-page .support-contact-panel h2 {
  margin: 0;
  font-size: clamp(1rem, 1.5vw, 1.16rem);
  line-height: 1.55;
  font-weight: 800;
}

.support-page .assistant-avatar {
  inline-size: 38px;
  block-size: 38px;
  flex-basis: 38px;
  border-radius: 11px;
}

.support-page .assistant-avatar svg {
  inline-size: 21px;
  block-size: 21px;
}

.support-page .assistant-status {
  margin-top: 0;
  font-size: .75rem;
  line-height: 1.65;
}

.support-page .assistant-thread {
  min-height: 260px;
  max-height: 360px;
  padding: 15px;
  gap: 9px;
  scrollbar-width: thin;
}

.support-page .amsg {
  max-width: min(86%, 620px);
  padding: 9px 12px;
  border-radius: 13px;
  font-size: .88rem;
  line-height: 1.78;
}

.support-page .assistant-inputbar {
  padding: 10px 11px;
}

.support-page .assistant-quick {
  gap: 6px;
  margin-bottom: 8px;
}

.support-page .assistant-chip {
  min-height: 34px;
  padding: 5px 12px;
  font-size: .82rem;
}

.support-page .assistant-inputrow {
  gap: 7px;
}

.support-page .assistant-input {
  min-width: 0;
  min-height: 42px;
  padding: 9px 12px;
  border-radius: 11px;
  font-size: .9rem;
}

.support-page .assistant-send {
  inline-size: 42px;
  block-size: 42px;
  flex-basis: 42px;
  border-radius: 11px;
}

.support-page .assistant-send svg {
  inline-size: 20px;
  block-size: 20px;
}

.support-page .assistant-summary {
  margin: 7px 0;
  gap: 4px;
}

.support-page .asum-row {
  gap: 6px;
}

.support-page .asum-k,
.support-page .assistant-ticket span {
  font-size: .78rem;
}

.support-page .asum-k {
  flex-basis: 74px;
}

.support-page .assistant-ticket {
  margin-top: 7px;
  padding: 9px 11px;
  border-radius: 10px;
}

.support-page .support-contact-side {
  top: calc(var(--header-h) + 14px);
}

.support-page .support-contact-panel {
  padding: 17px;
}

.support-page .support-contact-panel > .hint {
  margin-top: 3px;
  font-size: .84rem;
  line-height: 1.75;
}

.support-page .support-contact-cards {
  gap: 9px;
  margin: 11px 0 4px;
}

.support-page .scard {
  gap: 9px;
  padding: 9px 10px;
  border-radius: var(--support-radius-sm);
}

.support-page .scard-ic {
  inline-size: 34px;
  block-size: 34px;
  flex-basis: 34px;
  border-radius: 9px;
}

.support-page .scard-ic svg {
  inline-size: 19px;
  block-size: 19px;
}

.support-page .scard-main {
  min-width: 105px;
  font-size: .86rem;
  overflow-wrap: anywhere;
}

.support-page .scard-main small {
  font-size: .72rem;
}

.support-page .scard-actions {
  gap: 5px;
}

.support-page .btn.tiny {
  min-height: 32px;
  padding: 5px 10px;
  border-radius: 9px;
  font-size: .76rem;
}

.support-page .support-social-heading {
  margin: 14px 0 7px;
  font-size: .92rem;
}

.support-page .support-social-row {
  gap: 7px;
}

.support-page .ssocial {
  gap: 6px;
  min-height: 36px;
  padding: 6px 10px;
  border-radius: 10px;
  font-size: .8rem;
}

.support-page .ssocial svg {
  inline-size: 18px;
  block-size: 18px;
}

.support-page #site-contact-box {
  margin-top: 0;
}

@media (max-width: 900px) {
  .support-page .support-main {
    padding-top: calc(var(--header-h) + 18px);
  }

  .support-page .support-grid {
    grid-template-columns: 1fr;
  }

  .support-page .support-contact-side {
    position: static;
  }
}

@media (max-width: 560px) {
  .support-page .support-main {
    padding-bottom: 30px;
  }

  .support-page .support-hero-band > .container,
  .support-page .support-grid {
    width: min(100% - 20px, var(--support-max));
  }

  .support-page .support-hero-band > .container {
    padding: 16px;
    border-radius: 17px;
  }

  .support-page .support-hero-band h1 {
    font-size: 1.4rem;
    line-height: 1.55;
  }

  .support-page .support-hero-band .lead {
    font-size: .88rem;
    line-height: 1.78;
  }

  .support-page .support-grid {
    gap: 12px;
    margin-top: 12px;
  }

  .support-page .support-assistant-card,
  .support-page .support-contact-panel {
    border-radius: 15px;
  }

  .support-page .support-assistant-card {
    min-height: 410px;
  }

  .support-page .assistant-thread {
    min-height: 250px;
    max-height: 330px;
    padding: 12px;
  }

  .support-page .amsg {
    max-width: 92%;
    font-size: .84rem;
  }

  .support-page .support-contact-panel {
    padding: 14px;
  }

  .support-page .scard {
    align-items: flex-start;
  }

  .support-page .scard-actions {
    width: 100%;
    padding-inline-start: 43px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .support-page *,
  .support-page *::before,
  .support-page *::after {
    scroll-behavior: auto !important;
  }
}
