/** * Public try-before-signup quiz (pages/try.php) */ .rs-try-page { background: #fff; } .rs-try-main { max-width: 40rem; margin: 0 auto; /* Nav clearance: .rs-landing on (index_style.css) */ padding: clamp(0.75rem, 2.5vw, 1.25rem) 1.25rem 3rem; } .rs-try-hero { text-align: center; margin-bottom: 1.75rem; } .rs-try-hero__badge { display: inline-block; margin: 0 0 0.75rem; padding: 0.25rem 0.65rem; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: #c2410c; background: #fff7ed; border-radius: 999px; } .rs-try-hero h1 { margin: 0 0 0.65rem; font-size: clamp(1.5rem, 4vw, 2rem); color: #0f172a; } .rs-try-hero__lead { margin: 0; color: #475569; line-height: 1.55; } .rs-try-quiz { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 1.25rem; box-shadow: 0 8px 28px rgba(15, 23, 42, 0.06); } .rs-try-progress { height: 6px; background: #f1f5f9; border-radius: 999px; overflow: hidden; margin-bottom: 1rem; } .rs-try-progress__bar { height: 100%; width: 0; background: linear-gradient(90deg, #ea580c, #f97316); transition: width 0.25s ease; } .rs-try-counter { margin: 0 0 1rem; font-size: 0.875rem; font-weight: 600; color: #64748b; } .rs-try-q__text { margin: 0 0 1rem; font-size: 1.05rem; line-height: 1.45; color: #0f172a; } .rs-try-q__opts { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.65rem; } .rs-try-opt { display: flex; align-items: flex-start; gap: 0.75rem; width: 100%; text-align: left; padding: 0.85rem 1rem; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; cursor: pointer; font: inherit; color: #334155; transition: border-color 0.15s, background 0.15s; } .rs-try-opt:hover:not(:disabled) { border-color: #fed7aa; background: #fff7ed; } .rs-try-opt:disabled { cursor: default; } .rs-try-opt.is-correct { border-color: #16a34a; background: #f0fdf4; } .rs-try-opt.is-wrong { border-color: #dc2626; background: #fef2f2; } .rs-try-opt__letter { display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; flex-shrink: 0; font-size: 0.75rem; font-weight: 700; color: #c2410c; background: #fff7ed; border-radius: 6px; } .rs-try-feedback { margin: 1rem 0 0; padding: 0.85rem 1rem; border-radius: 10px; font-size: 0.9rem; line-height: 1.5; } .rs-try-feedback.is-ok { background: #f0fdf4; color: #166534; } .rs-try-feedback.is-miss { background: #fff7ed; color: #9a3412; } .rs-try-actions { margin-top: 1.25rem; } .rs-try-actions .rs-btn-main { width: 100%; min-height: 48px; } .rs-try-result { text-align: center; padding: 1rem 0 0.5rem; } .rs-try-result__score { font-size: 1.75rem; font-weight: 800; color: #ea580c; margin: 0 0 0.5rem; } .rs-try-result__lead { color: #475569; margin: 0 0 1.25rem; } .rs-try-result__cta { display: flex; flex-direction: column; gap: 0.75rem; } .rs-try-result__cta .rs-btn-main, .rs-try-result__cta .rs-btn-secondary { width: 100%; justify-content: center; min-height: 48px; }