/* ═══ QG Simulators — styles du module (tokens QG Design System, portés par .qgs pour ne pas toucher au thème) ═══ */
.qgs {
  --royal: #1B0059; --azure: #3593EE; --violet: #7B2CBF; --cyan-electric: #00D4FF; --mint: #6EE7B7;
  --navy: #0F172A; --ink-900: #0B1020; --ink-700: #1D2531; --ink-500: #495466; --ink-400: #656972; --ink-300: #94A3B8; --ink-200: #CBD5E1; --ink-100: #E6E9F0;
  --paper: #FFFFFF; --paper-cool: #F6F8FB; --paper-lavender: #F4F0FF; --color-error: #DC2626;
  --grad: linear-gradient(90deg, #3593EE 0%, #7B2CBF 100%);
  --font-heading: 'DM Sans', system-ui, -apple-system, sans-serif; --font-body: 'Inter', system-ui, -apple-system, sans-serif; --font-mono: 'JetBrains Mono', Consolas, monospace;
  --stage-bg: #0F172A; --stage-panel: #141D36; --stage-panel-hi: #1B2647; --stage-line: rgba(53, 147, 238, 0.35); --stage-pipe: #22305A;
  --st-search: #B794F6; --st-wait: #8FB8FF; --st-warn: #F5C451; --st-context: #FF8FA3;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  font-family: var(--font-body); color: var(--ink-700); line-height: 1.5; -webkit-font-smoothing: antialiased;
  color-scheme: light;   /* les contrôles natifs ne suivent pas le mode sombre du système */
}
.qgs *, .qgs *::before, .qgs *::after { box-sizing: border-box; }
.qgs [hidden] { display: none !important; }
.qgs :focus-visible { outline: none; box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px var(--azure); border-radius: 6px; }
.qgs h1, .qgs h2, .qgs h3 { font-family: var(--font-heading); color: var(--royal); margin: 0; letter-spacing: -0.015em; }
.qgs p { margin: 0; }
.qgs .qgs-wrap { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
.qgs .qgs-grad { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: 0.06em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.qgs .qgs-screen { display: none; }
.qgs .qgs-screen.is-active { display: block; animation: qgs-in 0.4s var(--ease); }
@keyframes qgs-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .qgs .qgs-screen.is-active { animation: none; } }

/* ── Surtitres (comme le calculateur : petites capitales espacées, filet) */
.qgs .qgs-eyebrow { display: flex; align-items: center; justify-content: center; gap: 10px; font-family: var(--font-heading); font-weight: 700; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--azure); margin-bottom: 16px; }
.qgs .qgs-eyebrow::before { content: ""; width: 28px; height: 1.5px; background: var(--grad); }
.qgs .qgs-eyebrow i { width: 10px; height: 1.5px; background: var(--ink-300); }
.qgs .qgs-eyebrow--left { justify-content: flex-start; }
.qgs .qgs-eyebrow--light { color: var(--cyan-electric); }

/* ── Boutons */
.qgs .qgs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 24px; border-radius: 10px; border: 0; font-family: var(--font-heading); font-weight: 700; font-size: 15px; cursor: pointer; text-decoration: none; transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease), opacity 0.2s; }
.qgs .qgs-btn--primary { background: var(--grad); color: var(--paper); box-shadow: 0 10px 30px rgba(53, 147, 238, 0.25); }
.qgs .qgs-btn--primary:hover:not(:disabled) { transform: translateY(-2px); }
.qgs .qgs-btn--primary:disabled { opacity: 0.4; cursor: not-allowed; box-shadow: none; }
.qgs .qgs-btn--xl { min-height: 58px; padding: 16px 34px; font-size: 16px; }
.qgs .qgs-btn--ghost { background: transparent; color: var(--royal); }
.qgs .qgs-btn--ghost:hover { color: var(--azure); }
.qgs .qgs-btn--ghost-light { background: transparent; color: var(--paper); border: 1.5px solid rgba(255, 255, 255, 0.35); }
.qgs .qgs-btn--ghost-light:hover { border-color: var(--cyan-electric); }
.qgs .is-placeholder { visibility: hidden; }

/* ═══ Écran 1 : hero */
.qgs .qgs-hero { max-width: 860px; margin: 0 auto; padding: 56px 20px 64px; text-align: center; }
.qgs .qgs-hero__title { font-weight: 900; font-size: clamp(36px, 6vw, 64px); line-height: 1.08; margin-bottom: 22px; }
.qgs .qgs-hero__lead { font-size: 17px; color: var(--ink-500); max-width: 600px; margin: 0 auto 30px; line-height: 1.6; }
.qgs .qgs-hero__cta { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 48px; }
.qgs .qgs-hero__link { font-size: 13px; color: var(--ink-500); text-decoration: underline; text-underline-offset: 3px; }
.qgs .qgs-proof { list-style: none; margin: 0; padding: 28px 0 0; border-top: 1px solid var(--ink-100); display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.qgs .qgs-proof li { display: flex; flex-direction: column; gap: 4px; }
.qgs .qgs-proof b { font-family: var(--font-heading); font-weight: 900; font-size: 30px; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qgs .qgs-proof span { font-size: 13px; color: var(--ink-700); }
.qgs .qgs-proof small { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-300); }
@media (max-width: 640px) { .qgs .qgs-proof { grid-template-columns: 1fr; } }
.qgs .qgs-findings, .qgs .qgs-method, .qgs .qgs-sources { padding: 72px 0; }
.qgs .qgs-findings { background: var(--paper-cool); }
.qgs .qgs-findings h2, .qgs .qgs-method h2, .qgs .qgs-sources h2 { font-size: clamp(26px, 3.6vw, 38px); line-height: 1.15; max-width: 760px; margin-bottom: 36px; }
.qgs .qgs-findings__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.qgs .qgs-findings__grid article { background: var(--paper); border-radius: 16px; padding: 28px; box-shadow: 0 2px 8px rgba(11, 16, 32, 0.06); }
.qgs .qgs-findings__grid h3 { font-size: 40px; font-weight: 900; margin-bottom: 10px; }
.qgs .qgs-findings__grid p { color: var(--ink-500); font-size: 15px; line-height: 1.6; }
.qgs .qgs-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.qgs .qgs-steps li { border-top: 2px solid var(--ink-100); padding-top: 18px; }
.qgs .qgs-steps__n { font-family: var(--font-mono); font-size: 13px; color: var(--azure); }
.qgs .qgs-steps h3 { font-size: 18px; margin: 8px 0; }
.qgs .qgs-steps p { color: var(--ink-500); font-size: 14px; line-height: 1.6; }
@media (max-width: 900px) { .qgs .qgs-findings__grid, .qgs .qgs-steps { grid-template-columns: 1fr; } }
.qgs .qgs-sources { background: var(--paper-cool); }
.qgs .qgs-sources__list { list-style: none; margin: 0 0 32px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 32px; }
.qgs .qgs-sources__list li { border-left: 2px solid var(--azure); padding-left: 12px; font-size: 14px; color: var(--ink-700); }
@media (max-width: 700px) { .qgs .qgs-sources__list { grid-template-columns: 1fr; } }

/* ═══ Écran 2 : questions */
/* Cadre fixe (comme le QG ROI Calculator) : barre de progression / zone de question / pied — seuls les contenus bougent */
.qgs .qgs-screen--wizard { --wiz-ease: cubic-bezier(0.22, 1, 0.36, 1); position: relative; }
.qgs .qgs-screen--wizard.is-active { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr); height: calc(100svh - var(--qgs-top, 80px)); max-height: 860px; min-height: 520px; }
.qgs .qgs-wizard__bar { height: 3px; background: var(--ink-100); }
.qgs .qgs-wizard__bar i { display: block; height: 100%; width: 0; background: var(--grad); border-radius: 0 2px 2px 0; transition: width 0.6s var(--wiz-ease); }
.qgs .qgs-wizard__body { position: relative; overflow: hidden; container: qgswiz / size; }
.qgs .qgs-q { position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: clamp(20px, 9cqh, 80px) clamp(16px, 4vw, 32px) 24px; will-change: transform, opacity; }
.qgs .qgs-q__inner { max-width: 860px; margin: 0 auto; }
/* Séquencé : l'ancienne question sort (0,24 s), puis la nouvelle entre — jamais deux textes superposés */
.qgs .qgs-q.is-in-next { animation: qgs-step-in 0.5s var(--wiz-ease) 0.2s both; }
.qgs .qgs-q.is-in-prev { animation: qgs-step-in-rev 0.5s var(--wiz-ease) 0.2s both; }
.qgs .qgs-q.is-out-next { animation: qgs-step-out 0.24s cubic-bezier(0.4, 0, 1, 1) both; pointer-events: none; }
.qgs .qgs-q.is-out-prev { animation: qgs-step-out-rev 0.24s cubic-bezier(0.4, 0, 1, 1) both; pointer-events: none; }
/* Les options arrivent en léger décalé, une à une */
.qgs .qgs-q.is-in-next .qgs-card, .qgs .qgs-q.is-in-next .qgs-slider > *, .qgs .qgs-q.is-in-prev .qgs-card, .qgs .qgs-q.is-in-prev .qgs-slider > * { animation: qgs-step-in 0.5s var(--wiz-ease) both; animation-delay: calc(0.28s + var(--i, 0) * 0.05s); }
@keyframes qgs-step-in { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes qgs-step-in-rev { from { opacity: 0; transform: translateY(-24px); } to { opacity: 1; transform: none; } }
@keyframes qgs-step-out { to { opacity: 0; transform: translateY(-24px); } }
@keyframes qgs-step-out-rev { to { opacity: 0; transform: translateY(24px); } }
@media (prefers-reduced-motion: reduce) { .qgs .qgs-q, .qgs .qgs-q * { animation: none !important; } }
.qgs .qgs-q__title { font-size: clamp(26px, 3.8vw, 40px); line-height: 1.15; margin-bottom: 10px; }
.qgs .qgs-q__title:focus { box-shadow: none; }
.qgs .qgs-q__help { color: var(--ink-500); font-size: 15px; margin-bottom: 28px; }
.qgs .qgs-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (min-width: 481px) { .qgs .qgs-cards:has(> :nth-child(4):last-child) { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .qgs .qgs-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .qgs .qgs-cards { grid-template-columns: 1fr; } }
.qgs .qgs-card { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-height: 92px; padding: 18px 44px 18px 18px; text-align: left; background: var(--paper); border: 1.5px solid var(--ink-100); border-radius: 12px; font: inherit; color: var(--ink-700); cursor: pointer; transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s; }
.qgs .qgs-card:hover { border-color: var(--azure); box-shadow: 0 8px 24px rgba(11, 16, 32, 0.08); transform: translateY(-1px); }
.qgs .qgs-card[aria-checked="true"] { border-color: var(--azure); background: var(--paper-lavender); box-shadow: inset 0 0 0 1px var(--azure); }
.qgs .qgs-card.is-picked { animation: qgs-pick 0.32s ease-out; }
@keyframes qgs-pick { 0%, 100% { transform: none; } 40% { transform: scale(0.97); } }
.qgs .qgs-card b { font-family: var(--font-heading); font-size: 16px; color: var(--royal); }
.qgs .qgs-card span { font-size: 13px; color: var(--ink-500); }
.qgs .qgs-card .qgs-card__letter { position: absolute; top: 12px; right: 12px; width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid var(--ink-200); border-radius: 6px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-500); }
.qgs .qgs-card[aria-checked="true"] .qgs-card__letter { background: var(--azure); border-color: var(--azure); color: var(--paper); }
.qgs .qgs-slider { max-width: 640px; }
.qgs .qgs-slider__val { display: block; font-family: var(--font-heading); font-weight: 900; font-size: clamp(40px, 6vw, 60px); line-height: 1.12; padding-bottom: 0.08em; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: 10px; }
.qgs .qgs-slider input[type=range], .qgs .qgs-tune input[type=range] { width: 100%; min-height: 32px; cursor: pointer; }
/* Curseurs dessinés aux couleurs QG (rendu identique quels que soient le navigateur et le thème système) */
.qgs input[type=range] { -webkit-appearance: none; appearance: none; background: transparent; height: 32px; margin: 0; --track: var(--ink-100); --fill: var(--grad); --thumb: var(--azure); }
.qgs input[type=range]::-webkit-slider-runnable-track { height: 6px; border-radius: 999px; background: var(--fill) 0 0 / var(--p, 50%) 100% no-repeat, var(--track); }
.qgs input[type=range]::-moz-range-track { height: 6px; border-radius: 999px; background: var(--track); }
.qgs input[type=range]::-moz-range-progress { height: 6px; border-radius: 999px; background: var(--fill); }
.qgs input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; margin-top: -8px; border-radius: 50%; background: var(--paper); border: 2px solid var(--thumb); box-shadow: 0 2px 10px rgba(27, 0, 89, 0.22); transition: transform 0.15s var(--ease), box-shadow 0.15s; }
.qgs input[type=range]::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--paper); border: 2px solid var(--thumb); box-shadow: 0 2px 10px rgba(27, 0, 89, 0.22); }
.qgs input[type=range]:hover::-webkit-slider-thumb, .qgs input[type=range]:active::-webkit-slider-thumb { transform: scale(1.12); }
.qgs input[type=range]:focus-visible { box-shadow: none; }
.qgs input[type=range]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px rgba(53, 147, 238, 0.3); }
.qgs input[type=range]:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 4px rgba(53, 147, 238, 0.3); }
.qgs .qgs-slider__hint { font-size: 13px; color: var(--ink-500); margin: 8px 0 18px; }
.qgs .qgs-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.qgs .qgs-chip { min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--ink-100); background: var(--paper); font: inherit; font-size: 14px; color: var(--ink-700); cursor: pointer; }
.qgs .qgs-chip:hover { border-color: var(--azure); }
.qgs .qgs-chip[aria-pressed="true"] { border-color: var(--azure); background: var(--paper-lavender); color: var(--royal); font-weight: 600; }
.qgs .qgs-wizard__foot { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px max(20px, calc((100% - 860px) / 2)); padding-bottom: max(14px, env(safe-area-inset-bottom)); background: var(--paper); border-top: 1px solid var(--ink-100); }
.qgs .qgs-wizard__end { display: flex; align-items: center; gap: 16px; }
.qgs .qgs-wizard__hint { font-size: 12px; color: var(--ink-400); white-space: nowrap; }
.qgs .qgs-wizard__hint kbd { font-family: inherit; font-weight: 600; color: var(--ink-500); }
@media (hover: none), (max-width: 600px) { .qgs .qgs-wizard__hint[data-kind="enter"] { display: none; } }
@media (max-width: 480px) { .qgs .qgs-wizard__hint { display: none; } .qgs .qgs-card { min-height: 0; padding-block: 14px; } }

