/* Foco Mode — Quiz Funnel
   Espelha src/styles/pre-purchase.css (escopo .fq-*).
   Tokens de cor reusam os da landing; novos tokens declarados em .fq-root. */

.fq-root{
  position:fixed; inset:0; z-index:2000;
  /* App-matching color tokens */
  --fq-bg-0:#0a0c16; --fq-bg-1:#0E1A2E; --fq-bg-card:#0E1A2E; --fq-bg-card-2:#15243C;
  --fq-line:rgba(255,255,255,.08); --fq-line-2:rgba(255,255,255,.12);
  --fq-ink-0:#ffffff; --fq-ink-1:rgba(233,230,226,.82); --fq-ink-2:rgba(255,255,255,.55); --fq-ink-3:rgba(255,255,255,.35);
  --fq-cyan:#2BB5C4; --fq-cyan-2:#56dbe6; --fq-cyan-deep:#2E8E91;
  --fq-info:#3299c2; --fq-info-light:#78c7ff;
  --fq-orange:#e35b2e; --fq-orange-2:#f97316; --fq-orange-deep:#B8551E;
  --fq-amber:#ec9e32; --fq-amber-light:#fbbf24;
  --fq-ember:#e35b2e; --fq-ember-light:#f97316;
  --fq-cream:#F6F0E8;
  --fq-green:#3BB58A;
  --fq-purple:#4353cb; --fq-purple-deep:#384a94;
  --fq-danger:#E25555;
  --fq-glass-bg:
    radial-gradient(circle at 16% 10%, rgba(255,255,255,.075) 0%, transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.052) 0%, rgba(255,255,255,.024) 100%);
  --fq-glass-bg-strong:
    radial-gradient(circle at 16% 10%, rgba(255,255,255,.10) 0%, transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.068) 0%, rgba(255,255,255,.032) 100%);
  --fq-glass-bg-warm:
    radial-gradient(circle at 18% 12%, rgba(236,158,50,.13) 0%, transparent 30%),
    radial-gradient(circle at 84% 100%, rgba(227,91,46,.12) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.050) 0%, rgba(255,255,255,.022) 100%);
  --fq-glass-bg-cool:
    radial-gradient(circle at 16% 12%, rgba(86,219,230,.13) 0%, transparent 30%),
    radial-gradient(circle at 86% 100%, rgba(67,83,203,.10) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.052) 0%, rgba(255,255,255,.024) 100%);
  --fq-glass-border:rgba(255,255,255,.10);
  --fq-glass-border-strong:rgba(255,255,255,.14);
  --fq-glass-border-warm:rgba(236,158,50,.16);
  --fq-glass-border-cool:rgba(86,219,230,.17);
  --fq-glass-shadow:0 14px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06);
  --fq-glass-shadow-soft:0 8px 18px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
  --fq-glass-blur:blur(16px) saturate(1.06);

  /* Atmospheric mesh background — neutral mode (default, intro/quiz/identity/symptoms/diagnosis) */
  background:
    radial-gradient(circle at 18% 14%,  rgba(43,181,196,.20)  0%, rgba(43,181,196,.10)  12%, transparent 34%),
    radial-gradient(circle at 82% 16%,  rgba(38,142,186,.17)  0%, rgba(38,142,186,.08)  14%, transparent 32%),
    radial-gradient(ellipse 72% 34% at 50% 22%, rgba(47,170,198,.09) 0%, transparent 58%),
    radial-gradient(circle at 26% 34%,  rgba(67,83,203,.14)   0%, transparent 34%),
    radial-gradient(circle at 78% 30%,  rgba(56,74,148,.11)   0%, transparent 30%),
    radial-gradient(ellipse 90% 44% at 50% 100%, rgba(236,158,50,.10) 0%, transparent 62%),
    radial-gradient(circle at 50% 82%,  rgba(227,91,46,.12)   0%, transparent 38%),
    linear-gradient(180deg, #0d1126 0%, #0c1023 18%, #0b0e1d 42%, #0a0c16 64%, #0a0c16 100%);
  transition:background 1s ease;

  color:var(--fq-ink-0); font-family:'Inter', system-ui, sans-serif;
  display:none; flex-direction:column; overflow:hidden;
  -webkit-font-smoothing:antialiased;
}
.fq-root.is-open{ display:flex; }
body.fq-locked{ overflow:hidden; }

