/* Support page styles */
.hero-support {
  background: linear-gradient(180deg, rgba(37,99,235,0.06), transparent 50%);
  padding: var(--space-40) 0;
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: var(--space-32);
  align-items: center;
}
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
}
.hero-copy p { color: var(--gray-700); }
.hero-actions { display: flex; gap: var(--space-12); margin-top: var(--space-16); flex-wrap: wrap; }
.support-search { display: grid; grid-template-columns: 1fr auto; gap: var(--space-12); margin-top: var(--space-20); }
@media (max-width: 560px) { .support-search { grid-template-columns: 1fr; } }
.hero-media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }

.support-overview .support-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-24);
}
@media (max-width: 980px) { .support-overview .support-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .support-overview .support-grid { grid-template-columns: 1fr; } }
.support-overview .card h3 { margin-bottom: var(--space-8); }
.support-overview .card ul { margin-top: var(--space-8); padding-left: var(--space-20); }
.support-overview .card li { margin: var(--space-4) 0; }

.support-hours .hours-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-12);
  margin-top: var(--space-12);
}
@media (max-width: 700px) { .support-hours .hours-grid { grid-template-columns: 1fr; } }
.support-hours .hours-item { background: var(--color-surface); border: 1px solid var(--gray-200); border-radius: var(--radius-md); padding: var(--space-16); }
.support-hours .note { color: var(--gray-600); margin-top: var(--space-12); }

.help-center .help-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-24);
  margin-top: var(--space-16);
}
@media (max-width: 980px) { .help-center .help-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .help-center .help-grid { grid-template-columns: 1fr; } }
.help-center .help-figure { margin-top: var(--space-24); }
.help-center .help-figure img { border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }

.faq .faq-list { display: grid; gap: var(--space-12); }
.faq details { background: var(--color-surface); border: 1px solid var(--gray-200); border-radius: var(--radius-md); padding: var(--space-12) var(--space-16); }
.faq summary { cursor: pointer; font-weight: 600; }
.faq details[open] { box-shadow: var(--shadow-sm); }
.faq details > div { margin-top: var(--space-8); color: var(--gray-700); }

.ticket .ticket-grid { grid-template-columns: 2fr 1fr; gap: var(--space-24); }
@media (max-width: 980px) { .ticket .ticket-grid { grid-template-columns: 1fr; } }
.ticket .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-16); margin-top: var(--space-12); }
.ticket .form-span-2 { grid-column: span 2; }
@media (max-width: 700px) { .ticket .form-grid { grid-template-columns: 1fr; } .ticket .form-span-2 { grid-column: span 1; } }
.ticket .form-field label { display: block; margin-bottom: var(--space-8); font-weight: 600; }
.ticket .checkbox { display: inline-flex; gap: var(--space-8); align-items: flex-start; }
.ticket .form-hidden { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ticket .ticket-actions { display: flex; align-items: center; gap: var(--space-12); margin-top: var(--space-16); }
.ticket .ticket-hint { color: var(--gray-600); }
.ticket-success { margin-top: var(--space-12); color: var(--color-success); font-weight: 600; }
.ticket-aside .aside-figure { margin: var(--space-16) 0; }
.ticket-aside img { border-radius: var(--radius-md); }

.testimonials .testimonials-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-24); }
@media (max-width: 980px) { .testimonials .testimonials-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .testimonials .testimonials-grid { grid-template-columns: 1fr; } }
.testimonials blockquote p { font-size: var(--text-lg); }
.testimonials blockquote footer { margin-top: var(--space-8); color: var(--gray-600); }

/* Live chat */
.chat[hidden] { display: none !important; }
.chat { position: fixed; inset: 0; background: rgba(2, 6, 23, 0.55); z-index: 1000; display: grid; place-items: end; padding: var(--space-16); }
.chat-window { width: min(420px, 100%); background: var(--color-surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); display: grid; grid-template-rows: auto 1fr auto; max-height: min(640px, 90vh); }
.chat-header { padding: var(--space-16); border-bottom: 1px solid var(--gray-200); position: relative; }
.chat-desc { color: var(--gray-600); font-size: var(--text-sm); margin-top: var(--space-4); }
.chat-close { position: absolute; right: var(--space-12); top: var(--space-12); background: transparent; border: none; font-size: 22px; line-height: 1; cursor: pointer; color: var(--gray-600); }
.chat-messages { padding: var(--space-16); overflow-y: auto; display: grid; gap: var(--space-12); background: var(--gray-50); }
.bubble { max-width: 85%; padding: var(--space-12); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.bubble.agent { background: #e8f0ff; color: var(--gray-900); justify-self: start; }
.bubble.user { background: var(--color-surface); justify-self: end; }
.chat-input { display: grid; grid-template-columns: 1fr auto; gap: var(--space-12); padding: var(--space-12); border-top: 1px solid var(--gray-200); }

/* Minor tweaks */
.help-header p { color: var(--gray-700); }
.hero-support h1 { margin-top: 0; }