/* ═══ Écran 3 : analyse */
.qgs .qgs-screen--compute { background: radial-gradient(ellipse at 50% 30%, #1B2647 0%, var(--navy) 70%); }
.qgs .qgs-compute { height: calc(100svh - var(--qgs-top, 80px)); max-height: 860px; min-height: 520px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 80px 20px; }
.qgs .qgs-loader { width: 96px; height: 48px; margin-bottom: 18px; }
.qgs .qgs-loader path { stroke-dasharray: 60 140; animation: qgs-loop 1.4s linear infinite; }
@keyframes qgs-loop { to { stroke-dashoffset: -200; } }
.qgs .qgs-loader__progress { width: 140px; height: 3px; border-radius: 999px; background: rgba(255, 255, 255, 0.12); overflow: hidden; margin-bottom: 40px; }
.qgs .qgs-loader__progress i { display: block; height: 100%; width: 0; background: var(--grad); }
.qgs .qgs-compute h2 { color: var(--paper); font-size: 30px; margin-bottom: 14px; }
.qgs .qgs-compute__msg { color: var(--ink-200); font-size: 14px; }

/* ═══ Écran 4 : rapport */
.qgs .qgs-report__head { max-width: 900px; margin: 0 auto; padding: 56px 20px 40px; text-align: center; }
.qgs .qgs-report__title { font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--royal); margin-bottom: 28px; font-weight: 700; }
.qgs .qgs-report__kicker { font-family: var(--font-heading); font-size: clamp(20px, 2.6vw, 26px); font-weight: 700; color: var(--royal); }
.qgs .qgs-report__big { font-family: var(--font-heading); font-weight: 900; font-size: clamp(56px, 10vw, 104px); line-height: 1.1; padding-bottom: 0.14em; margin: 12px 0 0; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qgs .qgs-report__big small { font-size: 0.32em; font-weight: 700; }
.qgs .qgs-report__line { font-size: 18px; color: var(--ink-700); margin-bottom: 10px; }
.qgs .qgs-report__basis { font-size: 13px; color: var(--ink-400); margin-bottom: 32px; }
.qgs .qgs-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0; text-align: left; }
.qgs .qgs-tiles div { background: var(--paper-cool); border-radius: 12px; padding: 18px; }
.qgs .qgs-tiles dt { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-500); }
.qgs .qgs-tiles dd { margin: 6px 0 2px; font-family: var(--font-heading); font-weight: 900; font-size: 26px; color: var(--royal); }
.qgs .qgs-tiles small { font-size: 12px; color: var(--ink-400); }
@media (max-width: 640px) { .qgs .qgs-tiles { grid-template-columns: 1fr; } }

/* ── Duel (surface sombre) */
.qgs .qgs-duel { background: var(--stage-bg); color: var(--ink-100); padding: 56px 0 48px; }
.qgs .qgs-duel .qgs-wrap { max-width: 860px; }
.qgs .qgs-duel .qgs-eyebrow { color: var(--cyan-electric); }
.qgs .qgs-headline { color: var(--paper); font-size: clamp(22px, 3vw, 30px); line-height: 1.2; margin-bottom: 20px; }
.qgs .qgs-headline em { font-style: normal; color: var(--mint); }
.qgs .qgs-tune { background: var(--stage-panel); border: 1px solid var(--stage-line); border-radius: 14px; padding: 14px 18px 16px; margin-bottom: 14px; }
.qgs .qgs-tune__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin-bottom: 8px; }
.qgs .qgs-tune__head b { font-family: var(--font-heading); color: var(--paper); font-size: 15px; }
.qgs .qgs-tune__head span { font-size: 12px; color: var(--ink-300); }
.qgs .qgs-tune__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 28px; }
@media (max-width: 640px) { .qgs .qgs-tune__grid { grid-template-columns: 1fr; } }
.qgs .qgs-tune__sl { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0 12px; }
.qgs .qgs-tune__lbl { font-size: 13px; color: var(--ink-200); }
.qgs .qgs-tune output { font-family: var(--font-mono); font-weight: 700; color: var(--paper); font-size: 14px; }
.qgs .qgs-tune input[type=range] { grid-column: 1 / -1; --track: rgba(255, 255, 255, 0.14); --fill: linear-gradient(90deg, var(--azure), var(--cyan-electric)); --thumb: var(--cyan-electric); }
.qgs .qgs-stage { position: relative; border: 1px solid var(--stage-line); border-radius: 20px; overflow: hidden; overflow: clip; background: radial-gradient(ellipse at 50% 35%, var(--stage-panel) 0%, var(--stage-bg) 75%); transition: box-shadow 0.4s var(--ease); }
.qgs .qgs-stage.is-done { box-shadow: 0 0 0 2px var(--mint), 0 0 48px rgba(110, 231, 183, 0.35); }
.qgs .qgs-stage > svg { display: block; width: 100%; height: auto; }
.qgs .qgs-clock { position: absolute; right: 10px; top: 10px; display: flex; align-items: center; gap: 10px; padding: 4px 12px; border-radius: 999px; background: rgba(15, 23, 42, 0.85); border: 1px solid var(--stage-line); font-family: var(--font-mono); font-weight: 700; font-size: 12px; color: var(--paper); }
.qgs .qgs-clock i { display: block; width: 64px; height: 4px; border-radius: 999px; background: var(--stage-pipe); overflow: hidden; }
.qgs .qgs-clock i b { display: block; height: 100%; width: 0; background: var(--grad); }
.qgs .qgs-duel__ctrl { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 14px; }
.qgs .qgs-duel__ctrl .qgs-btn--ghost { color: var(--ink-100); border: 1px solid var(--stage-line); min-height: 44px; padding: 8px 18px; font-size: 14px; }
.qgs .qgs-duel__ctrl .qgs-btn--ghost:hover { border-color: var(--azure); color: var(--paper); }
.qgs .qgs-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 16px; margin: 14px 0 0; padding: 0; list-style: none; font-size: 12px; color: var(--ink-300); }
.qgs .qgs-legend li { display: inline-flex; align-items: center; gap: 6px; }
.qgs .qgs-legend i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
/* Éléments SVG des scènes */
.qgs .s-label { font-family: var(--font-heading); font-weight: 700; font-size: 15px; fill: var(--ink-200); letter-spacing: 0.04em; }
.qgs .s-small { font-family: var(--font-body); font-size: 13px; fill: var(--ink-300); }
.qgs .s-key { font-family: var(--font-body); font-size: 11px; fill: var(--ink-300); letter-spacing: 0.02em; }
.qgs .s-num { font-family: var(--font-mono); font-weight: 700; font-size: 18px; fill: var(--paper); }
.qgs .s-big { font-family: var(--font-heading); font-weight: 900; font-size: 34px; }
.qgs .s-pipe { fill: none; stroke: var(--stage-pipe); stroke-width: 12; stroke-linecap: round; stroke-linejoin: round; }
.qgs .s-flow { fill: none; stroke: var(--azure); stroke-opacity: 0.5; stroke-width: 2; stroke-dasharray: 2 12; stroke-linecap: round; animation: qgs-flow 1.2s linear infinite; }
@keyframes qgs-flow { to { stroke-dashoffset: -14; } }
@media (prefers-reduced-motion: reduce) { .qgs .s-flow, .qgs .qgs-loader path { animation: none; } }
.qgs .s-box { fill: var(--stage-panel); stroke: var(--stage-line); stroke-width: 1.5; }
.qgs .s-bin { fill: var(--stage-panel); stroke: var(--ink-500); stroke-width: 1.5; }