/* Sparse dust dots (digital stars) */
.fq-root::before{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.90) 0.7px, transparent 1px),
    radial-gradient(circle at 76% 12%, rgba(255,255,255,.55) 0.6px, transparent 0.9px),
    radial-gradient(circle at 84% 44%, rgba(255,255,255,.42) 0.8px, transparent 1px),
    radial-gradient(circle at 30% 70%, rgba(255,255,255,.45) 0.7px, transparent 1px),
    radial-gradient(circle at 66% 84%, rgba(255,255,255,.38) 0.7px, transparent 1px),
    radial-gradient(circle at 8% 92%,  rgba(255,255,255,.42) 0.6px, transparent 0.9px),
    radial-gradient(circle at 92% 78%, rgba(255,255,255,.40) 0.7px, transparent 1px);
  opacity:.42;
}
/* SVG fTurbulence-like grain — fine micro-texture across the whole shell */
.fq-root::after{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='256' height='256'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='256' height='256' filter='url(%23n)' opacity='1'/></svg>");
  background-repeat:repeat;
  -webkit-mask-image:radial-gradient(ellipse 90% 80% at 50% 50%, black 40%, transparent 100%);
          mask-image:radial-gradient(ellipse 90% 80% at 50% 50%, black 40%, transparent 100%);
  opacity:.06; mix-blend-mode:overlay;
}
/* Pain mode — warm/ember atmosphere */
.fq-root.is-mode-pain{
  background:
    radial-gradient(circle at 18% 14%, rgba(227,91,46,.24)  0%, rgba(227,91,46,.12)  12%, transparent 34%),
    radial-gradient(circle at 82% 16%, rgba(236,158,50,.14) 0%, rgba(236,158,50,.08) 14%, transparent 32%),
    radial-gradient(ellipse 78% 32% at 50% 22%, rgba(176,78,44,.14) 0%, transparent 58%),
    radial-gradient(circle at 70% 60%, rgba(176,78,44,.16) 0%, transparent 32%),
    radial-gradient(ellipse 90% 44% at 50% 100%, rgba(176,78,44,.28) 0%, transparent 62%),
    linear-gradient(180deg, #1d1118 0%, #1a0f15 18%, #150d12 46%, #0c0a10 70%, #0a0c16 100%);
}
/* Solution mode — cool/cyan atmosphere */
.fq-root.is-mode-solution{
  background:
    radial-gradient(circle at 16% 12%, rgba(86,219,230,.24)  0%, rgba(86,219,230,.12)  14%, transparent 34%),
    radial-gradient(circle at 82% 16%, rgba(120,199,255,.18) 0%, rgba(120,199,255,.08) 16%, transparent 34%),
    radial-gradient(ellipse 78% 34% at 50% 20%, rgba(88,208,228,.12) 0%, transparent 58%),
    radial-gradient(circle at 24% 76%, rgba(88,172,230,.10)  0%, transparent 30%),
    radial-gradient(ellipse 90% 42% at 50% 100%, rgba(71,148,210,.16) 0%, transparent 58%),
    linear-gradient(180deg, #0f1a2c 0%, #0e1928 18%, #0c1422 44%, #0a0f1c 72%, #0a0c16 100%);
}

/* ──────────── Header ──────────── */
.fq-header{
  position:absolute; top:0; left:0; right:0; z-index:5;
  padding:10px 12px;
  background:transparent;
  border-bottom:0;
  display:flex; align-items:center; gap:14px;
  pointer-events:none;
}
.fq-back, .fq-close{
  width:34px; height:34px; border-radius:999px;
  background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.07);
  color:#C8D4E3; display:grid; place-items:center; cursor:pointer; flex-shrink:0;
  backdrop-filter:blur(14px) saturate(1.06); -webkit-backdrop-filter:blur(14px) saturate(1.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:background .15s, border-color .15s, transform .15s;
  pointer-events:auto;
}
.fq-back:hover, .fq-close:hover{ background:var(--fq-glass-bg-strong); border-color:rgba(255,255,255,.18); }
.fq-back:hover{ transform:translateX(-1px); }
.fq-back[disabled]{ opacity:0; visibility:hidden; cursor:default; }
.fq-progress-wrap{ flex:1; height:4px; background:rgba(255,255,255,.055); border-radius:999px; overflow:hidden; pointer-events:none; }
.fq-progress-bar{
  height:100%;
  background:linear-gradient(90deg, var(--fq-amber) 0%, var(--fq-orange) 50%, var(--fq-ember) 100%);
  border-radius:999px;
  transition:width .35s ease;
  box-shadow:0 0 12px rgba(236,158,50,.28);
}
.fq-step-counter{
  font-family:'JetBrains Mono', monospace;
  font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--fq-ink-2); flex-shrink:0;
}
.fq-root:not(.is-quiz-chrome) .fq-progress-wrap,
.fq-root:not(.is-quiz-chrome) .fq-step-counter{ display:none; }
.fq-root:not(.is-quiz-chrome) .fq-header{ justify-content:space-between; }
.fq-root.is-quiz-chrome .fq-header{
  background:linear-gradient(180deg, rgba(5,11,23,.44), rgba(5,11,23,.12));
  backdrop-filter:blur(14px) saturate(1.05); -webkit-backdrop-filter:blur(14px) saturate(1.05);
}
.fq-root.is-quiz-chrome .fq-back,
.fq-root.is-quiz-chrome .fq-close{
  background:rgba(255,255,255,.028);
  border-color:rgba(255,255,255,.055);
}

/* ──────────── Body ──────────── */
.fq-body{
  flex:1; overflow-y:auto; overflow-x:hidden;
  padding:58px 20px 130px;
  -webkit-overflow-scrolling:touch;
  position:relative; z-index:1;
  scrollbar-width:none;
}
.fq-body::-webkit-scrollbar{ display:none; }
.fq-root.is-step-intro .fq-body,
.fq-root.is-step-quiz .fq-body,
.fq-root.is-step-loading .fq-body,
.fq-root.is-step-identity .fq-body{
  overflow-y:hidden;
}
.fq-root:not(.is-quiz-chrome) .fq-body{ padding-top:42px; }
.fq-root.is-step-intro .fq-body{ padding-top:56px; }
.fq-step{
  max-width:540px; margin:0 auto;
  position:relative;
}
.fq-step[data-step="quiz"]{
  max-width:480px;
  min-height:calc(100dvh - 210px);
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding-top:28px;
}
.fq-step[data-step="intro"]{
  min-height:calc(100dvh - 210px);
  display:flex;
  align-items:center;
  justify-content:center;
}
/* Footer slot transition: only fades the inner button block */
.fq-footer-inner{ transition:opacity .16s ease; }
.fq-footer-inner.is-leaving{ opacity:0; }

/* Step transitions — Framer-equivalent: x + opacity + scale + blur, 420ms, [0.22,1,0.36,1] */
.fq-step.is-entering-fwd{ animation:fq-step-in-fwd .42s cubic-bezier(0.22, 1, 0.36, 1) both; will-change:transform, opacity, filter; }
.fq-step.is-leaving-fwd{
  animation:fq-step-out-fwd .28s cubic-bezier(0.55, 0, 0.7, 0.2) both;
  position:absolute; top:0; left:0; right:0; pointer-events:none;
  padding:0 20px; will-change:transform, opacity, filter;
}
.fq-step.is-entering-back{ animation:fq-step-in-back .42s cubic-bezier(0.22, 1, 0.36, 1) both; will-change:transform, opacity, filter; }
.fq-step.is-leaving-back{
  animation:fq-step-out-back .28s cubic-bezier(0.55, 0, 0.7, 0.2) both;
  position:absolute; top:0; left:0; right:0; pointer-events:none;
  padding:0 20px; will-change:transform, opacity, filter;
}
@keyframes fq-step-in-fwd{
  from{ opacity:0; transform:translate3d(44px, 0, 0) scale(0.986); filter:blur(8px); }
  to  { opacity:1; transform:translate3d(0, 0, 0) scale(1);          filter:blur(0); }
}
@keyframes fq-step-out-fwd{
  from{ opacity:1; transform:translate3d(0, 0, 0) scale(1);           filter:blur(0); }
  to  { opacity:0; transform:translate3d(-36px, 0, 0) scale(0.992);   filter:blur(6px); }
}
@keyframes fq-step-in-back{
  from{ opacity:0; transform:translate3d(-44px, 0, 0) scale(0.986); filter:blur(8px); }
  to  { opacity:1; transform:translate3d(0, 0, 0) scale(1);           filter:blur(0); }
}
@keyframes fq-step-out-back{
  from{ opacity:1; transform:translate3d(0, 0, 0) scale(1);           filter:blur(0); }
  to  { opacity:0; transform:translate3d(36px, 0, 0) scale(0.992);    filter:blur(6px); }
}

/* ──────────── Type ──────────── */
.fq-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'JetBrains Mono', monospace;
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--fq-cyan);
  padding:5px 11px; border-radius:999px;
  background:rgba(91,197,199,.08); border:1px solid rgba(91,197,199,.22);
  margin-bottom:18px;
}
.fq-eyebrow .fq-dot{ width:5px; height:5px; border-radius:50%; background:var(--fq-cyan); box-shadow:0 0 10px var(--fq-cyan); }
.fq-eyebrow.warm{ color:var(--fq-orange-2); background:rgba(233,122,60,.08); border-color:rgba(233,122,60,.22); }
.fq-eyebrow.warm .fq-dot{ background:var(--fq-orange-2); box-shadow:0 0 10px var(--fq-orange); }

.fq-h1{ font-size:clamp(28px, 7vw, 38px); font-weight:700; letter-spacing:-.025em; line-height:1.08; text-wrap:balance; margin-bottom:14px; }
.fq-h2{ font-size:clamp(22px, 5vw, 28px); font-weight:700; letter-spacing:-.02em; line-height:1.15; text-wrap:balance; margin-bottom:10px; }
.fq-lead{ font-size:16px; color:var(--fq-ink-1); line-height:1.55; text-wrap:pretty; }
.fq-meta{ font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.14em; color:var(--fq-ink-3); text-transform:uppercase; margin-bottom:14px; }

