/* Presencia del buscador global: velo claro 58%, blur 5px y superficie 560px. */
html:has(#about-demo[open]) { overflow: hidden; }
.qv-demo-about {
  box-sizing: border-box; position: fixed; inset: clamp(24px, 8vh, 80px) 0 auto;
  width: min(560px, calc(100vw - 32px)); max-width: none;
  max-height: calc(100dvh - clamp(24px, 8vh, 80px) - 24px);
  margin: 0 auto; padding: 0; overflow: hidden;
  border: 1px solid var(--qv-surface-border, #dfe6ee); border-radius: 18px;
  background: #fff; color: var(--qv-content-ink, #0b1220);
  box-shadow: 0 16px 48px rgb(24 34 48 / 10%), 0 2px 8px rgb(24 34 48 / 4%);
  font: 400 13px/1.65 Inter, system-ui, sans-serif;
}
.qv-demo-about[open] { display: flex; flex-direction: column; animation: qv-demo-about-enter 160ms ease-out; }
.qv-demo-about::backdrop { background: rgb(247 248 250 / 86%); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .qv-demo-about::backdrop { background: rgb(247 248 250 / 58%); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
}
.qv-demo-about__head { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 24px 12px; font-size: 12px; color: var(--qv-content-muted, #64748b); }
.qv-demo-about .qv-demo-about__close { appearance: none; display: inline-grid; place-items: center; flex: none; width: 26px; height: 26px; border: 0; border-radius: 50%; padding: 0; background: radial-gradient(circle closest-side, #f3f4f6 96%, transparent) center / 26px 26px no-repeat; color: #526175; cursor: pointer; }
.qv-demo-about__close svg { width: 13px; height: 13px; }
.qv-demo-about__body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 6px 24px 22px; }
.qv-demo-about h2 { margin: 0 0 18px; font-size: 29px; font-weight: 600; line-height: 1.15; letter-spacing: -.035em; }
.qv-demo-about p { margin: 0 0 13px; color: var(--qv-content-muted, #64748b); font-size: 13px; line-height: 1.7; }
.qv-demo-about strong { font-weight: 500; color: var(--qv-content-ink, #0b1220); }
.qv-demo-about section { margin-top: 23px; }
.qv-demo-about h3 { margin: 0 0 3px; font-size: 13px; font-weight: 600; }
.qv-demo-about .qv-demo-about__note { margin-bottom: 12px; font-size: 12px; }
.qv-demo-about a { color: var(--qv-content-ink, #0b1220); text-decoration: none; }
.qv-demo-about__sources { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.qv-demo-about__sources a { display: grid; grid-template-columns: 1fr auto; gap: 4px; padding: 12px; border: 1px solid #e6ebf2; border-radius: 10px; font-size: 10px; }
.qv-demo-about__sources strong { grid-column: 1; font-size: 22px; line-height: 1.2; }
.qv-demo-about__sources span { grid-column: 2; grid-row: 2; align-self: end; color: var(--qv-content-muted, #64748b); font-size: 15px; }
.qv-demo-about__detail { margin-top: 12px; color: var(--qv-content-muted, #64748b); font-size: 12px; }
.qv-demo-about .qv-demo-about__disclosure { appearance: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 44px; padding: 10px 12px; border: 0; border-radius: 10px; background: #f7f8fa; color: var(--qv-content-muted, #64748b); font: 500 12px/1.5 Inter, system-ui, sans-serif; text-align: left; cursor: pointer; }
.qv-demo-about .qv-demo-about__disclosure svg { width: 16px; height: 16px; flex: none; transition: transform 160ms ease; }
.qv-demo-about__disclosure[aria-expanded="true"] svg { transform: rotate(180deg); }
.qv-demo-about__disclosure:hover { background: #eef1f5; color: var(--qv-content-ink, #0b1220); }
.qv-demo-about__detail [hidden] { display: none; }
.qv-demo-about__detail p { margin: 0; padding: 12px 12px 4px; font-size: 12px; }
.qv-demo-about__links { margin-top: 15px; border-top: 1px solid #e6ebf2; }
.qv-demo-about__links a { display: flex; justify-content: space-between; align-items: center; gap: 15px; min-height: 44px; padding-block: 10px; border-bottom: 1px solid #eef1f5; font-size: 12px; }
.qv-demo-about__links a:last-child { border-bottom: 0; }
.qv-demo-about a:hover { color: var(--brand); }
.qv-demo-about__sources a:hover { background: #f7f8fa; }
.qv-demo-about-trigger { display: inline-flex; align-items: center; gap: 7px; padding: 6px 0; min-height: 36px; border: 0; background: transparent; color: var(--qv-content-muted, #64748b); font: 500 12px/1.4 Inter, system-ui, sans-serif; cursor: pointer; }
.qv-demo-about-trigger svg { width: 15px; height: 15px; }
.qv-demo-about-trigger:hover { color: var(--qv-content-ink, #0b1220); }
.qv-demo-about :is(a,button):focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.qv-demo-about :is(a,button):focus:not(:focus-visible) { outline: none; }
@media (max-width: 1024px), (pointer: coarse) {
  .qv-demo-about .qv-demo-about__close { width: 44px; height: 44px; background-size: 28px 28px; }
  .qv-demo-about__close svg { width: 14px; height: 14px; }
  .qv-demo-about-trigger { min-height: 44px; }
}
@media (max-width: 560px) {
  .qv-demo-about__head { padding: 10px 16px 4px; }
  .qv-demo-about__body { padding: 6px 20px 18px; }
  .qv-demo-about h2 { font-size: 27px; }
  .protection-page .app-header { flex-wrap: wrap; height: auto; padding-block: 12px; row-gap: 8px; }
  .protection-page .app-actions { flex-basis: 100%; justify-content: flex-end; }
  .protection-page .app-actions [data-about-demo] { margin-right: auto; }
}
@keyframes qv-demo-about-enter { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .qv-demo-about[open] { animation: none; } .qv-demo-about .qv-demo-about__disclosure svg { transition: none; } }
@media (prefers-reduced-transparency: reduce) { .qv-demo-about::backdrop { background: #f7f8fa; backdrop-filter: none; -webkit-backdrop-filter: none; } }