/* ── Avant / après, méthodologie */
.qgs .qgs-section { padding: 56px 0; }
.qgs .qgs-section h3 { font-size: clamp(22px, 3vw, 30px); margin-bottom: 24px; }
.qgs .qgs-section--muted { background: var(--paper-cool); }
.qgs .qgs-ba { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 900px) { .qgs .qgs-ba:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .qgs .qgs-ba { grid-template-columns: 1fr; } }
.qgs .qgs-ba__item { border: 1px solid var(--ink-100); border-radius: 12px; padding: 16px 18px; }
.qgs .qgs-ba__lbl { display: block; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 10px; }
.qgs .qgs-ba__vals { display: flex; align-items: flex-end; gap: 14px; }
.qgs .qgs-ba__vals small { display: block; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-400); }
.qgs .qgs-ba__b { font-family: var(--font-heading); font-size: 26px; color: var(--ink-400); }
.qgs .qgs-ba__a { font-family: var(--font-heading); font-size: 26px; color: var(--royal); }
.qgs .qgs-ba__arrow { color: var(--azure); font-size: 18px; padding-bottom: 4px; }
.qgs .qgs-note { font-size: 12px; color: var(--ink-400); margin-top: 14px; }
.qgs .qgs-details { border-top: 1px solid var(--ink-100); padding: 12px 0; }
.qgs .qgs-details summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; list-style: none; font-family: var(--font-heading); font-weight: 700; color: var(--royal); min-height: 44px; }
.qgs .qgs-details summary::-webkit-details-marker { display: none; }
.qgs .qgs-details summary::after { content: ""; flex: none; width: 9px; height: 9px; margin-right: 6px; border-right: 2px solid var(--azure); border-bottom: 2px solid var(--azure); transform: rotate(45deg) translateY(-3px); transition: transform 0.25s var(--ease); }
.qgs .qgs-details[open] summary::after { transform: rotate(-135deg) translateY(-3px); }
.qgs .qgs-details[open] ul { animation: qgs-in 0.35s var(--ease); }
.qgs .qgs-details ul { margin: 10px 0 0; padding-left: 20px; display: grid; gap: 8px; font-size: 14px; color: var(--ink-500); }

/* ── What's next : inscription à l'événement + appel */
.qgs .qgs-next { background: var(--royal); color: var(--paper); padding: 64px 0 72px; }
.qgs .qgs-next__grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 20px; align-items: start; }
@media (max-width: 860px) { .qgs .qgs-next__grid { grid-template-columns: 1fr; } }
.qgs .qgs-event { background: var(--paper); color: var(--ink-700); border-radius: 20px; padding: 32px; box-shadow: 0 16px 48px rgba(27, 0, 89, 0.25); }
.qgs .qgs-event__label { display: inline-block; font-family: var(--font-heading); font-weight: 700; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--azure); margin-bottom: 10px; }
.qgs .qgs-event h3 { font-size: clamp(24px, 3vw, 32px); line-height: 1.15; margin-bottom: 10px; }
.qgs .qgs-event__lead { color: var(--ink-500); margin-bottom: 18px; }
.qgs .qgs-event__meta, .qgs .qgs-call__meta { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 20px; margin: 0 0 18px; }
.qgs .qgs-event__meta dt, .qgs .qgs-call__meta dt { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-400); }
.qgs .qgs-event__meta dd, .qgs .qgs-call__meta dd { margin: 2px 0 0; font-weight: 600; color: var(--royal); }
.qgs .qgs-event__partners { font-size: 13px; color: var(--ink-500); margin-bottom: 14px; }
.qgs .qgs-event__bullets { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 8px; }
.qgs .qgs-event__bullets li { border-left: 2px solid var(--azure); padding-left: 12px; font-size: 14px; }
.qgs .qgs-event__rgpd { font-size: 11px; color: var(--ink-400); margin-top: 14px; }
.qgs .qgs-placeholder { padding: 18px; border: 1.5px dashed var(--ink-200); border-radius: 12px; font-size: 13px; color: var(--ink-500); }
.qgs .qgs-call { background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 20px; padding: 28px; }
.qgs .qgs-call .qgs-event__label { color: var(--cyan-electric); }
.qgs .qgs-call h3 { color: var(--paper); font-size: 24px; margin-bottom: 10px; }
.qgs .qgs-call p { color: var(--ink-200); margin-bottom: 18px; }
.qgs .qgs-call__meta dt { color: var(--ink-300); }
.qgs .qgs-call__meta dd { color: var(--paper); }
.qgs .qgs-call__embed { margin-top: 16px; background: var(--paper); border-radius: 14px; overflow: hidden; min-height: 120px; }
.qgs .qgs-call__empty { color: var(--ink-500) !important; padding: 18px; margin: 0 !important; }

/* ── Your numbers vs. the market : chaque résultat du visiteur face à un repère sourcé */
.qgs .qgs-market { background: var(--paper); }
.qgs .qgs-market__title { font-size: clamp(22px, 3vw, 30px); line-height: 1.2; margin-bottom: 10px; }
.qgs .qgs-market__title em { font-style: normal; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qgs .qgs-market__lead { color: var(--ink-500); margin-bottom: 26px; max-width: 720px; }
.qgs .qgs-market__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media (max-width: 760px) { .qgs .qgs-market__grid { grid-template-columns: 1fr; } }
.qgs .qgs-mcard { border: 1px solid var(--ink-100); border-radius: 16px; padding: 20px 22px; border-top: 3px solid var(--azure); background: var(--paper); }
.qgs .qgs-mcard--bad { border-top-color: #D97706; }
.qgs .qgs-mcard--good { border-top-color: #059669; }
.qgs .qgs-mcard__k { display: block; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 12px; }
.qgs .qgs-mcard__vs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.qgs .qgs-mcard__vs small { display: block; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-400); margin-bottom: 2px; }
.qgs .qgs-mcard__vs b { font-family: var(--font-heading); font-weight: 900; font-size: 28px; color: var(--royal); line-height: 1.1; }
.qgs .qgs-mcard__vs div:last-child b { color: var(--ink-500); font-weight: 700; font-size: 22px; }
.qgs .qgs-mcard--bad .qgs-mcard__vs div:first-child b { color: #B45309; }
.qgs .qgs-mcard--good .qgs-mcard__vs div:first-child b { color: #047857; }
.qgs .qgs-gauge { padding: 18px 0 8px; margin-bottom: 8px; }
.qgs .qgs-gauge__track { position: relative; height: 8px; border-radius: 999px; background: var(--ink-100); }
.qgs .qgs-gauge__band { position: absolute; top: 0; bottom: 0; border-radius: 999px; background: rgba(53, 147, 238, 0.25); }
.qgs .qgs-gauge__mk { position: absolute; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; border: 2px solid var(--paper); box-shadow: 0 1px 4px rgba(11, 16, 32, 0.2); }
.qgs .qgs-gauge__mk em { position: absolute; left: 50%; transform: translateX(-50%); font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; }
.qgs .qgs-gauge__mk--market { background: var(--ink-400); }
.qgs .qgs-gauge__mk--market em { top: 16px; color: var(--ink-500); }
.qgs .qgs-gauge__mk--you { background: var(--violet); width: 18px; height: 18px; margin: -9px 0 0 -9px; }
.qgs .qgs-gauge__mk--you em { bottom: 20px; color: var(--violet); }
.qgs .qgs-gauge__mk--bad { background: #D97706; }
.qgs .qgs-gauge__mk--bad em { color: #B45309; }
.qgs .qgs-gauge__mk--good { background: #059669; }
.qgs .qgs-gauge__mk--good em { color: #047857; }
.qgs .qgs-mcard__say { font-size: 15px; color: var(--ink-700); line-height: 1.55; margin-bottom: 10px; }
.qgs .qgs-mcard__say strong { color: var(--royal); }
.qgs .qgs-mcard__src { font-size: 11px; color: var(--ink-400); border-top: 1px solid var(--ink-100); padding-top: 8px; }
.qgs .qgs-market__foot { font-size: 12px; color: var(--ink-400); margin-top: 16px; }

/* ═══ Chiffres en direct pendant le replay */
.qgs .qgs-livetag { margin-left: 14px; padding: 3px 10px; border-radius: 999px; background: var(--paper-cool); color: var(--ink-500); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap; }
.qgs .qgs-livetag:empty { display: none; }
.qgs .qgs-report.is-live .qgs-livetag, .qgs .is-live .qgs-livetag { color: var(--azure); background: var(--paper-lavender); }
.qgs .is-live .qgs-livetag::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--azure); vertical-align: 1px; animation: qgs-blink 1.2s ease-in-out infinite; }
@keyframes qgs-blink { 50% { opacity: 0.25; } }
.qgs .qgs-ba__b, .qgs .qgs-ba__a, .qgs .qgs-mcard__vs b { font-variant-numeric: tabular-nums; }
.qgs .qgs-gauge__mk--you { transition: left 0.25s linear; }
/* Pendant le replay, le commentaire attend la fin pour se révéler (il cite les valeurs finales) */
.qgs .qgs-mcard__say { transition: opacity 0.6s var(--ease), filter 0.6s var(--ease); }
.qgs .is-live .qgs-mcard__say { opacity: 0.35; filter: blur(3px); user-select: none; }
.qgs .is-settled .qgs-ba__a, .qgs .is-settled .qgs-ba__b, .qgs .is-settled .qgs-mcard__vs > div:first-child b { animation: qgs-settle 1.4s var(--ease); }
@keyframes qgs-settle { 0% { background: rgba(53, 147, 238, 0.18); } 100% { background: transparent; } }
/* Pastille flottante quand le duel est hors écran : montre où en est le replay */
.qgs .qgs-livepill { position: fixed; left: 50%; bottom: max(20px, env(safe-area-inset-bottom)); z-index: 50; transform: translateX(-50%); display: flex; align-items: center; gap: 14px; width: min(440px, calc(100vw - 32px)); min-height: 64px; padding: 10px 12px 12px 12px; overflow: hidden; border: 1px solid rgba(53, 147, 238, 0.35); border-radius: 18px; background: var(--navy); color: var(--paper); font: inherit; text-align: left; box-shadow: 0 16px 40px rgba(27, 0, 89, 0.32); cursor: pointer; animation: qgs-pill-in 0.4s var(--ease); }
@keyframes qgs-pill-in { from { opacity: 0; transform: translate(-50%, 16px); } to { opacity: 1; transform: translate(-50%, 0); } }
.qgs .qgs-livepill[hidden] { display: none !important; }
.qgs .qgs-livepill__ring { position: relative; flex: none; width: 44px; height: 44px; }
.qgs .qgs-livepill__ring svg { width: 100%; height: 100%; }
.qgs .qgs-livepill__ring circle { fill: none; stroke: rgba(255, 255, 255, 0.14); stroke-width: 3.5; }
.qgs .qgs-livepill__ring circle.is-fg { stroke: var(--cyan-electric); stroke-linecap: round; stroke-dasharray: 0 101; transition: stroke-dasharray 0.2s linear; }
.qgs .qgs-livepill__ring em { position: absolute; inset: 0; display: grid; place-items: center; font-style: normal; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.qgs .qgs-livepill__txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.qgs .qgs-livepill__txt b { font-family: var(--font-heading); font-size: 14px; font-weight: 700; }
.qgs .qgs-livepill__txt small { font-size: 12px; color: var(--ink-200); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qgs .qgs-livepill__back { flex: none; padding: 8px 12px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); font-size: 13px; font-weight: 600; white-space: nowrap; transition: background 0.15s; }
.qgs .qgs-livepill:hover .qgs-livepill__back { background: rgba(255, 255, 255, 0.18); }
.qgs .qgs-livepill__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, 0.08); }
.qgs .qgs-livepill__bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--azure), var(--cyan-electric)); transition: width 0.2s linear; }
.qgs .qgs-livepill:focus-visible { outline: 2px solid var(--cyan-electric); outline-offset: 3px; }
@media (max-width: 420px) { .qgs .qgs-livepill__back { padding: 8px 10px; font-size: 0; } .qgs .qgs-livepill__back span { font-size: 16px; } }
@media (prefers-reduced-motion: reduce) { .qgs .qgs-livepill, .qgs .is-live .qgs-livetag::before { animation: none; } }

/* ═══ Mobile : l'animation est réduite à la largeur de l'écran → textes agrandis, horloge au-dessus de la scène */
.qgs .qgs-eyebrow { flex-wrap: wrap; }
@media (max-width: 640px) {
  .qgs .s-small { font-size: 17px; }
  .qgs .s-label { font-size: 18px; }
  .qgs .s-key { font-size: 13.5px; }
  .qgs .qgs-clock { position: static; justify-content: space-between; margin: 10px 10px 0; }
  .qgs .qgs-clock i { flex: 1; max-width: 140px; }
  .qgs .qgs-livetag { margin-left: 0; }
  .qgs .qgs-duel__ctrl { flex-wrap: nowrap; gap: 6px; }
  .qgs .qgs-duel__ctrl .qgs-btn--ghost { padding: 8px 12px; font-size: 13px; white-space: nowrap; }
}

/* ═══ Leviers : ce que le lecteur rate + indicateur à attaquer + « Et si… ? » */
.qgs .qgs-levers { background: var(--paper); }
.qgs .qgs-tool__title, .qgs .qgs-levers__title { font-size: clamp(24px, 3vw, 32px); margin-bottom: 8px; }
.qgs .qgs-tool__title em, .qgs .qgs-levers__title em { font-style: normal; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qgs .qgs-levers__lead { color: var(--ink-500); max-width: 680px; margin-bottom: 24px; }
.qgs .qgs-levers__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 16px; }
.qgs .qgs-lever { display: flex; flex-direction: column; gap: 12px; padding: 20px 22px; border: 1px solid var(--ink-100); border-top: 4px solid var(--lc, var(--azure)); border-radius: 16px; background: var(--paper); }
.qgs .qgs-lever__head { display: flex; align-items: center; gap: 10px; }
.qgs .qgs-lever__head b { font-family: var(--font-heading); color: var(--royal); font-size: 15px; flex: 1; min-width: 0; }
.qgs .qgs-lever__ico { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--navy); color: var(--lc, var(--azure)); }
.qgs .qgs-lever__ico svg { width: 20px; height: 20px; }
.qgs .qgs-lever__share { flex: none; padding: 3px 9px; border-radius: 999px; background: var(--paper-cool); font-size: 12px; font-weight: 600; color: var(--ink-500); font-variant-numeric: tabular-nums; }
.qgs .qgs-lever__big { font-family: var(--font-heading); font-weight: 900; font-size: 34px; line-height: 1.1; color: var(--royal); font-variant-numeric: tabular-nums; }
.qgs .qgs-lever__big small { font-family: var(--font-body); font-weight: 500; font-size: 13px; color: var(--ink-500); }
.qgs .qgs-lever__miss { font-size: 14px; color: var(--ink-700); transition: opacity 0.6s var(--ease), filter 0.6s var(--ease); }
.qgs .is-live .qgs-lever__miss { opacity: 0.35; filter: blur(3px); user-select: none; }
.qgs .qgs-lever__kpi { display: grid; gap: 2px; padding: 12px 14px; border-left: 2px solid var(--azure); background: var(--paper-cool); border-radius: 0 10px 10px 0; }
.qgs .qgs-lever__kpi small { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--azure); font-weight: 700; }
.qgs .qgs-lever__kpi b { font-size: 14px; color: var(--royal); }
.qgs .qgs-lever__kpi span { font-size: 13px; color: var(--ink-500); }
.qgs .qgs-lever__wi label { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; color: var(--ink-700); }
.qgs .qgs-lever__wi output { font-family: var(--font-mono); font-weight: 700; color: var(--royal); white-space: nowrap; }
.qgs .qgs-lever__res { font-size: 14px; color: var(--ink-700); min-height: 21px; }
.qgs .qgs-lever__res strong { color: var(--royal); }
.qgs .qgs-lever .qgs-mcard__src { margin-top: auto; }
.qgs .qgs-lever__wi input[type=range] { width: 100%; }

