/* FAQ section at the bottom of the Tours page: tap-to-open questions (native <details>, no JS) */
.faq-section { background: var(--dd-cream-faq); padding: 70px 16px 90px; scroll-margin-top: 20px; }
.faq-wrap { max-width: 1100px; margin: 0 auto; color: #2c2806; }
#faq .faq-title { font-family: var(--dd-font-serif); font-size: 40px; line-height: 1.2; font-weight: 700; margin: 0; text-align: center; color: #2c2806; }
#faq .faq-intro { font-family: var(--dd-font-serif); font-size: 19px; line-height: 1.5; max-width: 760px; margin: 18px auto 44px; text-align: center; color: #2c2806; }

.faq-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 56px; align-items: start; }
.faq-col { border-top: 1px solid rgba(44, 40, 6, .22); }

.faq-q { border-bottom: 1px solid rgba(44, 40, 6, .22); }
.faq-q summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 4px; }
.faq-q summary::-webkit-details-marker { display: none; }
.faq-q summary h3 { font-family: var(--dd-font-serif); font-size: 23px; line-height: 1.3; font-weight: 600; margin: 0; color: #2c2806; }
/* red plus that turns into a minus when open */
.faq-q summary::after { content: ''; flex: none; width: 16px; height: 16px; background:
    linear-gradient(var(--dd-red), var(--dd-red)) center / 16px 2px no-repeat,
    linear-gradient(var(--dd-red), var(--dd-red)) center / 2px 16px no-repeat;
  transition: transform .2s ease; }
.faq-q[open] summary::after { background: linear-gradient(var(--dd-red), var(--dd-red)) center / 16px 2px no-repeat; transform: rotate(180deg); }
.faq-q summary:hover h3 { color: var(--dd-red); }
.faq-q summary:focus-visible { outline: 2px solid var(--dd-red); outline-offset: 2px; }
.faq-q p { font-family: var(--dd-font-serif); font-size: 19px; line-height: 1.55; margin: 0; padding: 0 36px 22px 4px; color: #000; }
.faq-q a { color: inherit; text-decoration: underline; }

@media (max-width: 860px) {
  .faq-section { padding: 50px 16px 70px; }
  #faq .faq-title { font-size: 34px; }
  #faq .faq-intro { font-size: 18px; margin-bottom: 32px; }
  .faq-cols { grid-template-columns: 1fr; }
  .faq-col + .faq-col { border-top: 0; }
  .faq-q summary { padding: 18px 2px; }
  .faq-q summary h3 { font-size: 21px; }
  .faq-q p { font-size: 18px; padding-right: 8px; }
}