/* ──────────── Foco brand mini logo (intro + carousels) ──────────── */
.fq-foco-mini{
  display:flex; flex-direction:column; align-items:center; gap:2px;
  font-family:'Inter', sans-serif; font-weight:800; letter-spacing:.04em;
}
.fq-foco-mini-top{ font-size:13px; color:var(--fq-ink-1); }
.fq-foco-mini-bottom{ display:flex; align-items:center; gap:6px; font-size:13px; color:var(--fq-ink-1); }
.fq-foco-toggle{
  width:34px; height:18px; border-radius:999px; padding:2px;
  display:flex; align-items:center;
  transition:background .35s ease, box-shadow .35s ease;
}
.fq-foco-toggle.is-off{
  background:linear-gradient(180deg, var(--fq-orange-2) 0%, var(--fq-orange) 100%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.25), 0 4px 14px -6px rgba(233,122,60,.6);
}
.fq-foco-toggle.is-on{
  background:linear-gradient(180deg, var(--fq-cyan-2) 0%, var(--fq-cyan-deep) 100%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.25), 0 4px 14px -6px rgba(91,197,199,.6), 0 0 16px rgba(91,197,199,.3);
  justify-content:flex-end;
}
.fq-foco-toggle-knob{
  width:14px; height:14px; border-radius:50%;
  background:radial-gradient(circle at 40% 40%, #fff 0%, #C8D4E0 100%);
  box-shadow:0 1px 2px rgba(0,0,0,.3);
}

/* ──────────── INTRO ──────────── */
.fq-intro{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding-top:8px;
  order:1;
}
.fq-intro-particles{
  position:absolute; inset:0; pointer-events:none; z-index:0;
}
.fq-particle{
  position:absolute; width:5px; height:5px; border-radius:50%;
  background:radial-gradient(circle, rgba(91,197,199,.7) 0%, rgba(91,197,199,0) 70%);
  opacity:0;
  animation:fq-float-particle linear infinite;
}
@keyframes fq-float-particle{
  0%   { transform:translateY(0) scale(0.6); opacity:0; }
  20%  { opacity:1; }
  80%  { opacity:1; }
  100% { transform:translateY(-180px) scale(1.4); opacity:0; }
}
.fq-intro-content{
  position:relative; z-index:1;
  width:100%;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:24px;
  transform:translateY(-4vh);
}
.fq-intro-logo-card{
  position:relative;
  order:2;
  margin:0 auto;
  padding:16px 20px;
  border-radius:22px;
  background:
    radial-gradient(ellipse at top left, rgba(86,219,230,.18) 0%, transparent 60%),
    rgba(255,255,255,.02);
  border:1px solid rgba(91,197,199,.22);
  backdrop-filter:blur(28px) saturate(1.15); -webkit-backdrop-filter:blur(28px) saturate(1.15);
  display:inline-flex; flex-direction:column; align-items:center; gap:10px;
  box-shadow:
    0 16px 36px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 0 16px rgba(91,197,199,.06);
  overflow:hidden;
}
.fq-intro-logo-card::before{
  content:''; position:absolute; top:50%; left:50%;
  width:100px; height:100px; border-radius:50%;
  transform:translate(-50%, -46%);
  background:radial-gradient(circle, rgba(86,219,230,.26) 0%, rgba(207,151,63,.12) 45%, transparent 80%);
  filter:blur(14px);
  z-index:0; pointer-events:none;
}
.fq-intro-logo-card::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  border-radius:inherit;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='256' height='256'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='256' height='256' filter='url(%23n)' opacity='1'/></svg>");
  opacity:.06; mix-blend-mode:overlay;
}
@keyframes fq-mesh-shift{
  0%   { background-position:0% 0%;     transform:scale(1); }
  50%  { background-position:50% 50%; }
  100% { background-position:100% 100%; transform:scale(1.02); }
}
.fq-brand-logo-large{
  display:flex; flex-direction:column; align-items:center; gap:3px;
  position:relative; z-index:1;
}
.fq-brand-logo-large .fq-brand-top{
  font-size:clamp(26px, 8vw, 34px); font-weight:800; letter-spacing:.08em;
  color:var(--fq-ink-0);
  margin-left:.08em;
  line-height:.95;
  text-shadow:0 0 24px rgba(86,219,230,.24);
}
.fq-brand-logo-large .fq-brand-bottom{
  display:flex; align-items:center; gap:.12em;
  font-size:clamp(26px, 8vw, 34px); font-weight:800; color:var(--fq-ink-0);
  letter-spacing:0; line-height:.95;
  text-shadow:0 0 24px rgba(86,219,230,.24);
}
.fq-brand-logo-large .fq-foco-toggle{
  width:1.6em; height:.78em; padding:0;
  margin-top:-.05em;
  background:var(--fq-cyan);
  box-shadow:0 4px 18px rgba(91,197,199,.45), inset 0 1px 3px rgba(0,0,0,.15);
}
.fq-brand-logo-large .fq-foco-toggle-knob{
  width:.58em; height:.58em;
  margin-right:.10em;
}

.fq-stars{ display:flex; align-items:center; gap:4px; color:var(--fq-cream); }
.fq-stars,
.fq-rating-text{ position:relative; z-index:1; }
.fq-rating-text{
  font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--fq-ink-2);
  letter-spacing:.04em; text-transform:lowercase;
}
.fq-intro-title{ font-size:clamp(28px, 7vw, 36px); font-weight:700; letter-spacing:-.025em; margin-bottom:12px; }
.fq-intro-sub{ font-size:16px; color:var(--fq-ink-1); line-height:1.55; max-width:420px; margin:0 auto; }

/* ──────────── QUIZ ──────────── */
.fq-quiz-kicker{
  font-family:'JetBrains Mono', monospace;
  font-size:10px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--fq-orange-2); margin:0 0 14px;
}
.fq-step[data-step="quiz"] .fq-h2{
  font-size:clamp(24px, 6.2vw, 30px);
  line-height:1.16;
  margin-bottom:0;
}
.fq-options{ display:flex; flex-direction:column; gap:10px; margin-top:22px; }
.fq-option{
  display:flex; align-items:center; gap:14px;
  width:100%; text-align:left;
  padding:16px 18px;
  background:var(--fq-glass-bg);
  border:1px solid var(--fq-glass-border); border-radius:14px;
  color:var(--fq-ink-0); font-size:15px; font-weight:500; line-height:1.4;
  cursor:pointer;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
  transition:transform .15s, border-color .15s, background .15s, box-shadow .15s;
}
.fq-option:hover{ border-color:rgba(86,219,230,.28); transform:translateX(2px); box-shadow:0 12px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08); }
.fq-option:focus-visible{ outline:2px solid var(--fq-cyan); outline-offset:2px; }
.fq-option.is-selected{
  border-color:var(--fq-cyan);
  background:
    radial-gradient(circle at 12% 50%, rgba(86,219,230,.18) 0%, transparent 28%),
    linear-gradient(180deg, rgba(86,219,230,.075) 0%, rgba(255,255,255,.03) 100%);
  box-shadow:0 0 0 1px rgba(91,197,199,.24), 0 14px 28px rgba(43,181,196,.10), inset 0 1px 0 rgba(255,255,255,.09);
}
.fq-option-num{
  width:28px; height:28px; border-radius:50%;
  background:rgba(120,160,210,.10); border:1px solid rgba(120,160,210,.22);
  color:var(--fq-ink-2);
  display:grid; place-items:center; flex-shrink:0;
  font-family:'JetBrains Mono', monospace; font-size:12px; font-weight:600;
  transition:background .15s, border-color .15s, color .15s;
}
.fq-option.is-selected .fq-option-num{
  background:var(--fq-cyan); border-color:var(--fq-cyan); color:#040912;
}