/* ═══ Narrateur du duel : une phrase à la fois, sous la scène */
/* Collé en bas de l'écran tant que la scène est visible : le lecteur lit sans faire défiler (overflow: clip sur la scène) */
.qgs .qgs-story { position: sticky; bottom: 0; z-index: 2; display: flex; align-items: flex-start; gap: 12px; min-height: 70px; padding: 14px 18px; border-top: 1px solid var(--stage-line); background: rgba(15, 23, 42, 0.9); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: var(--ink-100); font-size: 15px; line-height: 1.45; }
.qgs .qgs-story__when { flex: none; margin-top: 1px; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--stage-line); font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cyan-electric); white-space: nowrap; }
.qgs .qgs-story__when:empty { display: none; }
.qgs .qgs-story__text { margin: 0; }
.qgs .qgs-story__text strong { color: var(--paper); }
.qgs .qgs-story[data-tone="seen"] .qgs-story__when { color: var(--st-warn); border-color: rgba(245, 196, 81, 0.5); }
.qgs .qgs-story[data-tone="missed"] .qgs-story__when, .qgs .qgs-story[data-tone="lost"] .qgs-story__when { color: var(--st-context); border-color: rgba(255, 143, 163, 0.5); }
.qgs .qgs-story[data-tone="saved"] .qgs-story__when { color: var(--mint); border-color: rgba(110, 231, 183, 0.5); }
.qgs .qgs-story.is-in .qgs-story__text, .qgs .qgs-story.is-in .qgs-story__when { animation: qgs-story-in 0.45s var(--ease) both; }
@keyframes qgs-story-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 640px) { .qgs .qgs-story { flex-direction: column; gap: 6px; min-height: 104px; padding: 12px 14px; font-size: 14px; } }
@media (prefers-reduced-motion: reduce) { .qgs .qgs-story.is-in .qgs-story__text, .qgs .qgs-story.is-in .qgs-story__when { animation: none; } }

/* ═══ Matrice (bloc libre de la section leviers) */
.qgs .qgs-levers__intro { margin-bottom: 24px; }
.qgs .qgs-matrix { width: 100%; border-collapse: separate; border-spacing: 6px; font-size: 14px; }
.qgs .qgs-matrix th { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-500); font-weight: 700; text-align: left; padding: 4px 8px; }
.qgs .qgs-matrix td { padding: 12px 14px; border-radius: 10px; background: var(--paper-cool); color: var(--ink-700); vertical-align: top; }
.qgs .qgs-matrix td b { display: block; font-family: var(--font-heading); font-size: 18px; color: var(--royal); }
.qgs .qgs-matrix td small { color: var(--ink-500); }
.qgs .qgs-matrix td.is-hot { background: var(--paper-lavender); box-shadow: inset 3px 0 0 var(--violet); }
.qgs .qgs-matrix .qgs-matrix__row { white-space: nowrap; font-weight: 600; color: var(--royal); background: transparent; padding-left: 0; }
.qgs .qgs-matrix__wrap { overflow-x: auto; }
.qgs .qgs-matrix__note { font-size: 13px; color: var(--ink-500); margin-top: 6px; }

