.faq {
  flex-shrink: 0;
  width: 100%;
  max-width: 600px;
  padding: 0 20px;
  margin: 52px auto 120px;
  color: #173f3c;
  text-align: left;
  scroll-margin-top: 24px;
}
.faq h2 { font-size: 26px; line-height: 1.25; margin: 0 0 12px; letter-spacing: -.025em; }
.faq details { border-bottom: 1px solid #b9ccc7; scroll-margin-top: 24px; }
.faq summary { list-style: none; cursor: pointer; padding: 20px 28px 20px 0; position: relative; font-size: 15px; line-height: 1.5; min-height: 60px; }
.faq summary::-webkit-details-marker { display: none; }
.faq .chevron { position: absolute; right: 1px; top: 22px; width: 16px; height: 16px; transition: transform .2s; }
.faq details[open] .chevron { transform: rotate(180deg); }
.faq summary:hover { color: #00665d; }
.faq .answer { color: #48625e; font-size: 14px; line-height: 1.8; margin: 0; padding: 0 20px 22px 0; }
.faq :focus-visible { outline: 2px solid #00665d; outline-offset: 5px; border-radius: 3px; }
.ask-form { display: flex; align-items: center; gap: 10px; margin-top: 26px; border-bottom: 1px solid #8ca9a2; padding-bottom: 11px; }
.ask-form:focus-within { border-color: #00665d; }
.ask-form input { font: inherit; font-size: 16px; min-width: 0; flex: 1; color: #173f3c; background: transparent; border: 0; padding: 12px 0; }
.ask-form input::placeholder { color: #58746d; opacity: 1; }
.ask-form button { width: 44px; height: 44px; display: grid; place-items: center; background: #004643; border: 0; border-radius: 50%; cursor: pointer; flex-shrink: 0; }
.ask-form button:disabled { background: #c8d8d2; cursor: default; }
.ask-form button img { width: 18px; height: 18px; filter: brightness(0) invert(1); }
.ask-form button:disabled img { filter: none; opacity: .55; }
.answer-state { margin-top: 22px; font-size: 14px; line-height: 1.8; color: #48625e; overflow-wrap: anywhere; white-space: pre-wrap; }
.answer-state button { font: inherit; color: #00665d; background: none; border: 1px solid #8ca9a2; border-radius: 8px; padding: 10px 14px; min-height: 44px; cursor: pointer; }
.chat-loader { display: inline-flex; align-items: center; gap: 12px; min-height: 32px; color: #173f3c; }
.chat-loader-grid { display: grid; grid-template-columns: repeat(3, 6px); gap: 3px; }
.chat-loader-grid span { width: 6px; height: 6px; border-radius: 1px; background: currentColor; opacity: .15; animation: chat-pixel-on 650ms ease-in-out infinite; }
.chat-loader-grid span:nth-child(1), .chat-loader-grid span:nth-child(5), .chat-loader-grid span:nth-child(7) { animation-delay: 90ms; }
.chat-loader-grid span:nth-child(2), .chat-loader-grid span:nth-child(6), .chat-loader-grid span:nth-child(8) { animation-delay: 180ms; }
.chat-loader-grid span:nth-child(3), .chat-loader-grid span:nth-child(9) { animation-delay: 270ms; }
.chat-loader-label { font-size: 15px; font-weight: 700; background: linear-gradient(90deg, #78908a 35%, #173f3c 50%, #78908a 65%) 0 0 / 200% 100%; color: transparent; background-clip: text; animation: chat-shimmer 1.4s linear infinite; }
.chat-loader-clock { min-width: 4ch; font: 13px ui-monospace, SFMono-Regular, Menlo, monospace; font-variant-numeric: tabular-nums; color: #58746d; }
@keyframes chat-pixel-on { 50% { opacity: 1; } }
@keyframes chat-shimmer { to { background-position: -200% 0; } }
@media (max-width: 480px) {
  .faq { margin-top: 40px; }
  .faq h2 { font-size: 25px; }
  .faq summary { font-size: 14px; }
  .faq .answer { padding-right: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .faq .chevron { transition: none; }
  .chat-loader-grid span, .chat-loader-label { animation: none; }
  .chat-loader-label { color: #173f3c; }
}

.faq .answer p + p { margin-top: 12px; }
.faq .answer a { color: #00665d; text-underline-offset: 3px; }