/* LOUNJ quiz (modal + inline) */
.lounj-quizmodal { position: fixed; inset: 0; z-index: 950; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.lounj-quizmodal[hidden] { display: none; }
.lounj-quizmodal__backdrop { position: absolute; inset: 0; background: rgba(23,23,23,.6); opacity: 0; transition: opacity 200ms ease; }
.lounj-quizmodal__panel { position: relative; width: min(680px, 100%); max-height: min(92vh, 860px); overflow-y: auto; background: #fff; border-radius: 24px; box-shadow: 0 30px 80px rgba(0,0,0,.35); transform: translateY(16px) scale(.98); opacity: 0; transition: transform 220ms cubic-bezier(.2,.8,.2,1), opacity 200ms ease; }
.lounj-quizmodal.is-open .lounj-quizmodal__backdrop { opacity: 1; }
.lounj-quizmodal.is-open .lounj-quizmodal__panel { transform: none; opacity: 1; }
.lounj-quizmodal__close { position: absolute; top: .9rem; right: .9rem; z-index: 2; background: #F7F4EF; border: 0; border-radius: 50%; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: #171717; }
.lounj-quizmodal__close:hover { background: #E54F3D; color: #fff; }
body.lounj-quiz-open { overflow: hidden; }

.lounj-quiz { padding: clamp(1.5rem, 4vw, 2.75rem); font-family: "Inter", system-ui, sans-serif; color: #171717; }
.lounj-quiz--inline { background: #fff; border: 1px solid #E9E2D8; border-radius: 24px; box-shadow: 0 1px 2px rgba(23,23,23,.06), 0 8px 24px rgba(23,23,23,.08); max-width: 760px; margin: 0 auto; }
.lounj-quiz h2 { font-family: "Fraunces", Georgia, serif; font-weight: 500; font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.15; margin: .25rem 0 .75rem; letter-spacing: -.01em; outline: none; }
.lounj-quiz .lounj-eyebrow { color: #E54F3D; font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 .5rem; }
.lounj-quiz__meta { list-style: none; margin: 0 0 1.5rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; color: #5F5B57; font-size: .9rem; }
.lounj-quiz__meta li::before { content: "\2713"; color: #E54F3D; font-weight: 700; margin-right: .4rem; }
.lounj-quiz__progress { display: flex; align-items: center; gap: .75rem; font-size: .8rem; font-weight: 600; color: #5F5B57; margin-bottom: 1rem; }
.lounj-quiz__bar { flex: 1; height: 6px; background: #F0EBE4; border-radius: 999px; overflow: hidden; }
.lounj-quiz__bar i { display: block; height: 100%; background: #E54F3D; border-radius: 999px; transition: width 300ms ease; }
.lounj-quiz__help { margin: -.25rem 0 1rem; color: #5F5B57; font-size: .95rem; }
.lounj-quiz__opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.lounj-quiz__opt { text-align: left; background: #fff; border: 2px solid #E9E2D8; border-radius: 16px; padding: 1rem 1.1rem; cursor: pointer; font: inherit; color: inherit; display: flex; flex-direction: column; gap: .2rem; transition: border-color 150ms ease, background 150ms ease, transform 150ms ease; }
.lounj-quiz__opt strong { font-size: 1rem; font-weight: 600; }
.lounj-quiz__opt span { font-size: .85rem; color: #5F5B57; }
.lounj-quiz__opt:hover { border-color: #171717; transform: translateY(-1px); }
.lounj-quiz__opt.is-on { border-color: #E54F3D; background: #FFF4EF; }
.lounj-quiz__foot { margin-top: 1.25rem; display: flex; justify-content: space-between; align-items: center; }
.lounj-quiz__back { background: none; border: 0; color: #5F5B57; font: inherit; font-size: .9rem; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; padding: 0; }
.lounj-quiz__back:hover { color: #E54F3D; }
.lounj-quiz__loading { text-align: center; padding: 3rem 0; color: #5F5B57; }
.lounj-quiz__spinner { display: block; width: 36px; height: 36px; margin: 0 auto 1rem; border-radius: 50%; border: 3px solid #F0EBE4; border-top-color: #E54F3D; animation: lounj-spin 800ms linear infinite; }
@keyframes lounj-spin { to { transform: rotate(360deg); } }
.lounj-quiz__error { color: #B3261E; font-weight: 600; }
.lounj-quiz__choice { display: inline-block; background: #FFDDBF; color: #171717; font-weight: 700; padding: .4rem .9rem; border-radius: 999px; margin: 0 0 1.25rem; }
.lounj-quiz__card { display: grid; grid-template-columns: 96px 1fr; gap: 1rem; align-items: center; text-decoration: none; color: inherit; border: 1px solid #E9E2D8; border-radius: 16px; padding: .9rem; background: #fff; transition: border-color 150ms ease, box-shadow 150ms ease; }
.lounj-quiz__card:hover { border-color: #171717; box-shadow: 0 8px 24px rgba(23,23,23,.08); }
.lounj-quiz__card.is-primary { grid-template-columns: 140px 1fr; background: #F7F4EF; border-color: transparent; padding: 1.1rem; }
.lounj-quiz__card img, .lounj-quiz__noimg { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; background: #F0EBE4; display: block; }
.lounj-quiz__cardbody { display: flex; flex-direction: column; gap: .2rem; }
.lounj-quiz__cardbody strong { font-size: 1.05rem; }
.lounj-quiz__cardbody small { color: #5F5B57; font-size: .85rem; }
.lounj-quiz__cardbody em { font-style: normal; font-weight: 700; margin-top: .15rem; }
.lounj-quiz__cardbody .lounj-btn { margin-top: .6rem; align-self: flex-start; }
.lounj-quiz__result h3 { font-family: "Inter", system-ui, sans-serif; font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #5F5B57; margin: 1.5rem 0 .6rem; }
.lounj-quiz__why { margin: 0; padding: 0; list-style: none; }
.lounj-quiz__why li { position: relative; padding-left: 1.5rem; margin-bottom: .5rem; line-height: 1.55; font-size: .95rem; }
.lounj-quiz__why li::before { content: ""; position: absolute; left: 0; top: .45em; width: 14px; height: 14px; border-radius: 50%; background: #E54F3D url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/60% no-repeat; }
.lounj-quiz__alts { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid #F0EBE4; }
.lounj-quiz__alt h3 { margin: 0 0 .25rem; }
.lounj-quiz__altnote { margin: 0 0 .6rem; font-size: .85rem; color: #5F5B57; line-height: 1.45; }
.lounj-quiz__alts .lounj-quiz__card { grid-template-columns: 64px 1fr; padding: .7rem; }
.lounj-quiz__alts .lounj-quiz__cardbody strong { font-size: .9rem; }
@media (max-width: 640px) {
  .lounj-quiz__opts, .lounj-quiz__alts { grid-template-columns: 1fr; }
  .lounj-quiz__card.is-primary { grid-template-columns: 96px 1fr; }
  .lounj-quizmodal { padding: 0; align-items: flex-end; }
  .lounj-quizmodal__panel { border-radius: 24px 24px 0 0; max-height: 94vh; }
}
@media (prefers-reduced-motion: reduce) { .lounj-quizmodal__panel, .lounj-quizmodal__backdrop, .lounj-quiz__bar i { transition: none; } }