/* ═══ Théâtre de conversations (outil K) : deux écrans de messagerie + mosaïque de la journée */
.qgs .qgs-ct { padding: 52px 18px 18px; color: var(--ink-100); }
.qgs .qgs-ct__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
@media (max-width: 720px) { .qgs .qgs-ct { padding: 14px 8px 12px; } .qgs .qgs-ct__grid { gap: 8px; } }
.qgs .qgs-ct__lane { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.qgs .qgs-ct__head { display: flex; flex-direction: column; gap: 2px; }
.qgs .qgs-ct__head b { font-family: var(--font-heading); font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--st-warn); }
.qgs .qgs-ct__lane.is-rule .qgs-ct__head b { color: var(--mint); }
.qgs .qgs-ct__head span { font-size: 13px; color: var(--ink-300); }
.qgs .qgs-ct__phone { position: relative; display: flex; flex-direction: column; height: 318px; border-radius: 18px; border: 1px solid var(--stage-line); background: rgba(10, 16, 34, 0.75); overflow: hidden; }
.qgs .qgs-ct__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--stage-line); background: var(--stage-panel); }
.qgs .qgs-ct__name { font-family: var(--font-heading); font-weight: 700; font-size: 14px; color: var(--paper); }
.qgs .qgs-ct__name::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--mint); vertical-align: 1px; }
.qgs .qgs-ct__pat { position: relative; flex: 0 0 96px; height: 6px; border-radius: 999px; background: var(--stage-pipe); overflow: hidden; }
.qgs .qgs-ct__pat::before { content: "patience"; position: absolute; right: calc(100% + 8px); top: -4px; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-300); white-space: nowrap; }
.qgs .qgs-ct__pat { overflow: visible; }
.qgs .qgs-ct__pat i { display: block; height: 100%; width: 100%; border-radius: 999px; background: var(--mint); transition: width 0.5s var(--ease), background 0.5s; }
.qgs .qgs-ct__pat i[data-lvl="mid"] { background: var(--st-warn); }
.qgs .qgs-ct__pat i[data-lvl="low"] { background: var(--color-error); }
.qgs .qgs-ct__msgs { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 7px; padding: 12px; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 36px); mask-image: linear-gradient(180deg, transparent 0, #000 36px); }
.qgs .qgs-ct__msg { max-width: 82%; padding: 8px 12px; border-radius: 14px; font-size: 13.5px; line-height: 1.4; animation: qgs-msg-in 0.35s var(--ease) both; }
@keyframes qgs-msg-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } to { opacity: 1; transform: none; } }
.qgs .qgs-ct__msg.is-cust { align-self: flex-end; background: var(--azure); color: var(--paper); border-bottom-right-radius: 4px; }
.qgs .qgs-ct__msg.is-ai { align-self: flex-start; background: var(--stage-panel-hi); border: 1px solid rgba(0, 212, 255, 0.45); color: var(--ink-100); border-bottom-left-radius: 4px; }
.qgs .qgs-ct__msg.is-ai::before { content: "AI agent"; display: block; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cyan-electric); margin-bottom: 2px; }
.qgs .qgs-ct__msg.is-hum { align-self: flex-start; background: rgba(183, 148, 246, 0.16); border: 1px solid rgba(183, 148, 246, 0.6); color: var(--paper); border-bottom-left-radius: 4px; }
.qgs .qgs-ct__msg.is-hum::before { content: "Sarah · human agent"; display: block; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-search); margin-bottom: 2px; }
.qgs .qgs-ct__msg.is-sys { align-self: center; padding: 2px 8px; font-size: 11px; color: var(--ink-300); background: none; }
.qgs .qgs-ct__stamp { position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%) rotate(-8deg); padding: 8px 16px; border: 3px solid currentColor; border-radius: 10px; font-family: var(--font-heading); font-weight: 900; font-size: 18px; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; background: rgba(10, 16, 34, 0.85); animation: qgs-stamp 0.4s cubic-bezier(0.2, 1.6, 0.4, 1) both; }
@keyframes qgs-stamp { from { opacity: 0; transform: translate(-50%, -50%) rotate(-8deg) scale(1.8); } to { opacity: 1; transform: translate(-50%, -50%) rotate(-8deg) scale(1); } }
.qgs .qgs-ct__stamp[data-k="ai"] { color: var(--mint); }
.qgs .qgs-ct__stamp[data-k="hum"] { color: var(--cyan-electric); }
.qgs .qgs-ct__stamp[data-k="rep"] { color: var(--st-warn); }
.qgs .qgs-ct__stamp[data-k="gone"] { color: var(--st-context); }
.qgs .qgs-ct__tally { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0; }
.qgs .qgs-ct__tally div { min-width: 0; }
.qgs .qgs-ct__tally div { padding: 6px 8px; border-radius: 10px; background: var(--stage-panel); border: 1px solid var(--stage-line); }
.qgs .qgs-ct__tally dt { font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-300); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qgs .qgs-ct__tally dd { margin: 0; font-family: var(--font-heading); font-weight: 900; font-size: 20px; font-variant-numeric: tabular-nums; }
.qgs .qgs-ct__tally dd[data-k="ai"] { color: var(--mint); }
.qgs .qgs-ct__tally dd[data-k="hum"] { color: var(--cyan-electric); }
.qgs .qgs-ct__tally dd[data-k="rep"] { color: var(--st-warn); }
.qgs .qgs-ct__tally dd[data-k="gone"] { color: var(--st-context); }
.qgs .qgs-ct__mosaic { display: grid; grid-template-columns: repeat(auto-fill, minmax(7px, 1fr)); gap: 2px; }
.qgs .qgs-ct__mosaic i { aspect-ratio: 1; border-radius: 2px; background: rgba(148, 163, 184, 0.12); transition: background 0.3s, transform 0.3s; }
.qgs .qgs-ct__mosaic i.is-in { background: rgba(148, 163, 184, 0.35); }
.qgs .qgs-ct__mosaic i.is-ai { background: var(--mint); }
.qgs .qgs-ct__mosaic i.is-hum { background: var(--cyan-electric); }
.qgs .qgs-ct__mosaic i.is-rep { background: var(--st-warn); }
.qgs .qgs-ct__mosaic i.is-gone { background: var(--st-context); }
.qgs .qgs-ct__mosaic i.is-focus { outline: 2px solid var(--paper); outline-offset: 1px; transform: scale(1.4); position: relative; z-index: 1; }
.qgs .qgs-ct__per { font-size: 11px; color: var(--ink-300); }
.qgs .qgs-ct__caption { margin: 16px 0 0; padding: 12px 16px; border-radius: 12px; border: 1px solid var(--stage-line); background: rgba(15, 23, 42, 0.6); font-size: 15px; color: var(--ink-100); }
.qgs .qgs-ct__caption b { color: var(--paper); }
.qgs .qgs-ct__caption.is-in { animation: qgs-story-in 0.45s var(--ease) both; }
/* Mobile : les deux écrans restent côte à côte (c'est la comparaison qui compte), en version compacte */
@media (max-width: 720px) {
  .qgs .qgs-ct__head { min-height: 46px; } .qgs .qgs-ct__head b { font-size: 11px; } .qgs .qgs-ct__head span { font-size: 11px; line-height: 1.3; }
  .qgs .qgs-ct__phone { height: 300px; border-radius: 14px; }
  .qgs .qgs-ct__bar { padding: 7px 8px; gap: 6px; } .qgs .qgs-ct__name { font-size: 12px; } .qgs .qgs-ct__name::before { margin-right: 5px; }
  .qgs .qgs-ct__pat { flex-basis: 44px; } .qgs .qgs-ct__pat::before { display: none; }
  .qgs .qgs-ct__msgs { padding: 8px 6px; gap: 5px; }
  .qgs .qgs-ct__msg { max-width: 92%; padding: 6px 8px; font-size: 11.5px; border-radius: 10px; }
  .qgs .qgs-ct__msg.is-ai::before, .qgs .qgs-ct__msg.is-hum::before { font-size: 8.5px; }
  .qgs .qgs-ct__msg.is-hum::before { content: "Sarah · human"; }
  .qgs .qgs-ct__stamp { font-size: 12px; padding: 5px 8px; border-width: 2px; white-space: normal; width: 86%; text-align: center; line-height: 1.2; }
  .qgs .qgs-ct__tally { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
  .qgs .qgs-ct__tally div { padding: 4px 6px; } .qgs .qgs-ct__tally dt { font-size: 8.5px; } .qgs .qgs-ct__tally dd { font-size: 15px; }
  .qgs .qgs-ct__mosaic { grid-template-columns: repeat(auto-fill, minmax(5px, 1fr)); gap: 1.5px; }
  .qgs .qgs-ct__caption { font-size: 13.5px; padding: 10px 12px; }
}
@media (prefers-reduced-motion: reduce) { .qgs .qgs-ct__msg, .qgs .qgs-ct__stamp, .qgs .qgs-ct__caption.is-in { animation: none; } }

/* ═══ Outil K — le diagnostic, puis le remède, pas à pas */
.qgs .qgs-hx { padding: 52px 20px 20px; color: var(--ink-100); }
.qgs .qgs-hx__acts { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.qgs .qgs-hx__acts span { padding: 5px 12px; border-radius: 999px; border: 1px solid var(--stage-line); font-size: 12px; font-weight: 600; color: var(--ink-300); transition: all 0.3s; }
.qgs .qgs-hx__acts span.is-on { color: var(--navy); background: var(--cyan-electric); border-color: var(--cyan-electric); }
/* Le parcours en pleine largeur ; dessous, le compteur de douleur et la liste des critères */
.qgs .qgs-hx__main { display: grid; grid-template-columns: 1fr; gap: 14px; }
.qgs .qgs-hx__map { max-width: 760px; margin: 0 auto; }
.qgs .qgs-hx__panel { display: grid !important; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 12px; align-items: start; }
@media (max-width: 760px) { .qgs .qgs-hx { padding: 14px 12px 14px; } .qgs .qgs-hx__panel { grid-template-columns: 1fr; } }
.qgs .qgs-hx__map { width: 100%; height: auto; display: block; }
.qgs .qgs-hx__map text { font-family: var(--font-body); font-size: 12px; fill: var(--ink-200); }
.qgs .qgs-hx__map .qgs-hx__lbl { font-size: 11px; fill: var(--ink-300); letter-spacing: 0.04em; }
.qgs .qgs-hx__map .qgs-hx__num { font-family: var(--font-heading); font-weight: 900; font-size: 16px; }
.qgs .qgs-hx__path { fill: none; stroke: var(--stage-pipe); stroke-width: 6; stroke-linecap: round; }
.qgs .qgs-hx__hand { transition: stroke 0.5s; }
.qgs .qgs-hx__hand.is-ctx { stroke: rgba(0, 212, 255, 0.35); }
.qgs .qgs-hx__loop { fill: none; stroke: rgba(255, 143, 163, 0.55); stroke-width: 2; stroke-dasharray: 5 5; animation: qgs-hx-spin 6s linear infinite; transform-origin: 250px 150px; }
@keyframes qgs-hx-spin { to { transform: rotate(360deg); } }
.qgs .qgs-hx__node circle:first-child { fill: var(--stage-panel-hi); stroke: var(--stage-line); stroke-width: 1.5; }
.qgs .qgs-hx__node.is-ai circle:first-child { stroke: var(--cyan-electric); }
.qgs .qgs-hx__node.is-ai rect { fill: none; stroke: var(--cyan-electric); stroke-width: 1.6; }
.qgs .qgs-hx__node.is-hum circle:first-child { stroke: var(--st-search); }
.qgs .qgs-hx__eye { fill: var(--cyan-electric); }
.qgs .qgs-hx__ink { fill: var(--ink-200); }
.qgs .qgs-hx__box rect { fill: var(--stage-panel); stroke: var(--stage-line); }
.qgs .qgs-hx__box.is-ok .qgs-hx__num { fill: var(--mint); }
.qgs .qgs-hx__box.is-bad .qgs-hx__num { fill: var(--st-context); }
.qgs .qgs-hx__pain rect { fill: rgba(220, 38, 38, 0.18); stroke: var(--st-context); }
.qgs .qgs-hx__pain text { fill: var(--st-context); font-weight: 700; font-size: 12px; }
.qgs .qgs-hx__pain { transition: opacity 0.5s; }
.qgs .qgs-hx__pain.is-off { opacity: 0.25; }
.qgs .qgs-hx__gate rect { fill: var(--stage-panel); stroke: var(--ink-500); stroke-dasharray: 3 3; transition: all 0.4s; }
.qgs .qgs-hx__gate text { font-size: 10px; fill: var(--ink-500); font-weight: 700; }
.qgs .qgs-hx__gate path { stroke: var(--ink-500); stroke-width: 1; }
.qgs .qgs-hx__gate.is-on rect { fill: rgba(110, 231, 183, 0.25); stroke: var(--mint); stroke-dasharray: none; }
.qgs .qgs-hx__gate.is-on text { fill: var(--mint); }
.qgs .qgs-hx__gate.is-on { animation: qgs-hx-pop 0.5s cubic-bezier(0.2, 1.6, 0.4, 1); transform-box: fill-box; transform-origin: center; }
.qgs .qgs-hx__gate.is-sum.is-on rect { fill: var(--paper); stroke: var(--cyan-electric); }
.qgs .qgs-hx__gate.is-sum.is-on path { stroke: var(--royal); }
@keyframes qgs-hx-pop { 0% { transform: scale(0.4); } 100% { transform: scale(1); } }
.qgs .qgs-hx__dot { fill: var(--ink-300); }
.qgs .qgs-hx__dot.is-loop { fill: var(--st-context); }
.qgs .qgs-hx__dot.is-ai { fill: var(--mint); }
.qgs .qgs-hx__dot.is-hum { fill: var(--cyan-electric); }
.qgs .qgs-hx__dot.is-rep { fill: var(--st-warn); }
.qgs .qgs-hx__dot.is-gone { fill: var(--color-error); }
.qgs .qgs-hx__panel { display: flex; flex-direction: column; gap: 10px; }
.qgs .qgs-hx__meter { padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(255, 143, 163, 0.5); background: rgba(220, 38, 38, 0.08); }
.qgs .qgs-hx__meter small { display: block; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--st-context); }
.qgs .qgs-hx__meter b { display: block; font-family: var(--font-heading); font-weight: 900; font-size: 44px; line-height: 1.1; color: var(--paper); font-variant-numeric: tabular-nums; }
.qgs .qgs-hx__meter span { font-size: 12px; color: var(--ink-300); }
.qgs .qgs-hx__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.qgs .qgs-hx__steps li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 10px; border: 1px dashed var(--stage-line); color: var(--ink-300); transition: all 0.4s; }
.qgs .qgs-hx__steps li b { display: block; font-size: 13px; color: inherit; }
.qgs .qgs-hx__steps li small { display: block; font-size: 11px; color: var(--ink-500); }
.qgs .qgs-hx__num-b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--stage-line); font-size: 11px; font-weight: 700; }
.qgs .qgs-hx__steps li em { font-style: normal; font-family: var(--font-heading); font-weight: 900; font-size: 15px; color: var(--mint); white-space: nowrap; }
.qgs .qgs-hx__steps li.is-on { border-style: solid; border-color: rgba(110, 231, 183, 0.6); background: rgba(110, 231, 183, 0.08); color: var(--paper); animation: qgs-in 0.4s var(--ease); }
.qgs .qgs-hx__steps li.is-on .qgs-hx__num-b { background: var(--mint); color: var(--navy); border-color: var(--mint); }
.qgs .qgs-hx__steps li.is-ok em { font-size: 11px; font-weight: 700; color: var(--ink-200); }
.qgs .qgs-hx__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 0; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--stage-line); background: rgba(15, 23, 42, 0.6); }
.qgs .qgs-hx__say { flex: 1 1 320px; margin: 0; font-size: 15px; line-height: 1.45; color: var(--ink-100); }
.qgs .qgs-hx__say b, .qgs .qgs-hx__say strong { color: var(--paper); }
.qgs .qgs-hx__say.is-in { animation: qgs-story-in 0.45s var(--ease) both; }
.qgs .qgs-hx__btns { display: flex; gap: 8px; flex-wrap: wrap; }
.qgs .qgs-hx__btns [hidden] { display: none !important; }
.qgs .qgs-hx__all { color: var(--ink-100); border: 1px solid var(--stage-line); }
.qgs .qgs-hx__fall { display: flex; align-items: flex-end; gap: 6px; height: 120px; margin-top: 16px; padding: 0 4px; }
.qgs .qgs-hx__bar { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 3px; }
.qgs .qgs-hx__bar i { width: 100%; max-width: 56px; height: var(--h); min-height: 0; border-radius: 6px 6px 2px 2px; background: rgba(148, 163, 184, 0.15); transition: height 0.7s var(--ease), background 0.4s; order: 2; }
.qgs .qgs-hx__bar b { order: 1; font-family: var(--font-heading); font-size: 13px; color: var(--paper); min-height: 16px; }
.qgs .qgs-hx__bar small { order: 3; font-size: 10px; color: var(--ink-300); white-space: nowrap; }
.qgs .qgs-hx__bar.is-start i { background: var(--st-context); }
.qgs .qgs-hx__bar.is-on i { background: var(--cyan-electric); }
.qgs .qgs-hx__bar.is-end.is-on i { background: var(--mint); }
@media (max-width: 760px) { .qgs .qgs-hx__say { font-size: 14px; } .qgs .qgs-hx__btns { width: 100%; } .qgs .qgs-hx__btns .qgs-btn { flex: 1 1 auto; } .qgs .qgs-hx__bar small { font-size: 8.5px; } }
@media (prefers-reduced-motion: reduce) { .qgs .qgs-hx__loop, .qgs .qgs-hx__gate.is-on, .qgs .qgs-hx__steps li.is-on, .qgs .qgs-hx__say.is-in { animation: none; } }