/* Decisão (Q12 — só duas alternativas) */
.fq-decision-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:24px;
}
@media (max-width:520px){ .fq-decision-grid{ grid-template-columns:1fr; } }
.fq-decision-card{
  padding:22px 18px;
  background:var(--fq-glass-bg);
  border:1px solid var(--fq-glass-border); border-radius:18px;
  cursor:pointer; text-align:center;
  transition:all .2s; position:relative;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
  overflow:hidden;
}
.fq-decision-card.is-safe{ border-color:rgba(59,181,138,.25); }
.fq-decision-card.is-danger{ border-color:rgba(226,85,85,.28); }
.fq-decision-card:hover{ transform:translateY(-2px); }
.fq-decision-card.is-selected{ box-shadow:0 0 0 2px currentColor inset; }
.fq-decision-card.is-safe.is-selected{ color:var(--fq-green); border-color:var(--fq-green); background:radial-gradient(circle at 50% 0%, rgba(59,181,138,.20), transparent 42%), var(--fq-glass-bg); }
.fq-decision-card.is-danger.is-selected{ color:var(--fq-danger); border-color:var(--fq-danger); background:radial-gradient(circle at 50% 0%, rgba(226,85,85,.20), transparent 42%), var(--fq-glass-bg); }
.fq-decision-icon{ width:42px; height:42px; border-radius:50%; margin:0 auto 12px; display:grid; place-items:center; }
.fq-decision-card.is-safe .fq-decision-icon{ background:rgba(59,181,138,.16); color:var(--fq-green); }
.fq-decision-card.is-danger .fq-decision-icon{ background:rgba(226,85,85,.18); color:var(--fq-danger); }
.fq-decision-label{ font-size:15px; font-weight:600; color:var(--fq-ink-0); margin-bottom:4px; }
.fq-decision-tag{ font-size:11px; font-family:'JetBrains Mono', monospace; letter-spacing:.16em; text-transform:uppercase; }
.fq-decision-card.is-safe .fq-decision-tag{ color:var(--fq-green); }
.fq-decision-card.is-danger .fq-decision-tag{ color:var(--fq-danger); }

/* ──────────── LOADING (anel SVG) ──────────── */
.fq-loading{
  display:flex; flex-direction:column; align-items:center; padding-top:40px;
}
.fq-load-ring{
  position:relative;
  width:160px; height:160px;
  margin-bottom:32px;
}
.fq-load-ring svg{ width:100%; height:100%; transform:rotate(-90deg); }
.fq-load-ring-track{ fill:none; stroke:rgba(120,160,210,.10); stroke-width:6; }
.fq-load-ring-progress{
  fill:none; stroke-width:6; stroke-linecap:round;
  stroke:url(#fq-ring-gradient);
  transition:stroke-dashoffset .6s cubic-bezier(0.22, 1, 0.36, 1);
  filter:drop-shadow(0 0 8px rgba(236,158,50,.4));
}
.fq-load-ring-pct{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-weight:700;
}
.fq-load-ring-num{ font-size:34px; line-height:1; letter-spacing:-.02em; color:var(--fq-ink-0); }
.fq-load-ring-pct-sym{ font-size:14px; color:var(--fq-ink-2); margin-top:2px; font-family:'JetBrains Mono', monospace; letter-spacing:.1em; }
.fq-load-stage{
  font-family:'JetBrains Mono', monospace;
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--fq-ink-2); margin-top:8px;
}

/* ──────────── IDENTITY ──────────── */
.fq-field{ margin-top:18px; }
.fq-label{ display:block; font-size:13px; color:var(--fq-ink-2); margin-bottom:8px; font-weight:500; }
.fq-input, .fq-select, .fq-textarea{
  width:100%;
  padding:14px 16px;
  background:var(--fq-glass-bg);
  border:1px solid var(--fq-glass-border);
  border-radius:12px;
  color:var(--fq-ink-0); font-size:15px; font-family:inherit;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
  transition:border-color .15s, background .15s;
}
.fq-input:focus, .fq-select:focus, .fq-textarea:focus{
  outline:none; border-color:var(--fq-cyan);
  background:var(--fq-glass-bg-strong);
  box-shadow:0 0 0 3px rgba(91,197,199,.16);
}
.fq-input::placeholder{ color:var(--fq-ink-3); }
.fq-input.is-error{ border-color:var(--fq-orange); }
.fq-error-msg{ font-size:13px; color:var(--fq-orange-2); margin-top:8px; }

/* ──────────── SYMPTOMS — 4 cards ──────────── */
.fq-alert{
  display:flex; gap:12px; align-items:flex-start;
  padding:14px 16px; margin-top:10px; margin-bottom:24px;
  background:var(--fq-glass-bg-warm);
  border:1px solid rgba(233,122,60,.22); border-left:3px solid var(--fq-orange);
  border-radius:14px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
}
.fq-alert-icon{ flex-shrink:0; color:var(--fq-orange-2); margin-top:1px; }
.fq-alert-title{ font-size:13px; font-weight:600; color:var(--fq-ink-0); margin-bottom:2px; }
.fq-alert-body{ font-size:13px; color:var(--fq-ink-1); line-height:1.45; }

.fq-symptom-card{
  margin-bottom:14px; padding:18px;
  background:var(--fq-glass-bg);
  border:1px solid var(--fq-glass-border);
  border-radius:18px;
  position:relative; overflow:hidden;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow);
}
.fq-symptom-card::before{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.52;
  background:radial-gradient(180px 100px at 0% 0%, var(--fq-symptom-glow, transparent), transparent 70%);
}
.fq-symptom-card.is-mental    { --fq-symptom-glow:rgba(91,197,199,.25);  --fq-symptom-color:var(--fq-cyan); }
.fq-symptom-card.is-physical  { --fq-symptom-glow:rgba(226,85,85,.20);   --fq-symptom-color:#FF8A8A; }
.fq-symptom-card.is-social    { --fq-symptom-glow:rgba(59,181,138,.22);  --fq-symptom-color:var(--fq-green); }
.fq-symptom-card.is-faith     { --fq-symptom-glow:rgba(245,167,98,.22);  --fq-symptom-color:var(--fq-orange-2); }
.fq-symptom-head{
  display:flex; align-items:center; gap:12px; margin-bottom:14px;
  position:relative;
}
.fq-symptom-icon{
  width:40px; height:40px; border-radius:12px;
  display:grid; place-items:center;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  color:var(--fq-symptom-color); flex-shrink:0;
}
.fq-symptom-card.is-mental    .fq-symptom-icon{ background:rgba(91,197,199,.10);  border-color:rgba(91,197,199,.25); }
.fq-symptom-card.is-physical  .fq-symptom-icon{ background:rgba(226,85,85,.10);   border-color:rgba(226,85,85,.25); }
.fq-symptom-card.is-social    .fq-symptom-icon{ background:rgba(59,181,138,.10);  border-color:rgba(59,181,138,.25); }
.fq-symptom-card.is-faith     .fq-symptom-icon{ background:rgba(245,167,98,.10);  border-color:rgba(245,167,98,.25); }
.fq-symptom-title{ font-size:15px; font-weight:600; color:var(--fq-ink-0); }
.fq-symptom-counter{ font-size:11px; color:var(--fq-ink-3); margin-left:6px; font-family:'JetBrains Mono', monospace; letter-spacing:.1em; }
.fq-symptom-desc{ font-size:12px; color:var(--fq-ink-2); margin-top:2px; }

.fq-chips{ display:flex; flex-wrap:wrap; gap:8px; position:relative; }
.fq-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 13px; border-radius:11px;
  background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.085);
  color:var(--fq-ink-1); font-size:13px; font-weight:500; cursor:pointer;
  backdrop-filter:blur(12px) saturate(1.04); -webkit-backdrop-filter:blur(12px) saturate(1.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:all .15s;
}
.fq-chip:hover{ border-color:var(--fq-symptom-color); color:var(--fq-ink-0); }
.fq-chip.is-selected{
  background:rgba(255,255,255,.06);
  border-color:var(--fq-symptom-color);
  color:var(--fq-ink-0);
  box-shadow:0 0 0 1px rgba(255,255,255,.08);
}
.fq-chip-check{ display:none; }
.fq-chip.is-selected .fq-chip-check{ display:inline-flex; color:var(--fq-symptom-color); }

