/* Support page specific styles */
.support-hero {
  background: linear-gradient(180deg, rgba(47,168,79,0.07), transparent);
  padding: var(--space-16) 0 var(--space-10);
}
.hero-subtitle { color: var(--gray-600); max-width: 60ch; }
.hero-search { margin-top: var(--space-6); display: grid; grid-template-columns: 1fr auto; gap: var(--space-3); }
@media (max-width: 640px) { .hero-search { grid-template-columns: 1fr; } }
.results-count { margin-top: var(--space-3); color: var(--gray-600); }

.quick-hub { padding: var(--space-12) 0 var(--space-4); }
.hub-grid { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 960px) { .hub-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .hub-grid { grid-template-columns: 1fr; } }
.hub-card { text-decoration: none; transition: transform var(--dur-fast) var(--ease-out); }
.hub-card:hover { transform: translateY(-2px); }

.section { padding: var(--space-12) 0; }
.faq-list { grid-template-columns: 1fr 1fr; }
@media (max-width: 960px) { .faq-list { grid-template-columns: 1fr; } }
.faq-item summary { cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary h3 { display: inline; }

.contact-grid { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 960px) { .contact-grid { grid-template-columns: 1fr; } }

.troubleshoot-grid { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 960px) { .troubleshoot-grid { grid-template-columns: 1fr; } }

.kb-header { display: grid; grid-template-columns: 1fr auto; gap: var(--space-4); align-items: end; margin-bottom: var(--space-4); }
@media (max-width: 960px) { .kb-header { grid-template-columns: 1fr; } }
.kb-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.kb-grid { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1024px) { .kb-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .kb-grid { grid-template-columns: 1fr; } }

.sla-grid { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 960px) { .sla-grid { grid-template-columns: 1fr; } }

.testimonials-grid { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 960px) { .testimonials-grid { grid-template-columns: 1fr; } }

.feedback-grid { grid-template-columns: 1fr 1fr; gap: var(--space-6); }
.feedback-grid .wide { grid-column: 1 / -1; }
@media (max-width: 960px) { .feedback-grid { grid-template-columns: 1fr; } }
.rating-field { border: 1px solid var(--border-color); border-radius: var(--radius-md); padding: var(--space-4); }
.rating-group { display: inline-flex; gap: var(--space-3); }
.consent { margin-top: var(--space-2); }

/* Chat modal */
.chat-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.46); display: none; align-items: center; justify-content: center; padding: var(--space-6); z-index: 300; }
.chat-modal[aria-hidden="false"] { display: flex; }
.chat-dialog { width: min(720px, 100%); max-height: 80vh; display: grid; grid-template-rows: auto 1fr auto; }
.chat-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-3); }
.chat-log { overflow: auto; border: 1px solid var(--border-color); border-radius: var(--radius-md); padding: var(--space-4); background: var(--gray-50); }
.chat-log p { margin: 0 0 var(--space-3); }
.chat-log .agent { color: var(--gray-700); }
.chat-log .user { text-align: right; color: var(--color-primary-700); }
.chat-form { margin-top: var(--space-4); display: grid; grid-template-columns: 1fr auto; gap: var(--space-3); }

/* Minor polish */
.kb-card h3 a { color: inherit; text-decoration: none; }
.kb-card h3 a:hover { text-decoration: underline; }