/* Mobile : le parcours garde l'essentiel (flux, portes, chiffres en grand) ; le détail est dans le compteur et la liste */
@media (max-width: 760px) {
  .qgs .qgs-hx__map .qgs-hx__lbl, .qgs .qgs-hx__map .qgs-hx__node text, .qgs .qgs-hx__pain { display: none; }
  .qgs .qgs-hx__map .qgs-hx__num { font-size: 26px; }
  .qgs .qgs-hx__gate text { font-size: 16px; }
  .qgs .qgs-hx__dot { r: 6px; }
}

/* ═══ Résultat visuel d'un levier « Et si… ? » : grand chiffre, écart, barres Today / Your target */
.qgs .qgs-wi { display: grid; gap: 10px; margin-top: 6px; padding: 12px 14px; border-radius: 12px; background: var(--paper-cool); }
.qgs .qgs-wi__big { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; }
.qgs .qgs-wi__big b { font-family: var(--font-heading); font-weight: 900; font-size: 34px; line-height: 1; color: var(--royal); font-variant-numeric: tabular-nums; }
.qgs .qgs-wi__big span { font-size: 13px; color: var(--ink-500); }
.qgs .qgs-wi__big em { margin-left: auto; padding: 3px 10px; border-radius: 999px; font-style: normal; font-weight: 700; font-size: 13px; background: var(--ink-100); color: var(--ink-700); font-variant-numeric: tabular-nums; }
.qgs .qgs-wi__big em.is-good { background: rgba(110, 231, 183, 0.25); color: #047857; }
.qgs .qgs-wi__big em.is-bad { background: rgba(220, 38, 38, 0.12); color: var(--color-error); }
.qgs .qgs-wi__bars { display: grid; gap: 6px; }
.qgs .qgs-wi__bars div { display: grid; grid-template-columns: 74px minmax(0, 1fr) 40px; align-items: center; gap: 8px; }
.qgs .qgs-wi__bars small { font-size: 11px; color: var(--ink-500); }
.qgs .qgs-wi__bars i { display: block; height: 10px; border-radius: 999px; background: var(--st-context); transition: width 0.35s var(--ease); }
.qgs .qgs-wi__bars i.is-target { background: var(--grad); }
.qgs .qgs-wi__bars span { font-family: var(--font-heading); font-weight: 700; font-size: 13px; color: var(--royal); text-align: right; font-variant-numeric: tabular-nums; }
.qgs .qgs-wi__trade { margin: 0; font-size: 12.5px; color: var(--ink-500); }
.qgs .qgs-wi__trade strong { color: var(--royal); }
.qgs .qgs-lever__ico:empty { display: none; }

/* Titre « avant → après » : un peu plus petit pour tenir sur une ligne, y compris sur mobile */
.qgs .qgs-report__big.is-range { font-size: clamp(38px, 8vw, 86px); }

/* Matrices sur mobile : chaque ligne devient une petite carte, chaque valeur porte le nom de sa colonne */
@media (max-width: 640px) {
  .qgs .qgs-matrix, .qgs .qgs-matrix tbody, .qgs .qgs-matrix tr, .qgs .qgs-matrix td { display: block; width: 100%; }
  .qgs .qgs-matrix thead { display: none; }
  .qgs .qgs-matrix { border-spacing: 0; }
  .qgs .qgs-matrix tr { margin-bottom: 12px; }
  .qgs .qgs-matrix td { margin-top: 4px; }
  .qgs .qgs-matrix .qgs-matrix__row { padding: 0 0 2px; white-space: normal; }
  .qgs .qgs-matrix td[data-l]::before { content: attr(data-l); display: block; margin-bottom: 2px; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-500); }
}

/* ═════════ Outil E — la mosaïque des relectures (scène HTML, mêmes briques que K) ═════════ */
.qgs .qgs-qa__board { display: grid; gap: 10px; }
.qgs .qgs-qa__hud { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.qgs .qgs-qa__pill { display: inline-flex; align-items: baseline; gap: 8px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--stage-line); font-size: 12px; color: var(--ink-200); }
.qgs .qgs-qa__pill b { font-family: var(--font-heading); font-weight: 900; font-size: 18px; color: var(--paper); font-variant-numeric: tabular-nums; }
.qgs .qgs-qa__pill small { font-size: 12px; color: var(--ink-300); }
.qgs .qgs-qa__pill.is-found { border-color: rgba(255, 143, 163, 0.5); }
.qgs .qgs-qa__pill.is-found b { color: var(--st-context); }
.qgs .qgs-qa__scale { margin-left: auto; font-size: 12px; color: var(--ink-300); }
.qgs .qgs-qa__grid { position: relative; display: grid; grid-template-columns: repeat(var(--cols, 24), minmax(0, 1fr)); gap: 3px; }
.qgs .qgs-qa__t { position: relative; aspect-ratio: 1; min-width: 0; padding: 0; border: 0; border-radius: 4px; background: var(--stage-panel-hi); box-shadow: inset 0 0 0 1px rgba(53, 147, 238, 0.2); cursor: pointer; transition: transform 0.2s var(--ease), background 0.3s, box-shadow 0.3s, opacity 0.3s; }
.qgs .qgs-qa__t:hover:not(:disabled) { background: #283a6b; transform: scale(1.18); z-index: 1; }
.qgs .qgs-qa__t:disabled { cursor: default; }
.qgs .qgs-qa__t.is-ok { background: rgba(110, 231, 183, 0.5); box-shadow: none; animation: qgs-qa-flip 0.35s var(--ease); }
.qgs .qgs-qa__t.is-bad { background: var(--color-error); box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.35), 0 0 12px rgba(220, 38, 38, 0.6); animation: qgs-qa-flip 0.35s var(--ease); z-index: 1; }
.qgs .qgs-qa__t.is-missed { background: rgba(255, 143, 163, 0.14); box-shadow: inset 0 0 0 1.5px var(--st-context); animation: qgs-qa-miss 0.6s var(--ease) both; }
.qgs .qgs-qa__grid.is-done .qgs-qa__t:not(.is-ok):not(.is-bad):not(.is-missed) { opacity: 0.45; }
.qgs .qgs-qa__t.is-sig::after { content: ""; position: absolute; top: 18%; right: 18%; width: 26%; height: 26%; border-radius: 50%; background: var(--st-warn); opacity: 0.55; }
.qgs .qgs-qa__t.is-sig[data-n="2"]::after { opacity: 0.85; width: 34%; height: 34%; }
.qgs .qgs-qa__t.is-sig[data-n="3"]::after { opacity: 1; width: 40%; height: 40%; box-shadow: 0 0 6px var(--st-warn); }
.qgs .qgs-qa__t.is-new::before { content: ""; position: absolute; left: 0; top: 15%; bottom: 15%; width: 3px; border-radius: 2px; background: var(--cyan-electric); }
.qgs .qgs-qa__t.is-ok::after, .qgs .qgs-qa__t.is-bad::after { opacity: 0; }
.qgs .qgs-qa__lens { position: absolute; left: -17px; top: -17px; width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--cyan-electric); box-shadow: 0 0 0 4px rgba(0, 212, 255, 0.12), 0 0 18px rgba(0, 212, 255, 0.45); pointer-events: none; opacity: 0; transition: transform 0.14s var(--ease), opacity 0.3s; z-index: 2; }
.qgs .qgs-qa__lens::after { content: ""; position: absolute; right: -9px; bottom: -6px; width: 11px; height: 3px; border-radius: 2px; background: var(--cyan-electric); transform: rotate(45deg); }
.qgs .qgs-qa__lens.is-on { opacity: 1; }
.qgs .qgs-qa__grid.is-done .qgs-qa__lens { opacity: 0; }
@keyframes qgs-qa-flip { 0% { transform: rotateY(90deg) scale(0.8); } 100% { transform: none; } }
@keyframes qgs-qa-miss { 0% { opacity: 0; transform: scale(0.6); } 100% { opacity: 1; transform: none; } }
.qgs .qgs-qa__meter { border-color: rgba(110, 231, 183, 0.45); background: rgba(110, 231, 183, 0.06); }
.qgs .qgs-qa__meter small { color: var(--mint); }
.qgs .qgs-hx__btns .qgs-btn:disabled { opacity: 0.6; cursor: wait; }
@media (max-width: 760px) { .qgs .qgs-qa .qgs-hx__foot { order: -1; } .qgs .qgs-qa__scale { margin-left: 0; width: 100%; } .qgs .qgs-qa__grid { gap: 2px; } .qgs .qgs-qa__t { border-radius: 3px; } }
@media (prefers-reduced-motion: reduce) { .qgs .qgs-qa__t, .qgs .qgs-qa__lens { transition: none; animation: none !important; } }