.fq-symptom-counter-card{
  margin-top:8px; padding:16px 18px;
  background:var(--fq-glass-bg-cool);
  border:1px solid var(--fq-glass-border-cool); border-radius:14px;
  display:flex; align-items:center; gap:14px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
}
.fq-symptom-counter-num{
  font-size:32px; font-weight:700; color:var(--fq-cyan); line-height:1;
  font-variant-numeric:tabular-nums;
}
.fq-symptom-counter-label{ font-size:13px; color:var(--fq-ink-1); }

/* ──────────── DIAGNOSIS — score + comparison bars + markers ──────────── */
.fq-diag-context{
  font-family:'JetBrains Mono', monospace;
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--fq-ink-2); margin-bottom:10px;
}

.fq-diag-score{
  position:relative; overflow:hidden;
  text-align:center; padding:30px 22px 26px; margin-bottom:16px;
  background:
    radial-gradient(circle at 18% 12%, rgba(236,158,50,.13) 0%, transparent 28%),
    radial-gradient(circle at 84% 100%, rgba(227,91,46,.12) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.026) 100%);
  background-size:130% 130%;
  animation:fq-mesh-shift 14s ease-in-out infinite alternate;
  border:1px solid var(--fq-glass-border-warm);
  border-radius:22px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow);
}
.fq-diag-score::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  border-radius:inherit;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='256' height='256'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='256' height='256' filter='url(%23n)' opacity='1'/></svg>");
  opacity:.05; mix-blend-mode:overlay;
}
.fq-diag-num{
  font-size:64px; font-weight:800; letter-spacing:-.04em; line-height:1;
  background:linear-gradient(180deg, var(--fq-cream) 0%, var(--fq-amber) 60%, var(--fq-ember) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-variant-numeric:tabular-nums;
}
.fq-diag-num small{ font-size:22px; color:var(--fq-ink-2); font-weight:500; -webkit-text-fill-color:var(--fq-ink-2); }
.fq-diag-badge{
  display:inline-block; margin-top:14px;
  padding:6px 14px; border-radius:999px;
  font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  font-family:'JetBrains Mono', monospace;
}
.fq-diag-badge.safe     { background:rgba(59,181,138,.16); color:#7DDCB6; border:1px solid rgba(59,181,138,.32); }
.fq-diag-badge.medium   { background:rgba(236,158,50,.16); color:var(--fq-amber); border:1px solid rgba(236,158,50,.32); }
.fq-diag-badge.high     { background:rgba(227,91,46,.16); color:var(--fq-orange-2); border:1px solid rgba(227,91,46,.4); }
.fq-diag-badge.critical { background:rgba(226,85,85,.16); color:#F5A78A; border:1px solid rgba(226,85,85,.4); }
.fq-diag-summary{ margin-top:14px; font-size:14px; color:var(--fq-ink-1); line-height:1.5; }

/* Comparison bars */
.fq-compare{
  position:relative; overflow:hidden;
  padding:24px 22px; margin-bottom:16px;
  background:var(--fq-glass-bg-warm);
  border:1px solid var(--fq-glass-border-warm); border-radius:22px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow);
}
.fq-compare::after{
  content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='256' height='256'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='256' height='256' filter='url(%23n)' opacity='1'/></svg>");
  opacity:.045; mix-blend-mode:overlay;
}
.fq-compare > *{ position:relative; z-index:1; }
.fq-compare-title{ font-size:14px; font-weight:600; color:var(--fq-ink-1); text-align:center; margin-bottom:20px; letter-spacing:.04em; }
.fq-compare-stage{
  display:flex; justify-content:space-around; align-items:flex-end;
  height:170px; gap:20px; padding:0 10px;
  margin-bottom:14px;
}
.fq-compare-col{
  flex:1; min-height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
  max-width:118px; padding:10px 12px 0;
  border-radius:20px 20px 0 0;
  background:linear-gradient(180deg, rgba(255,255,255,.032) 0%, rgba(255,255,255,.010) 100%);
  border:1px solid rgba(255,255,255,.055);
  border-bottom:0;
}
.fq-compare-bar{
  width:100%; max-width:72px; border-radius:18px 18px 12px 12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12) 0%, transparent 16%),
    linear-gradient(180deg, var(--fq-bar-c1, #63a1b1) 0%, var(--fq-bar-c2, #39607a) 100%);
  transition:height 1.45s cubic-bezier(0.22, 1, 0.36, 1);
  height:0; min-height:18px;
  box-shadow:0 12px 22px var(--fq-bar-glow, rgba(57,96,122,.15)), inset 0 1px 0 rgba(255,255,255,.12);
  position:relative; overflow:hidden;
}
.fq-compare-bar::after{
  content:''; position:absolute; left:10px; right:10px; bottom:0; height:1px;
  background:rgba(255,255,255,.14);
}
.fq-compare-bar.is-user{ --fq-bar-c1:#cf973f; --fq-bar-c2:#a65f3b; --fq-bar-glow:rgba(166,95,59,.19); }
.fq-compare-foot{ display:flex; justify-content:space-around; gap:20px; padding:0 10px; }
.fq-compare-foot-col{ flex:1; text-align:center; }
.fq-compare-foot-pct{ font-size:24px; font-weight:700; line-height:1; color:var(--fq-cyan); font-variant-numeric:tabular-nums; }
.fq-compare-foot-col.is-user .fq-compare-foot-pct{ color:var(--fq-orange-2); }
.fq-compare-foot-label{ font-size:11px; color:var(--fq-ink-3); margin-top:6px; font-family:'JetBrains Mono', monospace; letter-spacing:.1em; text-transform:uppercase; }
.fq-compare-insight{ margin-top:18px; font-size:13px; color:var(--fq-ink-1); line-height:1.5; text-align:center; }

/* Markers */
.fq-markers-title{ font-size:13px; font-weight:600; color:var(--fq-ink-0); margin:24px 0 12px; display:flex; justify-content:space-between; align-items:center; }
.fq-markers-count{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--fq-ink-3); letter-spacing:.12em; text-transform:uppercase; }
.fq-marker{
  display:flex; gap:14px; align-items:flex-start;
  padding:16px 18px; margin-bottom:10px;
  background:var(--fq-glass-bg-warm); border:1px solid var(--fq-glass-border-warm);
  border-left:3px solid var(--fq-orange); border-radius:14px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
}
.fq-marker-icon{ flex-shrink:0; color:var(--fq-orange-2); margin-top:2px; }
.fq-marker-title{ font-size:15px; font-weight:600; color:var(--fq-ink-0); margin-bottom:3px; }
.fq-marker-body{ font-size:13.5px; color:var(--fq-ink-1); line-height:1.5; }
.fq-disclaimer{ font-size:11px; color:var(--fq-ink-3); margin-top:18px; text-align:center; line-height:1.5; }

/* ──────────── PAIN / SOLUTION carousels ──────────── */
.fq-carousel{ display:flex; flex-direction:column; align-items:center; }
.fq-carousel-logo{ margin-bottom:24px; }
.fq-brain-bubble{
  position:relative;
  width:240px; height:240px; margin:0 auto 28px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, rgba(91,197,199,.18), transparent 70%),
             linear-gradient(180deg, rgba(15,30,54,.55), rgba(10,22,40,.45));
  border:1px solid rgba(91,197,199,.18);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  display:grid; place-items:center;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.04);
  animation:fq-bubble-pulse 6s ease-in-out infinite;
}
.fq-brain-bubble.is-solution{
  background:
    radial-gradient(circle at 30% 25%, rgba(86,219,230,.40), transparent 60%),
    radial-gradient(circle at 70% 70%, rgba(43,181,196,.20), transparent 65%),
    linear-gradient(180deg, rgba(15,30,54,.55), rgba(10,22,40,.45));
  border-color:rgba(91,197,199,.34);
  box-shadow:0 30px 80px -30px rgba(91,197,199,.4), inset 0 1px 0 rgba(255,255,255,.08), 0 0 80px rgba(91,197,199,.18);
}
.fq-brain-bubble.is-pain{
  background:
    radial-gradient(circle at 30% 25%, rgba(227,91,46,.32), transparent 60%),
    radial-gradient(circle at 70% 70%, rgba(176,78,44,.18), transparent 65%),
    linear-gradient(180deg, rgba(15,30,54,.55), rgba(10,22,40,.45));
  border-color:rgba(227,91,46,.30);
  box-shadow:0 30px 80px -30px rgba(227,91,46,.30), inset 0 1px 0 rgba(255,255,255,.05), 0 0 60px rgba(227,91,46,.15);
}
@keyframes fq-bubble-pulse{
  0%,100%{ transform:scale(1); }
  50%   { transform:scale(1.025); }
}
.fq-carousel-illustration{
  width:78%; height:78%;
  display:grid; place-items:center;
  filter:drop-shadow(0 8px 20px rgba(0,0,0,.4));
  opacity:0; transition:opacity .35s ease;
}
.fq-carousel-illustration.is-loaded{ opacity:1; }
.fq-carousel-illustration svg{
  width:100%; height:100%; max-width:100%; max-height:100%;
  display:block; overflow:visible;
}
/* Spinner shown while SVG fetches */
.fq-illust-spinner{
  width:36px; height:36px; border-radius:50%;
  border:2.5px solid rgba(120,160,210,.18);
  border-top-color:var(--fq-cyan);
  animation:fq-spin 0.9s linear infinite;
}
@keyframes fq-spin{ to{ transform:rotate(360deg); } }

