/* --- FARI Quick Check ------------------------------------------------------
 *
 * A thin delta on readiness.css, which this page loads first. The question card, the controls,
 * the progress bar, the gate form, and the whole page chrome are shared verbatim — that is the
 * point, since a Quick Check completer continues into the full assessment and should not feel
 * handed to a different product halfway through. Only the blocks the Quick Check invents live
 * here, all prefixed .rdyq-.
 * -------------------------------------------------------------------------- */

/* --- The finding ----------------------------------------------------------- */

.rdyq-lead { margin: 10px 0 0; color: var(--text-body); font-size: 15px; line-height: 1.65; }

.rdyq-finding { margin-top: 22px; padding: 22px; border: 1px solid var(--hairline-strong); border-radius: var(--r-lg, 14px); background: var(--canvas); }

/* Holds the free teaser first, then the real headline on unlock. The swap is the payoff, so it
   gets a beat of its own rather than snapping — the visitor should see the sentence change. */
.rdyq-finding-head { margin: 10px 0 0; font-family: var(--font-display); font-size: clamp(23px, 3.4vw, 31px); letter-spacing: -.015em; line-height: 1.2; }
@keyframes rdyq-head-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.rdyq-finding-head.is-revealed { animation: rdyq-head-in .45s cubic-bezier(.22, 1, .36, 1) both; }
@media (prefers-reduced-motion: reduce) { .rdyq-finding-head.is-revealed { animation: none; } }

/* The locked body is the REAL finding, blurred — not a fabricated stand-in. The visitor can see
   there are three points about them and roughly how long the answer is, which is what makes the
   email feel like a trade rather than a toll. Same principle, and the same blur radius, as the
   full assessment's .rdy-preview-locked. */
.rdyq-locked { margin-top: 16px; filter: blur(5px); opacity: .55; user-select: none; transition: filter .5s ease, opacity .5s ease; }
.rdyq-locked p { margin: 0; color: var(--text-body); font-size: 14.5px; line-height: 1.8; }
.rdyq-locked.is-open { filter: none; opacity: 1; user-select: auto; }

.rdyq-locked-note { margin: 14px 0 0; color: var(--text-muted); font-size: 12.5px; }

.rdyq-finding-link { display: inline-block; margin-top: 14px; color: var(--accent-blue-link); font-size: 13.5px; text-decoration: none; }
.rdyq-finding-link:hover { text-decoration: underline; }

/* Says out loud that there is no score and why. The instrument's credibility rests on never
   claiming more than it measured (READINESS.md), and a result page with no number invites the
   assumption that one was withheld — so the absence is explained rather than left to look coy. */
.rdyq-noscore { margin: 20px 0 0; padding-left: 14px; border-left: 2px solid var(--hairline-strong); color: var(--text-muted); font-size: 13px; line-height: 1.65; }

/* --- Gate ------------------------------------------------------------------ */

/* The Quick Check gate has no report cover to show, so it is a single column of copy beside the
   form rather than the full assessment's two-column visual block. */
.rdyq-gate-sub { margin: 0 0 16px; color: var(--text-body); font-size: 14px; line-height: 1.6; }

/* --- Upgrade --------------------------------------------------------------- */

/* Replaces the gate in place after unlock. Ember-tinted rather than plain surface: it is the one
   action on the page at this point, and it should not read as another content card. */
.rdyq-upgrade { margin-top: 18px; padding: clamp(22px, 4vw, 34px); border: 1px solid color-mix(in srgb, var(--accent-ember) 34%, var(--hairline-strong)); border-radius: var(--r-xl); background: linear-gradient(180deg, color-mix(in srgb, var(--accent-ember) 7%, var(--surface)), var(--surface)); animation: rdy-card-in .4s cubic-bezier(.22, 1, .36, 1) both; }
.rdyq-upgrade h3 { margin: 6px 0 12px; font-family: var(--font-display); font-size: clamp(23px, 3.4vw, 30px); letter-spacing: -.015em; line-height: 1.22; }
.rdyq-upgrade > p { margin: 0; color: var(--text-body); font-size: 14.5px; line-height: 1.7; }

/* Twelve segments, six lit: the progress claim made visible. This is the endowed-progress
   mechanic the whole Quick Check is built around, so it is a picture and not only a sentence. */
.rdyq-upgrade-meter { display: flex; gap: 4px; height: 8px; margin: 20px 0 14px; }
.rdyq-upgrade-meter i { flex: 1; border-radius: var(--r-pill); background: var(--hairline-strong); }
.rdyq-upgrade-meter i.on { background: var(--accent-ember); }

.rdyq-upgrade-carry { margin: 0 0 20px; color: var(--text-muted); font-size: 13px; line-height: 1.6; }

.rdyq-upgrade-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.rdyq-upgrade-min { color: var(--text-muted); font-size: 12.5px; }

/* --- Secondary route out of the hero ---------------------------------------- */

/* The full assessment, offered quietly beside the primary action for the visitor who arrived
   already willing to spend five minutes. Quiet on purpose: this page's whole argument is that
   ninety seconds is enough to start. */
.rdy-fulllink { color: var(--text-muted); font-size: 13.5px; text-decoration: none; }
.rdy-fulllink:hover { color: var(--accent-blue-link); text-decoration: underline; }

/* --- Responsive ------------------------------------------------------------ */

@media (max-width: 720px) {
  .rdyq-finding { padding: 18px; }
  .rdyq-upgrade-actions .service-button { width: 100%; }
  .rdyq-upgrade-min { width: 100%; text-align: center; }
}