/* Les trois paniers (rapport) */
.qgs .qgs-qa__baskets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 8px 0 6px; }
.qgs .qgs-qa__baskets article { padding: 18px 18px 16px; border-radius: 16px; background: var(--paper); border: 1px solid var(--ink-100); border-top: 4px solid var(--bc); box-shadow: 0 6px 20px rgba(27, 0, 89, 0.05); }
.qgs .qgs-qa__baskets span { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-400); }
.qgs .qgs-qa__baskets b { display: block; margin-top: 6px; font-family: var(--font-heading); font-weight: 900; font-size: 26px; color: var(--royal); }
.qgs .qgs-qa__baskets h4 { margin: 2px 0 6px; font-family: var(--font-heading); font-size: 16px; color: var(--ink-700); }
.qgs .qgs-qa__baskets p { margin: 0; font-size: 14px; color: var(--ink-500); line-height: 1.5; }
@media (max-width: 760px) { .qgs .qgs-qa__baskets { grid-template-columns: minmax(0, 1fr); } }

/* Outil (section générique) et grille à 12 critères */
.qgs .qgs-tool__lead { max-width: 680px; color: var(--ink-500); margin-bottom: 0; }
.qgs .qgs-qg { margin-top: 18px; display: grid; gap: 16px; }
.qgs .qgs-qg__guard { margin: 0; padding: 12px 16px; border-radius: 12px; border-left: 3px solid var(--azure); background: var(--paper-cool); font-size: 14px; color: var(--ink-500); }
.qgs .qgs-qg__guard b { color: var(--ink-700); }
.qgs .qgs-qg__cols { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.qgs .qgs-qg__blocks { display: grid; gap: 12px; }
.qgs .qgs-qg__block { margin: 0; padding: 6px 16px 10px; border: 1px solid var(--ink-100); border-radius: 16px; background: var(--paper); }
.qgs .qgs-qg__block legend { padding: 0 8px; font-family: var(--font-heading); font-weight: 700; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--azure); }
.qgs .qgs-qg__row { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--paper-cool); }
.qgs .qgs-qg__row:first-of-type { border-top: 0; }
.qgs .qgs-qg__n { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; background: var(--paper-lavender); color: var(--royal); font-size: 12px; font-weight: 700; }
.qgs .qgs-qg__lbl { font-size: 14.5px; color: var(--ink-700); }
.qgs .qgs-qg__seg { display: inline-flex; gap: 3px; padding: 3px; border-radius: 12px; background: var(--paper-cool); border: 1px solid var(--ink-100); flex-wrap: wrap; }
.qgs .qgs-qg__seg button { min-height: 36px; min-width: 52px; padding: 0 10px; border: 0; border-radius: 9px; background: transparent; font: 600 13px var(--font-body); color: var(--ink-500); cursor: pointer; transition: background 0.2s, color 0.2s; }
.qgs .qgs-qg__seg button:hover { background: var(--paper); color: var(--ink-700); }
.qgs .qgs-qg__seg button[aria-pressed="true"] { background: var(--royal); color: var(--paper); }
.qgs .qgs-qg__row .qgs-qg__seg button[data-v="2"][aria-pressed="true"] { background: #0F8A5F; }
.qgs .qgs-qg__row .qgs-qg__seg button[data-v="1"][aria-pressed="true"] { background: #B7791F; }
.qgs .qgs-qg__row .qgs-qg__seg button[data-v="0"][aria-pressed="true"] { background: var(--color-error); }
.qgs .qgs-qg__row .qgs-qg__seg button[data-v="na"][aria-pressed="true"] { background: var(--ink-400); }
.qgs .qgs-qg__card { position: sticky; top: 96px; padding: 20px; border-radius: 18px; background: var(--paper); border: 1px solid var(--ink-100); box-shadow: 0 10px 30px rgba(27, 0, 89, 0.08); display: grid; gap: 12px; }
.qgs .qgs-qg__ring { --p: 0; width: 132px; height: 132px; margin: 0 auto; border-radius: 50%; display: grid; place-content: center; text-align: center; background: radial-gradient(closest-side, var(--paper) 78%, transparent 79%), conic-gradient(var(--azure), var(--violet) calc(var(--p) * 1%), var(--paper-cool) 0); transition: background 0.3s; }
.qgs .qgs-qg__ring b { font-family: var(--font-heading); font-weight: 900; font-size: 40px; line-height: 1; color: var(--royal); }
.qgs .qgs-qg__ring small { font-size: 12px; color: var(--ink-400); }
.qgs .qgs-qg__count { margin: 0; text-align: center; font-size: 13px; color: var(--ink-400); }
.qgs .qgs-qg__bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.qgs .qgs-qg__bars li { display: grid; grid-template-columns: 92px minmax(0, 1fr) 30px; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-500); }
.qgs .qgs-qg__bars i { height: 8px; border-radius: 4px; background: var(--paper-cool); overflow: hidden; }
.qgs .qgs-qg__bars s { display: block; height: 100%; background: var(--grad); transition: width 0.4s var(--ease); }
.qgs .qgs-qg__bars li.is-low s { background: var(--color-error); }
.qgs .qgs-qg__bars em { font-style: normal; font-weight: 700; text-align: right; color: var(--ink-700); }
.qgs .qgs-qg__focus { margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--paper-lavender); font-size: 13.5px; color: var(--ink-500); }
.qgs .qgs-qg__focus small { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--violet); }
.qgs .qgs-qg__focus b { color: var(--royal); }
.qgs .qgs-qg__acts { display: grid; gap: 8px; }
@media (max-width: 900px) { .qgs .qgs-qg__cols { grid-template-columns: minmax(0, 1fr); } .qgs .qgs-qg__card { position: static; } }
@media (max-width: 600px) { .qgs .qgs-qg__row { grid-template-columns: 26px minmax(0, 1fr); } .qgs .qgs-qg__row .qgs-qg__seg { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); } .qgs .qgs-qg__seg button { min-height: 44px; min-width: 0; } }


/* ═════════ Funnel de prise de rendez-vous (commun page vidéo / page simulateur) ═════════ */
/* Lien vers la page vidéo, sous l'en-tête du simulateur */
.qgs .qg-funnel-story { display: flex; justify-content: center; align-items: center; gap: 12px; flex-wrap: wrap; margin: -36px auto 28px; padding: 0 20px; text-align: center; }
.qgs .qg-story-link { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px 10px 12px; border-radius: 999px; border: 1px solid var(--ink-100); background: var(--paper); color: var(--royal); font: 600 15px var(--font-body); text-decoration: none; box-shadow: 0 6px 18px rgba(27, 0, 89, 0.06); transition: border-color 0.2s, box-shadow 0.2s; }
.qgs .qg-story-link::before { content: "▶"; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--grad); color: var(--paper); font-size: 10px; padding-left: 2px; }
.qgs .qg-story-link:hover { border-color: var(--azure); box-shadow: 0 8px 24px rgba(53, 147, 238, 0.18); }
.qgs .qg-cta-meta { display: block; margin-top: 6px; font-size: 13px; color: var(--ink-400); }
.qgs .qg-funnel-story .qg-cta-meta { width: 100%; margin-top: 0; }
.qgs .qg-cta-form { width: 100%; margin-top: 14px; padding: 18px; border-radius: 14px; background: var(--paper-cool); text-align: left; }
.qgs .qg-cta-form[hidden] { display: none; }

/* Bandeau sous le résultat du rapport : la personne + la phrase + le bouton */
.qgs .qg-report-cta { display: flex; align-items: center; gap: 16px; max-width: 880px; margin: 28px auto 0; padding: 16px 18px 16px 16px; border-radius: 18px; background: var(--paper); border: 1px solid var(--ink-100); box-shadow: 0 10px 30px rgba(27, 0, 89, 0.08); text-align: left; }
.qgs .qg-report-cta p { flex: 1; margin: 0; font-family: var(--font-heading); font-weight: 700; font-size: 17px; color: var(--royal); line-height: 1.35; }
.qgs .qg-report-cta > div { flex: none; text-align: center; }
.qgs .qg-report-cta__who img, .qgs .qg-report-cta__who i, .qgs .qg-sticky__who img, .qgs .qg-sticky__who i, .qgs .qgs-call__who img, .qgs .qgs-call__who > i { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: var(--grad); color: var(--paper); font: 900 15px var(--font-heading); font-style: normal; }
.qgs .qg-report-cta.is-flash, .qgs .qgs-call.is-flash { animation: qgst-flash 1.4s var(--ease); }
@keyframes qgst-flash { 0% { box-shadow: 0 0 0 0 rgba(53, 147, 238, 0.6); } 100% { box-shadow: 0 0 0 24px rgba(53, 147, 238, 0); } }