/* Carousel slide content (Framer-equivalent: x + opacity + scale + blur) */
.fq-carousel-slide{ display:flex; flex-direction:column; align-items:center; }
.fq-carousel-slide.is-entering-fwd{ animation:fq-slide-in-fwd .42s cubic-bezier(0.22, 1, 0.36, 1) both; will-change:transform, opacity, filter; }
.fq-carousel-slide.is-leaving-fwd{
  animation:fq-slide-out-fwd .28s cubic-bezier(0.55, 0, 0.7, 0.2) both;
  position:absolute; top:0; left:0; right:0; pointer-events:none; will-change:transform, opacity, filter;
}
.fq-carousel-slide.is-entering-back{ animation:fq-slide-in-back .42s cubic-bezier(0.22, 1, 0.36, 1) both; will-change:transform, opacity, filter; }
.fq-carousel-slide.is-leaving-back{
  animation:fq-slide-out-back .28s cubic-bezier(0.55, 0, 0.7, 0.2) both;
  position:absolute; top:0; left:0; right:0; pointer-events:none; will-change:transform, opacity, filter;
}
@keyframes fq-slide-in-fwd { from{opacity:0; transform:translate3d(44px,0,0) scale(0.986);  filter:blur(8px);} to{opacity:1; transform:translate3d(0,0,0) scale(1); filter:blur(0);} }
@keyframes fq-slide-out-fwd{ from{opacity:1; transform:translate3d(0,0,0) scale(1); filter:blur(0);} to{opacity:0; transform:translate3d(-36px,0,0) scale(0.992); filter:blur(6px);} }
@keyframes fq-slide-in-back { from{opacity:0; transform:translate3d(-44px,0,0) scale(0.986); filter:blur(8px);} to{opacity:1; transform:translate3d(0,0,0) scale(1); filter:blur(0);} }
@keyframes fq-slide-out-back{ from{opacity:1; transform:translate3d(0,0,0) scale(1); filter:blur(0);} to{opacity:0; transform:translate3d(36px,0,0) scale(0.992); filter:blur(6px);} }
.fq-carousel-stage{ position:relative; width:100%; min-height:480px; }

.fq-carousel-copy{ text-align:center; max-width:460px; margin:0 auto; }
.fq-carousel-title{
  font-size:clamp(28px, 6.5vw, 36px); font-weight:700;
  letter-spacing:-.02em; line-height:1.1; margin-bottom:14px;
  text-wrap:balance;
}
.fq-carousel-lead{
  font-size:17px; color:var(--fq-ink-1); line-height:1.5;
  margin-bottom:14px; font-weight:500; text-wrap:pretty;
}
.fq-carousel-support{ font-size:14.5px; color:var(--fq-ink-2); line-height:1.55; }
.fq-carousel-support strong{ color:var(--fq-cyan-2); font-weight:600; }

.fq-slide-dots{ display:flex; justify-content:center; gap:6px; margin:24px 0 0; }
.fq-slide-dot{ width:6px; height:6px; border-radius:50%; background:rgba(120,160,210,.22); transition:all .25s; }
.fq-slide-dot.is-active{ background:var(--fq-cyan); width:22px; border-radius:999px; }
.fq-carousel.is-pain .fq-slide-dot.is-active{ background:var(--fq-orange-2); }

