/* FAQ page palette follows the shared warm paper, charcoal and yellow language. */
body { color: #171714; background: #f4f0e7; font-family: "Montserrat Alternates", Arial, sans-serif; }
body > header.gaming-region { position: relative; z-index: 1; width: 100%; min-height: 0; background-color: #f4f0e7; }
body > main { display: block; padding-top: 0; }
.faq-section { position: relative; padding: clamp(68px, 9vw, 142px) clamp(24px, 8vw, 150px); }
.faq-section > .faq-reveal { width: min(100%, 1320px); margin-inline: auto; }
.faq-hero { min-height: 530px; padding-top: clamp(72px, 9vw, 132px); padding-bottom: clamp(76px, 9vw, 138px); background: #f4f0e7; }
.faq-hero > .faq-reveal { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(280px, .92fr); align-items: center; gap: clamp(36px, 8vw, 120px); }
.faq-hero__copy { position: relative; z-index: 1; max-width: 740px; }
.faq-kicker { margin: 0 0 22px; color: #716d5b; font-size: 12px; font-weight: 700; letter-spacing: .17em; line-height: 1.4; text-transform: uppercase; }
.faq-hero h1 { max-width: 740px; margin: 0; font-size: clamp(42px, 6vw, 82px); font-weight: 800; letter-spacing: -.055em; line-height: .99; text-wrap: balance; text-transform: uppercase; }
.faq-lead { max-width: 590px; margin: 28px 0 32px; color: #59574f; font-family: "Involve", Arial, sans-serif; font-size: clamp(17px, 1.5vw, 21px); line-height: 1.65; }
.faq-button { display: inline-flex; min-height: 54px; align-items: center; justify-content: center; gap: 26px; padding: 14px 24px; border: 0; border-radius: 999px; font: 700 15px/1.2 "Involve", Arial, sans-serif; text-decoration: none; transition: transform .18s ease, background-color .18s ease; }
.faq-button:hover { transform: translateY(-2px); }
.faq-button:focus-visible, .faq-form input:focus-visible, .faq-form textarea:focus-visible, .faq-section a:focus-visible { outline: 3px solid #6f6223; outline-offset: 4px; }
.faq-button--dark { color: #f9f6ed; background-color: #171714; }
.faq-button--dark:hover { color: #fff; background-color: #34342d; }
.faq-button--yellow { color: #171714; background-color: #e6cf58; cursor: pointer; }
.faq-button--yellow:hover { background-color: #d8be3e; }
.faq-hero__art { position: relative; min-height: 340px; aspect-ratio: 1.06; overflow: clip; }
.faq-hero__orbit { position: absolute; display: block; border: 1px solid #cfc8ad; border-radius: 50%; }
.faq-hero__orbit--one { inset: 4% 3% 2% 10%; transform: rotate(-22deg); }
.faq-hero__orbit--two { inset: 13% 13% 10% 0; border-color: #e0d69f; transform: rotate(28deg); }
.faq-hero__tile { position: absolute; display: grid; width: 54%; aspect-ratio: 1.12; place-items: center; border: 1px solid rgb(23 23 20 / 9%); box-shadow: 0 22px 50px rgb(23 23 20 / 12%); font-size: clamp(14px, 2vw, 22px); font-weight: 800; letter-spacing: .11em; }
.faq-hero__tile--one { top: 17%; left: 5%; color: #f5f0e2; background-color: #171714; transform: rotate(-9deg); }
.faq-hero__tile--two { right: 5%; bottom: 7%; color: #171714; background-color: #e6cf58; transform: rotate(8deg); }
.faq-hero__spark { position: absolute; top: 4%; right: 7%; color: #b69e34; font-size: 44px; }
.faq-section--paper { background-color: #fffdf7; }
.faq-section--ink { color: #f5f0e2; background-color: #171714; }
.faq-section--sand { background-color: #e9e2d1; }
.faq-section--gold { background-color: #e6cf58; }
.faq-section--split > .faq-reveal { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 8vw, 128px); align-items: start; }
.faq-section--external { color: #171714; }
.faq-section__heading { max-width: 620px; }
.faq-section__heading h2, .faq-contact__intro h2 { margin: 0; max-width: 630px; font-size: clamp(32px, 4.1vw, 56px); font-weight: 800; letter-spacing: -.045em; line-height: 1.04; text-wrap: balance; text-transform: uppercase; }
.faq-section--ink .faq-kicker { color: #d6c978; }
.faq-answer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 54px; }
.faq-answer-card { min-height: 240px; padding: clamp(24px, 3vw, 42px); background-color: #f4f0e7; }
.faq-answer-card--gold { background-color: #e6cf58; }
.faq-answer-card__index { display: block; margin-bottom: 30px; color: #82794e; font-size: 12px; font-weight: 700; letter-spacing: .16em; }
.faq-answer-card h3, .faq-external-note h3 { margin: 0 0 12px; font-size: 21px; letter-spacing: -.02em; }
.faq-answer-card p, .faq-prose p, .faq-criteria p, .faq-contact__intro > p, .faq-external-note p { margin: 0; color: #5c5a52; font-family: "Involve", Arial, sans-serif; font-size: 16px; line-height: 1.7; }
.faq-section--ink .faq-prose p { color: #d6d2c7; }
.faq-prose { max-width: 670px; }
.faq-prose p + p { margin-top: 20px; }
.faq-text-link { display: inline-flex; align-items: center; gap: 14px; margin-top: 28px; color: #171714; font-weight: 700; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.faq-section--ink .faq-text-link { color: #e6cf58; }
.faq-section--gold .faq-text-link { color: #171714; }
.faq-criteria p { margin-bottom: 22px; }
.faq-criteria ul { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.faq-criteria li { display: flex; align-items: baseline; gap: 20px; padding: 17px 0; border-bottom: 1px solid rgb(23 23 20 / 22%); font-size: clamp(16px, 1.7vw, 20px); font-weight: 650; }
.faq-criteria li span { color: #746a3a; font-size: 11px; letter-spacing: .12em; }
.faq-external { padding-top: clamp(58px, 7vw, 105px); padding-bottom: clamp(58px, 7vw, 105px); }
.faq-external > .faq-reveal { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 7vw, 100px); align-items: center; }
.faq-external-note { display: grid; grid-template-columns: 58px 1fr; gap: 24px; align-items: start; padding: 32px; background-color: #f4f0e7; }
.faq-external-note__icon { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 50%; color: #171714; background-color: #e6cf58; font-size: 22px; }
.faq-contact > .faq-reveal { display: grid; grid-template-columns: minmax(0, .9fr) minmax(320px, .8fr); gap: clamp(40px, 9vw, 150px); }
.faq-contact__intro > p { max-width: 460px; margin-top: 22px; }
.faq-contact__email { display: inline-block; margin-top: 24px; color: #171714; font-weight: 700; text-underline-offset: 5px; }
.faq-form { display: grid; gap: 8px; }
.faq-form label { margin-top: 11px; font-size: 13px; font-weight: 700; }
.faq-form input, .faq-form textarea { width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid #c9c4b6; border-radius: 0; color: #171714; background-color: #fff; font: 16px/1.45 "Involve", Arial, sans-serif; }
.faq-form textarea { min-height: 124px; resize: vertical; }
.faq-form input.faq-field--invalid, .faq-form textarea.faq-field--invalid { border-color: #a3291e; }
.faq-error { min-height: 18px; color: #a3291e; font-size: 13px; line-height: 1.4; }
.faq-form .faq-button { justify-self: start; margin-top: 12px; }
.faq-form__status { min-height: 20px; margin: 4px 0 0; color: #5c5a52; font-size: 13px; }
.faq-reveal { opacity: 1; transform: none; }
.faq-reveal--pending { opacity: 0; transform: translateY(18px); transition: opacity 520ms ease, transform 520ms ease; }
.faq-reveal--pending.faq-reveal--settled { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { .faq-reveal--pending, .faq-reveal--pending.faq-reveal--settled { opacity: 1; transform: none; transition: none; } .faq-button { transition: none; } }
@media (max-width: 800px) {
  .faq-section { padding: 68px 24px; }
  .faq-hero { padding-top: 66px; padding-bottom: 64px; }
  .faq-hero > .faq-reveal, .faq-section--split > .faq-reveal, .faq-external > .faq-reveal, .faq-contact > .faq-reveal { grid-template-columns: 1fr; gap: 34px; }
  .faq-hero__art { width: min(100%, 390px); min-height: 270px; margin: 0 auto; }
  .faq-hero h1 { font-size: clamp(40px, 12vw, 64px); }
  .faq-section__heading h2, .faq-contact__intro h2 { font-size: clamp(31px, 9vw, 46px); }
  .faq-answer-grid { grid-template-columns: 1fr; margin-top: 34px; }
  .faq-answer-card { min-height: 0; }
  .faq-contact > .faq-reveal { gap: 28px; }
}
@media (max-width: 390px) {
  .faq-section { padding-inline: 19px; }
  .faq-hero__art { min-height: 230px; }
  .faq-external-note { grid-template-columns: 1fr; gap: 16px; padding: 23px; }
  .faq-button { max-width: 100%; gap: 14px; }
}