/* Fiche consultant dans la carte « appel » et calendrier intégré */
.qgs .qgs-call__who { display: flex; align-items: center; gap: 12px; margin: 4px 0 14px; }
.qgs .qgs-call__who b { display: block; font-family: var(--font-heading); font-size: 16px; color: var(--paper); }
.qgs .qgs-call__who small { display: block; font-size: 13px; color: var(--ink-300); }
.qgs .qgs-call__who a, .qgs .qgst-in { display: inline-block; margin-top: 2px; font-size: 12px; font-weight: 600; color: var(--cyan-electric); }
.qgs .qgst-in { color: var(--azure); }
.qgs .qgs-call__embed { margin-top: 14px; min-height: 560px; border-radius: 14px; background: var(--paper); overflow: hidden; }
.qgs .qgs-call__embed[hidden] { display: none; }
.qgs .qgs-call__embed iframe, .qgs .qgs-call__embed .meetings-iframe-container, .qgs .qgst-cal iframe { display: block; width: 100%; min-height: 560px; border: 0; }
.qgs .qgs-call__empty-box { display: grid; place-content: center; padding: 24px; text-align: center; background: rgba(255, 255, 255, 0.06); border: 1px dashed var(--stage-line); }
.qgs .qgs-call__empty-box .qgs-call__empty { color: var(--ink-200); font-size: 14px; }

/* Barre de rendez-vous flottante */
.qgs .qg-sticky { position: fixed; left: 50%; bottom: 18px; z-index: 60; width: min(760px, calc(100% - 24px)); display: flex; align-items: center; gap: 14px; padding: 10px 10px 10px 12px; border-radius: 999px; background: rgba(15, 23, 42, 0.94); border: 1px solid var(--stage-line); box-shadow: 0 18px 50px rgba(15, 23, 42, 0.35); transform: translate(-50%, 140%); opacity: 0; transition: transform 0.4s var(--ease), opacity 0.3s; backdrop-filter: blur(8px); }
.qgs .qg-sticky[hidden] { display: none; }
.qgs .qg-sticky.is-in { transform: translate(-50%, 0); opacity: 1; }
.qgs .qg-sticky p { flex: 1; margin: 0; font-size: 15px; font-weight: 600; color: var(--ink-100); line-height: 1.3; }
.qgs .qg-sticky .qgs-btn { flex: none; padding: 12px 20px; }
.qgs .qg-sticky__who img, .qgs .qg-sticky__who i { width: 38px; height: 38px; font-size: 13px; }
.qgs .qg-sticky__x { flex: none; width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; color: var(--ink-300); font-size: 22px; line-height: 1; cursor: pointer; }
.qgs .qg-sticky__x:hover { background: rgba(255, 255, 255, 0.08); color: var(--paper); }
@media (max-width: 640px) {
  .qgs .qg-report-cta { flex-wrap: wrap; } .qgs .qg-report-cta > div { width: 100%; } .qgs .qg-report-cta .qgs-btn { width: 100%; justify-content: center; }
  .qgs .qg-sticky { border-radius: 18px; bottom: 10px; } .qgs .qg-sticky p { font-size: 13px; } .qgs .qg-sticky__who { display: none; }
}
@media (prefers-reduced-motion: reduce) { .qgs .qg-sticky { transition: none; } .qgs .qg-report-cta.is-flash, .qgs .qgs-call.is-flash { animation: none; } }
/* Message adapté à la taille de l'organisation (rapport et carte de RDV) */
.qgs .qg-report-cta .qg-size-note { display: block; margin-top: 6px; font-family: var(--font-body); font-weight: 400; font-size: 15px; color: var(--ink-700); line-height: 1.5; }
.qgs .qgs-call .qgs-call__size { margin: -8px 0 18px; padding-left: 12px; border-left: 2px solid var(--azure); color: var(--ink-100); font-size: 15px; }
.qgs .qg-size-note[hidden] { display: none; }
/* L'unité du grand chiffre du rapport ne se coupe jamais en deux (« cette année », « every week ») */
.qgs .qgs-report__big small { white-space: nowrap; }
/* Retour Chanon 10/2026 (tous les simulateurs) : les encadrés de résultat des cartes « paniers » alignés d'une carte à l'autre
   (sous-grille : chaque ligne de carte — titre, chiffre, texte, indicateur, réglage, résultat — a la même hauteur dans les trois cartes) */
@supports (grid-template-rows: subgrid) {
  .qgs .qgs-lever { display: grid; grid-template-rows: subgrid; grid-row: span 8; row-gap: 12px; }
  .qgs .qgs-lever__wi { display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 8px; }
  .qgs .qgs-lever__wi label { align-self: end; }
}
.qgs .qgs-event__more { display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 18px; font-weight: 600; font-size: 15px; color: var(--azure); text-decoration: none; }
.qgs .qgs-event__more:hover { text-decoration: underline; }

/* ═══ Barre de commandes (10/2026) : horloge + Rejouer / Pause / Passer / Modifier, collée en haut de la scène
   tant que la simulation est à l'écran (sticky dans .qgs-stage, qui est en overflow: clip) */
.qgs .qgs-bar { position: sticky; top: var(--qgs-sticky-top, 0px); z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; padding: 10px 12px; border-bottom: 1px solid var(--stage-line); background: rgba(15, 23, 42, 0.92); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.qgs .qgs-bar .qgs-clock { position: static; margin: 0; flex: 0 1 auto; min-width: 0; }
.qgs .qgs-bar .qgs-duel__ctrl { margin: 0; flex-wrap: nowrap; justify-content: flex-end; gap: 6px; }
.qgs .qgs-bar .qgs-ctl { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 6px 14px; font-size: 13.5px; white-space: nowrap; }
.qgs .qgs-bar .qgs-ctl[hidden] { display: none; }
.qgs .qgs-ic { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.qgs [data-act="pause"] .qgs-ic, .qgs [data-act="skip"] .qgs-ic { fill: currentColor; stroke-width: 1.5; }
.qgs [data-act="pause"] .qgs-ic__play, .qgs [data-act="pause"].is-paused .qgs-ic__pause { display: none; }
.qgs [data-act="pause"].is-paused .qgs-ic__play { display: inline; }
.qgs .qgs-ctl--skip { border-color: rgba(53, 147, 238, 0.55); color: var(--paper); }
/* Le narrateur (en bas) et la barre (en haut) encadrent la scène ; plus de horloge en surimpression */
@media (max-width: 860px) { .qgs .qgs-bar .qgs-ctl { padding: 6px 11px; } .qgs .qgs-bar .qgs-ctl__t:not(.qgs-ctl__t--keep) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }

/* Légende : dépliée sur ordinateur (JS), repliée sur mobile */
.qgs .qgs-legwrap { margin-top: 14px; }
.qgs .qgs-legwrap > summary { display: none; }
.qgs .qgs-legwrap .qgs-legend { margin-top: 0; }

/* Curseurs « Ajustez vos chiffres » : le titre est un bouton, actif sur mobile seulement */
.qgs .qgs-tune__head { width: 100%; padding: 0; border: 0; background: none; font: inherit; text-align: left; cursor: default; align-items: baseline; }
.qgs .qgs-tune__chev { display: none; }

@media (max-width: 640px) {
  .qgs .qgs-duel { padding: 36px 0 32px; }
  .qgs .qgs-duel .qgs-headline { margin-bottom: 14px; }
  .qgs .qgs-bar { flex-wrap: wrap; padding: 8px; gap: 8px; }
  .qgs .qgs-bar .qgs-clock { flex: 1 1 100%; justify-content: space-between; }
  .qgs .qgs-bar .qgs-duel__ctrl { flex: 1 1 100%; justify-content: space-between; }
  .qgs .qgs-bar .qgs-ctl { min-width: 44px; min-height: 44px; justify-content: center; padding: 6px 10px; }
  .qgs .qgs-bar .qgs-ctl--skip { flex: 1; }
  /* Curseurs repliés */
  .qgs .qgs-tune { padding: 0; margin-bottom: 12px; }
  .qgs .qgs-tune__head { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; min-height: 52px; padding: 10px 44px 10px 16px; margin: 0; position: relative; cursor: pointer; }
  .qgs .qgs-tune__head:focus-visible { outline: 2px solid var(--cyan-electric); outline-offset: -2px; border-radius: 14px; }
  .qgs .qgs-tune__chev { display: block; position: absolute; right: 18px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border-right: 2px solid var(--ink-200); border-bottom: 2px solid var(--ink-200); transform: rotate(45deg); transition: transform 0.2s var(--ease); }
  .qgs .qgs-tune.is-open .qgs-tune__chev { transform: rotate(-135deg); margin-top: -2px; }
  .qgs .qgs-tune:not(.is-open) .qgs-tune__head span { display: none; }
  .qgs .qgs-tune:not(.is-open) .qgs-tune__grid { display: none; }
  .qgs .qgs-tune.is-open .qgs-tune__grid { padding: 0 16px 14px; }
  /* Légende repliée derrière « Légende » */
  .qgs .qgs-legwrap { margin-top: 10px; text-align: center; }
  .qgs .qgs-legwrap > summary { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px; color: var(--ink-200); font-size: 13px; cursor: pointer; list-style: none; }
  .qgs .qgs-legwrap > summary::-webkit-details-marker { display: none; }
  .qgs .qgs-legwrap > summary::before { content: "?"; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--ink-300); font-size: 11px; font-weight: 700; }
  .qgs .qgs-legwrap[open] > summary { color: var(--paper); }
}
@media (prefers-reduced-motion: reduce) { .qgs .qgs-tune__chev { transition: none; } }
/* Mobile : barre de rendez-vous flottante réduite au bouton (le texte s'empilait sur 6 lignes et masquait la scène) */
@media (max-width: 640px) {
  .qgs .qg-sticky { gap: 6px; padding: 6px 6px 6px 8px; border-radius: 999px; }
  .qgs .qg-sticky p { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .qgs .qg-sticky__who { display: block; }
  .qgs .qg-sticky .qgs-btn { flex: 1; justify-content: center; padding: 11px 16px; }
}
/* Section événement retirée (hors des dates d'affichage) : la carte rendez-vous reste seule, centrée */
.qgs .qgs-next__grid.is-solo { grid-template-columns: minmax(0, 760px); justify-content: center; }

/* ── Blog The Lab : le thème colore tous les liens du corps au survol (.qg-post-body__inner a:hover → violet).
      On garde la couleur de nos liens-boutons (spécificité renforcée par .qgs.qgs). */
.qgs.qgs a.qgs-btn--primary:is(:hover, :focus, :active, :visited) { color: var(--paper); }
.qgs.qgs a.qgs-btn--ghost:is(:hover, :focus) { color: var(--azure); }
.qgs.qgs .qgs-duel__ctrl a.qgs-btn--ghost:is(:hover, :focus) { color: var(--paper); }
.qgs.qgs a.qgs-btn--ghost-light:is(:hover, :focus, :visited) { color: var(--paper); }
.qgs.qgs a.qg-story-link:is(:hover, :focus, :visited) { color: var(--royal); }
.qgs.qgs a.qgs-hero__link:is(:hover, :focus, :visited) { color: var(--ink-500); }
.qgs.qgs a.qgs-event__more:is(:hover, :focus, :visited) { color: var(--azure); }
.qgs.qgs a.qgst-in:is(:hover, :focus, :visited) { color: var(--azure); }
.qgs.qgs .qgs-call__who a:is(:hover, :focus, :visited) { color: var(--cyan-electric); }
.qgs.qgs .qgst-links a.qgst-links__m:is(:hover, :focus, :visited) { color: var(--ink-700); }