/* ──────────── SOCIAL PROOF ──────────── */
.fq-social-graph{
  margin:24px 0 22px; padding:22px 18px;
  background:var(--fq-glass-bg-cool);
  border:1px solid var(--fq-glass-border-cool); border-radius:20px;
  position:relative;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow);
}
.fq-social-graph-title{
  font-size:13px; font-weight:600; color:var(--fq-ink-1); text-align:center;
  margin-bottom:14px; letter-spacing:.04em;
}
.fq-social-graph svg{ width:100%; height:auto; display:block; }
.fq-graph-line{ fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.fq-graph-line.bad { stroke:var(--fq-orange); stroke-dasharray:1000; stroke-dashoffset:1000; animation:fq-draw-line 2.6s 0.2s forwards ease-out; }
.fq-graph-line.good{ stroke:var(--fq-cyan-2);  stroke-dasharray:1000; stroke-dashoffset:1000; animation:fq-draw-line 2.6s 0.6s forwards ease-out; }
@keyframes fq-draw-line{ to{ stroke-dashoffset:0; } }
.fq-graph-fill.bad { fill:rgba(233,122,60,.10); }
.fq-graph-fill.good{ fill:rgba(91,197,199,.10); }
.fq-graph-grid{ stroke:rgba(120,160,210,.08); stroke-width:1; }
.fq-graph-axis-label{ font-family:'JetBrains Mono', monospace; font-size:9px; fill:var(--fq-ink-3); letter-spacing:.1em; }

.fq-social-legend{ display:flex; justify-content:center; gap:16px; margin-top:14px; flex-wrap:wrap; }
.fq-social-legend-item{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--fq-ink-1); }
.fq-social-legend-dot{ width:10px; height:3px; border-radius:2px; }
.fq-social-legend-dot.bad{ background:var(--fq-orange); }
.fq-social-legend-dot.good{ background:var(--fq-cyan-2); }

.fq-quote{
  padding:20px 22px 18px;
  background:var(--fq-glass-bg);
  border:1px solid var(--fq-glass-border);
  border-radius:18px; margin-bottom:12px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
}
.fq-quote-head{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.fq-quote-avatar{
  width:38px; height:38px; border-radius:50%;
  background:linear-gradient(135deg, var(--fq-cyan-deep), var(--fq-cyan));
  display:grid; place-items:center;
  font-weight:700; color:var(--fq-bg-0); font-size:14px; flex-shrink:0;
}
.fq-quote-author-line{ display:flex; align-items:center; gap:6px; font-size:14px; font-weight:600; color:var(--fq-ink-0); }
.fq-quote-verified{ color:var(--fq-green); }
.fq-quote-role{ font-size:12px; color:var(--fq-ink-3); margin-top:1px; }
.fq-quote-body{ font-size:14.5px; color:var(--fq-ink-1); line-height:1.55; font-style:italic; }

/* ──────────── PLAN — timeline ──────────── */
.fq-plan-hero-sub{ font-size:15px; color:var(--fq-ink-1); margin-bottom:30px; line-height:1.5; }
.fq-timeline{ position:relative; padding-left:38px; }
.fq-timeline::before{
  content:''; position:absolute; left:15px; top:6px; bottom:6px;
  width:2px;
  background:linear-gradient(180deg, var(--fq-cyan) 0%, var(--fq-amber) 40%, var(--fq-ember) 70%, rgba(120,160,210,.10) 100%);
}
.fq-timeline-item{ position:relative; padding-bottom:22px; }
.fq-timeline-item:last-child{ padding-bottom:0; }
.fq-timeline-dot{
  position:absolute; left:-31px; top:4px;
  width:30px; height:30px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--fq-bg-0); border:2px solid var(--fq-dot-color, var(--fq-cyan));
  color:var(--fq-dot-color, var(--fq-cyan));
  box-shadow:0 0 0 3px rgba(4,9,18,1), 0 0 12px var(--fq-dot-glow, rgba(91,197,199,.3));
}
.fq-timeline-item.cyan    { --fq-dot-color:var(--fq-cyan);     --fq-dot-glow:rgba(91,197,199,.3); }
.fq-timeline-item.amber   { --fq-dot-color:var(--fq-amber);    --fq-dot-glow:rgba(236,158,50,.3); }
.fq-timeline-item.ember   { --fq-dot-color:var(--fq-orange);   --fq-dot-glow:rgba(233,122,60,.35); }
.fq-timeline-item.danger  { --fq-dot-color:var(--fq-danger);   --fq-dot-glow:rgba(226,85,85,.3); }
.fq-timeline-item.purple  { --fq-dot-color:var(--fq-purple);   --fq-dot-glow:rgba(155,123,255,.3); }
.fq-timeline-item.success { --fq-dot-color:var(--fq-green);    --fq-dot-glow:rgba(59,181,138,.3); }
.fq-timeline-item.is-locked .fq-timeline-dot{ border-color:rgba(120,160,210,.18); color:var(--fq-ink-3); box-shadow:0 0 0 3px rgba(4,9,18,1); }

.fq-timeline-day{
  font-family:'JetBrains Mono', monospace; font-size:11px;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--fq-dot-color, var(--fq-cyan)); margin-bottom:2px;
}
.fq-timeline-tool{ font-size:12px; color:var(--fq-ink-3); margin-bottom:6px; }
.fq-timeline-headline{ font-size:16px; font-weight:600; color:var(--fq-ink-0); line-height:1.3; margin-bottom:6px; }
.fq-timeline-body{ font-size:13.5px; color:var(--fq-ink-2); line-height:1.5; }
.fq-timeline-item.is-locked .fq-timeline-headline,
.fq-timeline-item.is-locked .fq-timeline-body,
.fq-timeline-item.is-locked .fq-timeline-day,
.fq-timeline-item.is-locked .fq-timeline-tool{ opacity:.55; }

.fq-timeline-highlight{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:8px; padding:6px 12px; border-radius:999px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.10);
  font-size:11.5px; color:var(--fq-ink-1); font-weight:500;
  backdrop-filter:blur(12px) saturate(1.04); -webkit-backdrop-filter:blur(12px) saturate(1.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.fq-timeline-highlight.is-stat{ padding:8px 14px; }
.fq-timeline-highlight-value{
  font-family:'JetBrains Mono', monospace; font-weight:700;
  color:var(--fq-dot-color, var(--fq-cyan)); margin-left:4px;
}

/* ──────────── WAITLIST (paywall-style) ──────────── */
.fq-waitlist-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; border-radius:999px;
  background:linear-gradient(180deg, rgba(245,167,98,.12), rgba(233,122,60,.08));
  border:1px solid rgba(245,167,98,.3);
  color:var(--fq-orange-2);
  font-family:'JetBrains Mono', monospace; font-size:11px;
  letter-spacing:.18em; text-transform:uppercase; font-weight:600;
  margin-bottom:14px;
}
.fq-waitlist-eyebrow svg{ color:var(--fq-amber); }

.fq-feat-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:24px 0;
}
@media (max-width:480px){ .fq-feat-grid{ grid-template-columns:1fr; } }
.fq-feat-card{
  padding:14px;
  background:var(--fq-glass-bg);
  border:1px solid var(--fq-glass-border); border-radius:14px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow-soft);
}
.fq-feat-icon{
  width:34px; height:34px; border-radius:10px;
  display:grid; place-items:center; margin-bottom:10px;
  color:var(--fq-feat-color, var(--fq-cyan));
  background:rgba(255,255,255,.04); border:1px solid currentColor;
}
.fq-feat-card.feat-shield  { --fq-feat-color:var(--fq-orange-2); }
.fq-feat-card.feat-brain   { --fq-feat-color:var(--fq-cyan-2); }
.fq-feat-card.feat-spark   { --fq-feat-color:var(--fq-purple); }
.fq-feat-card.feat-chart   { --fq-feat-color:var(--fq-amber); }
.fq-feat-card.feat-shield  .fq-feat-icon{ background:rgba(245,167,98,.08); border-color:rgba(245,167,98,.3); }
.fq-feat-card.feat-brain   .fq-feat-icon{ background:rgba(91,197,199,.08); border-color:rgba(91,197,199,.3); }
.fq-feat-card.feat-spark   .fq-feat-icon{ background:rgba(155,123,255,.08); border-color:rgba(155,123,255,.3); }
.fq-feat-card.feat-chart   .fq-feat-icon{ background:rgba(236,158,50,.08); border-color:rgba(236,158,50,.3); }
.fq-feat-title{ font-size:13.5px; font-weight:600; color:var(--fq-ink-0); margin-bottom:3px; line-height:1.25; }
.fq-feat-desc{ font-size:12px; color:var(--fq-ink-2); line-height:1.4; }

