/* Plan quiz. Without JS the first result stays visible and the questions are hidden by default only once JS runs. */
.opq__head { text-align: center; max-width: 640px; margin: 0 auto 32px; }
.opq__eyebrow { display: block; font: 500 13px/1 var(--primary-font), sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #E8450A; margin-bottom: 14px; }
.opq__head h2 { margin: 0 0 12px; } .opq__head p { margin: 0; }
.opq__card { max-width: 760px; margin: 0 auto; padding: 32px; border-radius: 24px; background: #121212; color: #F4F1EE; box-shadow: 0 30px 60px rgba(17, 13, 10, .18); }
.opq__q h3, .opq__res h3 { margin: 0 0 18px; font-size: 22px; color: inherit; }
.opq__opts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.opq__opts button { padding: 16px 18px; border-radius: 14px; border: 1px solid #272727; background: #1b1b1b; color: #F4F1EE; font-weight: 600; text-align: left; cursor: pointer; transition: border-color .2s, transform .2s; }
.opq__opts button:hover, .opq__opts button:focus-visible { border-color: #FF7A1A; transform: translateY(-1px); outline: none; }
.opq__tag { display: block; font: 500 12px/1 var(--primary-font), sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #FF7A1A; margin-bottom: 8px; }
.opq__res p { margin: 0 0 12px; color: #CFC8C1; } .opq__price strong { color: #fff; font-size: 24px; }
.opq__cta { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-top: 18px; }
.opq__btn { display: inline-block; padding: 14px 24px; border-radius: 999px; background: #FF7A1A; color: #fff; font-weight: 700; text-decoration: none; }
.opq__again { border: 0; background: transparent; color: #A59E97; text-decoration: underline; cursor: pointer; }
.opq__note { margin: 24px 0 0; font-size: 13px; color: #A59E97; }
.opq-js .opq__res { display: none; } .opq-js .opq__res.is-on { display: block; animation: opq-in .4s ease; }
@keyframes opq-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 575px) { .opq__card { padding: 22px; } .opq__opts { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .opq-js .opq__res.is-on { animation: none; } }