.fq-waitlist-card{
  position:relative; overflow:hidden;
  padding:22px;
  background:
    radial-gradient(circle at 14% 14%, rgba(245,167,98,.18) 0%, transparent 38%),
    radial-gradient(circle at 86% 18%, rgba(43,181,196,.16) 0%, transparent 36%),
    radial-gradient(ellipse 90% 50% at 50% 100%, rgba(67,83,203,.10) 0%, transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.062), rgba(255,255,255,.028));
  background-size:130% 130%;
  animation:fq-mesh-shift 18s ease-in-out infinite alternate;
  border:1px solid rgba(91,197,199,.25);
  border-radius:20px;
  margin-top:8px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow);
}
.fq-waitlist-card::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  border-radius:inherit;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='256' height='256'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='256' height='256' filter='url(%23n)' opacity='1'/></svg>");
  opacity:.05; mix-blend-mode:overlay;
}
.fq-waitlist-card > *{ position:relative; z-index:1; }
.fq-os-toggle{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; }
.fq-os-btn{
  padding:12px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.10);
  border-radius:12px; color:var(--fq-ink-1); cursor:pointer;
  font-size:14px; font-weight:500;
  display:flex; align-items:center; justify-content:center; gap:8px;
  backdrop-filter:blur(12px) saturate(1.04); -webkit-backdrop-filter:blur(12px) saturate(1.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:all .15s;
}
.fq-os-btn:hover{ border-color:rgba(91,197,199,.4); }
.fq-os-btn.is-selected{ background:rgba(91,197,199,.14); border-color:var(--fq-cyan); color:var(--fq-ink-0); }

.fq-waitlist-success{
  text-align:center; padding:48px 24px;
  background:
    radial-gradient(circle at 50% 0%, rgba(59,181,138,.16) 0%, transparent 36%),
    var(--fq-glass-bg);
  border:1px solid rgba(59,181,138,.32);
  border-radius:22px;
  backdrop-filter:var(--fq-glass-blur); -webkit-backdrop-filter:var(--fq-glass-blur);
  box-shadow:var(--fq-glass-shadow);
}
.fq-waitlist-success-icon{
  width:72px; height:72px; margin:0 auto 22px;
  border-radius:50%;
  background:rgba(59,181,138,.18); border:2px solid rgba(59,181,138,.55);
  display:grid; place-items:center; color:#7DDCB6;
  animation:fq-success-pop .55s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes fq-success-pop{
  from{ transform:scale(0.5); opacity:0; }
  to  { transform:scale(1);   opacity:1; }
}
.fq-waitlist-success h2{ font-size:26px; font-weight:700; margin-bottom:12px; letter-spacing:-.02em; }
.fq-waitlist-success p{ font-size:15px; color:var(--fq-ink-1); line-height:1.55; max-width:380px; margin:0 auto; }

/* ──────────── Buttons / Footer ──────────── */
.fq-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 22px;
  border-radius:18px;
  font-family:inherit; font-size:15px; font-weight:700; line-height:1; letter-spacing:.005em;
  cursor:pointer; border:0;
  transition:transform .18s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease, opacity .15s;
  -webkit-tap-highlight-color:transparent;
}
/* Glassmorphic primary — matches .carousel-progress-next from the app */
.fq-btn-primary{
  color:var(--fq-ink-0);
  background:
    radial-gradient(circle at 14% 20%, rgba(255,255,255,.12) 0%, transparent 24%),
    linear-gradient(135deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.04) 100%);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(18px) saturate(1.05);
  -webkit-backdrop-filter:blur(18px) saturate(1.05);
  box-shadow:
    0 14px 28px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.10);
}
.fq-btn-primary:hover{
  transform:translateY(-1px);
  background:
    radial-gradient(circle at 14% 20%, rgba(255,255,255,.18) 0%, transparent 26%),
    linear-gradient(135deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,.06) 100%);
  border-color:rgba(255,255,255,.18);
  box-shadow:
    0 18px 36px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.16);
}
.fq-btn-primary:active{ transform:translateY(0); }
.fq-btn-primary[disabled]{
  opacity:.45; cursor:not-allowed; transform:none;
  box-shadow:0 6px 14px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.06);
}

/* Solution-mode accent: cool cyan tint when on solution carousel — espelha .solution-carousel-progress-accent */
.fq-root.is-mode-solution .fq-btn-primary{
  background:
    radial-gradient(circle at 12% 30%, rgba(255,255,255,.20) 0%, transparent 30%),
    linear-gradient(135deg, rgba(88,217,228,.96) 0%, rgba(63,177,214,.94) 52%, rgba(59,132,205,.92) 100%);
  border-color:rgba(255,255,255,.18);
  box-shadow:
    0 10px 24px rgba(56,156,206,.28),
    inset 0 1px 0 rgba(255,255,255,.18);
}
.fq-root.is-mode-solution .fq-btn-primary:hover{
  background:
    radial-gradient(circle at 12% 30%, rgba(255,255,255,.28) 0%, transparent 32%),
    linear-gradient(135deg, rgba(108,227,238,1) 0%, rgba(73,187,224,1) 52%, rgba(69,142,215,1) 100%);
  box-shadow:
    0 14px 30px rgba(56,156,206,.36),
    inset 0 1px 0 rgba(255,255,255,.24);
}

.fq-btn-ghost{
  background:transparent; color:var(--fq-ink-1);
  border:1px solid var(--fq-line-2);
}
.fq-btn-ghost:hover{ border-color:rgba(91,197,199,.5); color:var(--fq-ink-0); }
.fq-btn-block{ width:100%; }

.fq-footer{
  position:fixed; left:0; right:0; bottom:0; z-index:6;
  padding:16px 20px calc(16px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg, transparent 0%, rgba(4,9,18,.85) 30%, rgba(4,9,18,.95) 100%);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  pointer-events:none;
}
.fq-footer > *{ pointer-events:auto; }
.fq-footer-inner{ max-width:540px; margin:0 auto; }

/* ──────────── Desktop polish ──────────── */
@media (min-width:900px){
  .fq-body{ padding:68px 24px 150px; }
  .fq-root:not(.is-quiz-chrome) .fq-body{ padding-top:52px; }
  .fq-root.is-step-intro .fq-body{ padding-top:64px; }
  .fq-brain-bubble{ width:280px; height:280px; }
}

@media (prefers-reduced-motion: reduce){
  .fq-step,
  .fq-particle,
  .fq-brain-bubble,
  .fq-graph-line.bad,
  .fq-graph-line.good,
  .fq-waitlist-success-icon,
  .fq-carousel-slide,
  .fq-illust-spinner{ animation:none !important; }
  .fq-load-ring-progress, .fq-progress-bar, .fq-compare-bar, .fq-carousel-illustration{ transition:none !important; }
}
