/* Spatial layers enhance native scrolling. Every scene has a static layout. */
.qf-document [hidden] { display:none!important; }
.qf-document .qf-motion-control { display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 2px;border:0;border-radius:0;background:transparent;color:#a9b8cc;font:500 13px/1.4 "QF Sans",sans-serif;cursor:pointer;white-space:nowrap; }
.qf-document .qf-sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
.qf-motion-control:hover { color:#fff; }
.qf-motion-control__dot { width:7px;height:7px;border-radius:50%;background:#708199;box-shadow:0 0 0 4px #1e3047; }
.qf-motion-control[aria-pressed="true"] .qf-motion-control__dot { background:#9fcaff;box-shadow:0 0 0 4px #243e66; }
.qf-document :is(.qf-motion-control,.qf-product button,.qf-playground button):focus-visible { outline:3px solid #4d91ff;outline-offset:5px; }
.qf-busywork { position:relative;isolation:isolate;padding-bottom:24px; }
.qf-busywork__accent path { animation:none; }
.qf-busywork__layout { z-index:1; }
.qf-orbit-scene { position:absolute;inset:0;z-index:2;pointer-events:none; }
.qf-orbit-word { position:absolute;left:51%;top:17%;font:760 clamp(170px,18vw,280px)/1 "QF Sans",sans-serif;letter-spacing:-.065em;color:transparent;-webkit-text-stroke:1px #839bb3;opacity:.28; }
.qf-orbit-rings { position:absolute;left:42%;top:21%;width:66%;height:67%;transform:rotate(-18deg); }
.qf-orbit-rings i { position:absolute;inset:0;border:1px solid #839bb3;border-radius:50%;opacity:.14; }
.qf-orbit-rings i:nth-child(2) { inset:7% 5%; }
.qf-orbit-rings i:nth-child(3) { inset:14% 10%; }
.qf-orbit-rings i:nth-child(4) { inset:21% 15%; }
.qf-orbit-rings i::before { content:"";position:absolute;left:25%;top:4%;width:7px;height:7px;background:#829ebf;border:3px solid #07111f;border-radius:50%;box-shadow:0 0 0 1px #829ebf; }
.qf-orbit-rings i:nth-child(2)::before { left:84%;top:17%; }
.qf-orbit-rings i:nth-child(3)::before { left:23%;top:auto;bottom:4%; }
.qf-orbit-rings i:nth-child(4)::before { left:80%;top:auto;bottom:10%; }
.qf-hero-annotation { position:absolute;z-index:2;left:70%;top:76%;display:flex;align-items:center;gap:12px;max-width:26%;font-size:clamp(13px,1.2vw,18px);line-height:1.4;color:#9fcaff;pointer-events:none; }
.qf-hero-annotation::before { content:"";width:clamp(20px,4vw,70px);height:22px;border-top:1px solid #8096b0;border-right:1px solid #8096b0;transform:skew(45deg);flex-shrink:0; }
.qf-hero-rail { position:relative;z-index:2;display:flex;align-items:center;gap:24px;margin-top:52px; }
.qf-hero-rail > a { display:inline-flex;gap:14px;align-items:center;min-height:44px;color:#a9b8cc;font-size:13px;text-decoration:none;white-space:nowrap; }
.qf-hero-rail > a:hover { color:#fff; }
.qf-hero-rail > a .qf-arrow { width:16px;transform:rotate(90deg); }
.qf-hero-rail::after { content:"";height:1px;background:#36485e;flex:1;order:1; }
.qf-hero-rail .qf-motion-control { order:2; }
.qf-home .qf-depth-project { position:relative;z-index:2;border-radius:clamp(28px,5vw,72px) clamp(28px,5vw,72px) 0 0;background:#fff; }
.qf-home { background:#07111f; }
.qf-product { padding-top:18px; }
.qf-product__stage { position:relative;perspective:1500px;isolation:isolate;margin:0 8px 0 0; }
.qf-product__stage::before { content:"";position:absolute;inset:0;z-index:-1;background:#dce8fb;border:1px solid #bfd1ec;border-radius:12px;transform:translate(9px,-12px) rotate(1.2deg); }
.qf-document .qf-product__frame { position:relative;margin:0;background:#07111f;border:1px solid #8da4c2;border-radius:10px;box-shadow:0 24px 45px -32px #193857;overflow:hidden;transform-origin:50% 90%; }
.qf-product__frame figcaption { display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:54px;padding:12px 22px;font-size:13px;line-height:1.5;color:#c6d4e7; }
.qf-product__frame figcaption > span { color:#f4f7fc;font-weight:600; }
.qf-product__frame figcaption a { display:inline-flex;align-items:center;gap:12px;color:#bdd7ff;min-height:30px;white-space:nowrap; }
.qf-product__frame figcaption svg { width:16px; }
.qf-product__image { position:relative; }
.qf-product__image > a { display:block;cursor:zoom-in; }
.qf-product__image img { display:block;width:100%;height:auto;object-fit:contain; }
.qf-product__points { position:absolute;inset:0;pointer-events:none; }
.qf-document .qf-product__point { position:absolute;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #9fcaff;border-radius:50%;color:#fff;background:#11263f;box-shadow:0 0 0 6px #07111f99;font:700 15px/1 "QF Sans",sans-serif;pointer-events:auto;cursor:pointer; }
.qf-product__point[aria-pressed="true"] { background:#1555fa;box-shadow:0 0 0 6px #1555fa44; }
.qf-product__point:hover { background:#1555fa; }
.qf-product__point--0 { left:33%;top:29%; }
.qf-product__point--1 { left:42%;top:47%; }
.qf-product__point--2 { left:78%;top:47%; }
.qf-product__controls { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:38px;border-bottom:1px solid #d2dce8; }
.qf-document .qf-product__controls button { display:flex;align-items:center;gap:14px;padding:18px 0;border:0;border-bottom:3px solid transparent;border-radius:0;background:none;text-align:left;font:650 clamp(16px,1.5vw,21px)/1.3 "QF Sans",sans-serif;color:#53657d;cursor:pointer; }
.qf-product__controls button span { color:#637895;font-size:14px; }
.qf-product__controls button[aria-pressed="true"] { border-bottom-color:#1555fa;color:#0d2446; }
.qf-product__controls button[aria-pressed="true"] span { color:#1555fa; }
.qf-product__notes { max-width:900px;min-height:60px;margin-top:20px; }
.qf-document .qf-product__notes p { font-size:18px;line-height:1.65;color:#40536e; }
.qf-document .qf-product .qf-product__hint { margin-top:10px;color:#5b6c82;font-size:13px; }
.qf-playground { position:relative;isolation:isolate;overflow:hidden;padding:clamp(90px,11vw,164px) 0 34px;background:#07111f;color:#edf2f7; }
.qf-playground__layout { position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.05fr);gap:68px 64px;align-items:center; }
.qf-playground__backdrop { position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden; }
.qf-playground__backdrop > span { position:absolute;top:28px;left:35%;font:760 clamp(90px,15vw,230px)/1 "QF Sans",sans-serif;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px #768aa4;opacity:.2; }
.qf-playground__backdrop > i { position:absolute;left:35%;right:3%;top:44px;bottom:17%;border-top:1px dashed #264a76;border-left:1px dashed #264a76; }
.qf-playground__backdrop > i::after { content:"";position:absolute;bottom:0;left:-45px;width:180px;height:150px;background:radial-gradient(circle,#477bb9 1px,transparent 1px) 0 0/18px 18px;opacity:.24; }
.qf-document .qf-playground h2 { margin:0;font-size:clamp(36px,3.35vw,48px);line-height:1.07;letter-spacing:-.045em;font-weight:720; }
.qf-document .qf-playground__intro > p { margin:25px 0 0;font-size:19px;line-height:1.6;color:#b3c1d3; }
.qf-document .qf-playground__intro .qf-playground__label { margin-top:40px;color:#9fcaff;text-transform:uppercase;letter-spacing:.06em;font-size:12px;font-weight:650; }
.qf-playground__steps { display:grid;gap:10px;margin-top:15px; }
.qf-document .qf-playground__steps button { display:flex;align-items:center;gap:15px;width:100%;min-height:64px;padding:12px 17px;border:1px solid #536a88;border-radius:8px;background:transparent;color:#eaf0f9;text-align:left;font:600 16px/1.35 "QF Sans",sans-serif;cursor:pointer; }
.qf-playground__steps button > span { color:#bdd7ff;font-size:21px;border-right:1px solid #42618b;padding-right:15px; }
.qf-playground__steps button > .qf-arrow { width:17px;margin-left:auto;flex-shrink:0; }
.qf-playground__steps button[aria-pressed="true"] { background:#1555fa;border-color:#588eff; }
.qf-playground__steps button[aria-pressed="true"] > span { color:#fff;border-right-color:#668ff5; }
.qf-playground__steps button:hover { border-color:#9fcaff; }
.qf-document .qf-playground__intro .qf-playground__hint { margin-top:16px;font-size:14px; }
.qf-playground .qf-editorial-link { margin-top:26px; }
.qf-playground__workbench { min-width:0;perspective:1400px; }
.qf-workflow-sheets { display:grid;grid-template-columns:1.14fr 1fr .98fr;align-items:center;gap:0;min-height:480px; }
.qf-workflow-sheet { position:relative;min-width:0;padding:24px 22px 32px;min-height:414px;border:1px solid #d7e1ef;border-radius:12px;background:#f6f8fc;color:#07172f;box-shadow:0 24px 48px -20px #0009;transform-origin:center; }
.qf-workflow-sheet--capture { z-index:3;min-height:470px;transform:rotate(-3deg); }
.qf-workflow-sheet--connect { z-index:2;transform:translate(-6px,8px) rotate(2deg); }
.qf-workflow-sheet--handoff { z-index:1;border-color:#2a75ed;background:#091a30;color:#edf2f7;transform:translate(-9px,20px) rotate(5deg); }
.qf-workflow-sheet__top { display:flex;align-items:center;justify-content:space-between;gap:16px;color:#1555fa;font-size:22px;font-weight:650; }
.qf-workflow-sheet--handoff .qf-workflow-sheet__top { color:#7bb6ff; }
.qf-workflow-sheet svg { width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0; }
.qf-workflow-sheet .qf-arrow { width:20px; }
.qf-document .qf-workflow-sheet h3 { margin:34px 0 0;font-size:clamp(21px,2vw,29px);line-height:1.2;font-weight:720;letter-spacing:-.035em;color:inherit; }
.qf-document .qf-workflow-sheet blockquote { display:flex;gap:12px;align-items:flex-start;margin:28px 0;padding:18px 14px;border:1px solid #d3ddeb;border-radius:10px;background:#fff;color:#102844; }
.qf-workflow-sheet blockquote > span { font:700 48px/1 Georgia,serif;color:#1555fa; }
.qf-document .qf-workflow-sheet blockquote p { margin:0;font-size:17px;line-height:1.5; }
.qf-workflow-sheet dl { margin:0; }
.qf-workflow-sheet dl > div + div { margin-top:22px; }
.qf-workflow-sheet dt { font-size:10px;letter-spacing:.08em;color:#4b6281;text-transform:uppercase;font-weight:650; }
.qf-workflow-sheet dd { display:flex;align-items:center;gap:10px;margin:10px 0 0;font-size:15px;line-height:1.4; }
.qf-workflow-sheet dd svg { color:#1555fa; }
.qf-document .qf-workflow-sheet ul { list-style:none;margin:26px 0 0;padding:0;display:grid;gap:13px; }
.qf-workflow-sheet li { display:flex;align-items:center;gap:12px;min-height:61px;padding:12px 10px;font-size:15px;line-height:1.4; }
.qf-context-pieces li { background:#e9f0fc;border:1px solid #dbe6f8;border-radius:10px; }
.qf-context-pieces svg { color:#1555fa; }
.qf-handoff-checks li { border-bottom:1px dashed #324c70;padding:13px 0; }
.qf-handoff-checks svg { color:#7bb6ff; }
.qf-workflow-sheet.is-current { z-index:4;outline:1px solid #7dafec;outline-offset:3px; }
.qf-playground__advance { display:flex;align-items:center;justify-content:flex-end;gap:28px;min-height:66px;margin-top:46px; }
.qf-document .qf-playground__advance p { margin:0;font-size:18px;color:#a9b8cc;white-space:nowrap; }
.qf-playground__advance p > span:first-child { color:#9fcaff; }
.qf-document .qf-playground__advance .qf-button { min-height:56px;padding:14px 24px;font-size:16px;width:auto;flex-shrink:0; }
.qf-document .qf-playground__disclaimer { grid-column:1/-1;text-align:center;margin:0;font-size:12px;color:#a9b8cc; }
.qf-home .qf-playground + .qf-delivery { padding-top:70px;border-top:1px solid #2a3e57; }
.qf-delivery__steps { position:relative; }
.qf-delivery__steps::after { content:"";position:absolute;left:0;right:0;top:28px;height:1px;background:#9fcaff;transform:scaleX(1);transform-origin:left;pointer-events:none; }
.qf-delivery__number { position:relative;z-index:1; }
.qf-studio-story figure { overflow:hidden; }
.qf-studio-story figure img { transform-origin:center; }
.qf-studio-story figure figcaption { position:relative;z-index:1;background:#fff;margin-top:0;padding-top:16px; }
.qf-document .qf-latest .qf-insight-row { grid-template-columns:210px minmax(0,1fr) 24px;gap:32px;align-items:center;padding:28px 0; }
.qf-insight-row__media { display:block;overflow:hidden;background:#eef2f8;aspect-ratio:3/2;border:1px solid #d2dce8; }
.qf-insight-row__media img { display:block;width:100%;height:100%;object-fit:contain; }
.qf-insight-row__copy { display:grid;gap:12px; }
.qf-document .qf-latest .qf-insight-row strong { grid-row:auto;font-size:clamp(24px,2.4vw,34px);line-height:1.2; }
.qf-document .qf-latest .qf-insight-row > .qf-arrow { grid-column:3;grid-row:1; }
.qf-document .qf-latest .qf-insight-row:not(:has(.qf-insight-row__media)) { grid-template-columns:minmax(0,1fr) 24px; }
.qf-document .qf-latest .qf-insight-row:not(:has(.qf-insight-row__media)) > .qf-arrow { grid-column:2; }
.qf-footer__bottom .qf-motion-control { margin-left:auto; }
/* Only decorative and illustrative layers move; main copy keeps its geometry. */
@media(min-width:781px) and (prefers-reduced-motion:no-preference) {
 .qf-motion-active .qf-busywork__accent path { animation:qf-busywork-underline 1.1s ease-out both; }
 .qf-motion-active .qf-orbit-scene { transform:translate3d(0,var(--qf-back-y,0px),0); }
 .qf-motion-active .qf-busywork__art img { transform:perspective(1000px) translate3d(var(--qf-pointer-x,0px),var(--qf-art-y,0px),0) rotateY(var(--qf-pointer-tilt,0deg)); }
 .qf-motion-active .qf-hero-annotation { transform:translate3d(0,var(--qf-label-y,0px),0); }
 .qf-motion-active .qf-product__frame { transform:rotateX(var(--qf-frame-tilt,0deg)) translate3d(0,var(--qf-frame-y,0px),0); }
 .qf-motion-active .qf-playground__backdrop { transform:translate3d(0,var(--qf-back-y,0px),0); }
 .qf-motion-active .qf-workflow-sheets { transform:translate3d(0,var(--qf-sheets-y,0px),0); }
 .qf-motion-active .qf-workflow-sheet { transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease; }
 .qf-motion-active .qf-workflow-sheet--capture.is-current { transform:translateY(-12px) rotate(-3deg); }
 .qf-motion-active .qf-workflow-sheet--connect.is-current { transform:translate(-6px,-12px) rotate(0deg); }
 .qf-motion-active .qf-workflow-sheet--handoff.is-current { transform:translate(-9px,-12px) rotate(1deg); }
 .qf-motion-active .qf-studio-story figure img { transform:translate3d(0,var(--qf-photo-y,0px),0) scale(1.08); }
 .qf-motion-active .qf-workflow-sketch li:first-child { transform:translate3d(calc(var(--qf-sketch-x,0px) * -1),0,0) rotate(-1deg); }
 .qf-motion-active .qf-workflow-sketch li:last-child { transform:translate3d(var(--qf-sketch-x,0px),0,0) rotate(1deg); }
 .qf-motion-active .qf-delivery__steps::after { transform:scaleX(var(--qf-trace,0)); }
}
@media(max-width:1100px) {
 .qf-hero-annotation { left:62%;top:68%;max-width:32%;font-size:13px; }
 .qf-playground__layout { grid-template-columns:1fr;gap:56px; }
 .qf-playground__intro { max-width:680px; }
 .qf-document .qf-playground h2 { font-size:46px; }
 .qf-playground__steps { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .qf-document .qf-playground__steps button { gap:10px;padding:13px 12px;font-size:14px; }
 .qf-playground__steps button > span { font-size:17px;padding-right:10px; }
 .qf-playground__steps button > .qf-arrow { display:none; }
 .qf-workflow-sheets { min-height:440px; }
 .qf-workflow-sheet { padding:24px 22px 28px; }
 .qf-document .qf-workflow-sheet h3 { font-size:27px; }
 .qf-playground__backdrop > span { top:28px;left:4%;font-size:19vw; }
 .qf-product__controls { gap:18px; }
 .qf-document .qf-product__controls button { gap:9px; }
 .qf-document .qf-latest .qf-insight-row { grid-template-columns:170px minmax(0,1fr) 24px;gap:24px; }
}
@media(max-width:780px) {
 .qf-orbit-word { top:29%;left:37%;font-size:190px;opacity:.26; }
 .qf-orbit-rings { left:30%;top:27%;width:90%;height:44%; }
 .qf-hero-annotation { display:none; }
 .qf-hero-rail { margin-top:28px;gap:18px; }
 .qf-hero-rail > a,.qf-document .qf-motion-control { font-size:12px; }
 .qf-busywork { padding-bottom:18px; }
 .qf-product { padding-top:10px; }
 .qf-product__stage { margin-right:4px; }
 .qf-product__stage::before { transform:translate(4px,-7px) rotate(1deg); }
 .qf-product__frame figcaption { padding:10px 12px;min-height:48px;font-size:11px;gap:8px; }
 .qf-product__frame figcaption a { gap:6px; }
 .qf-product__frame figcaption svg { width:12px; }
 .qf-document .qf-product__point { width:44px;height:44px;font-size:13px;box-shadow:0 0 0 3px #07111f99; }
 .qf-product__controls { margin-top:24px;gap:12px; }
 .qf-document .qf-product__controls button { display:block;font-size:15px;padding:14px 0; }
 .qf-product__controls button span { display:block;margin-bottom:9px;font-size:12px; }
 .qf-product__notes { min-height:96px;margin-top:18px; }
 .qf-document .qf-product__notes p { font-size:16px; }
 .qf-document .qf-product .qf-product__hint { font-size:12px; }
 .qf-playground { padding:72px 0 30px; }
 .qf-playground__layout { gap:40px; }
 .qf-document .qf-playground h2 { font-size:38px; }
 .qf-document .qf-playground__intro > p { font-size:17px;margin-top:22px; }
 .qf-document .qf-playground__intro .qf-playground__label { margin-top:28px; }
 .qf-playground__steps { gap:8px; }
 .qf-document .qf-playground__steps button { display:block;min-height:90px;padding:12px 10px;font-size:13px; }
 .qf-playground__steps button > span { display:block;margin-bottom:8px;padding:0;border:0;font-size:17px; }
 .qf-playground__advance { justify-content:space-between;margin-top:30px; }
 .qf-document .qf-playground__disclaimer { font-size:11px;line-height:1.6; }
 .qf-delivery__steps::after { display:none; }
 .qf-document .qf-latest .qf-insight-row { grid-template-columns:130px minmax(0,1fr) 20px;gap:18px; }
 .qf-document .qf-latest .qf-insight-row strong { font-size:22px; }
 .qf-insight-row__copy { gap:8px; }
 .qf-footer__bottom .qf-motion-control { margin-left:0; }
}
@media(max-width:700px) {
 .qf-orbit-rings { left:13%;top:29%;width:115%;height:29%; }
 .qf-workflow-sheets { display:grid;grid-template-columns:1fr;gap:24px;min-height:0; }
 .qf-workflow-sheet { width:100%;min-height:0;padding:26px;border-radius:10px;transform:none; }
 .qf-workflow-sheet--capture,.qf-workflow-sheet--connect,.qf-workflow-sheet--handoff { transform:none; }
 .qf-playground.is-interactive .qf-workflow-sheets { min-height:418px;align-items:stretch; }
 .qf-playground.is-interactive .qf-workflow-sheet:not(.is-current) { display:none; }
 .qf-playground.is-interactive .qf-workflow-sheet { min-height:418px; }
 .qf-document .qf-workflow-sheet h3 { font-size:28px;margin-top:24px; }
 .qf-document .qf-workflow-sheet blockquote { padding:18px;margin-block:24px; }
 .qf-workflow-sheet dl { display:grid;grid-template-columns:1fr 1fr;gap:18px; }
 .qf-workflow-sheet dl > div + div { margin:0; }
 .qf-workflow-sheet dd { font-size:14px;gap:8px; }
 .qf-workflow-sheet dd svg { width:18px; }
 .qf-workflow-sheet li { min-height:62px;font-size:17px; }
}
@media(max-width:480px) {
 .qf-document .qf-latest .qf-insight-row { grid-template-columns:92px minmax(0,1fr) 16px;gap:14px; }
 .qf-document .qf-latest .qf-insight-row strong { font-size:19px; }
 .qf-latest .qf-insight-row time { font-size:11px; }
 .qf-document .qf-product__point { width:36px;height:36px; }
 .qf-product__point::before { content:"";position:absolute;inset:-4px; }
 .qf-product__point--0 { left:29%;top:22%; }
 .qf-product__point--1 { left:42%;top:55%; }
 .qf-product__point--2 { left:78%;top:48%; }
}
@media(prefers-reduced-motion:reduce) {
 .qf-document :is(.qf-workflow-sheet,.qf-product__frame,.qf-busywork__art img,.qf-orbit-scene,.qf-playground__backdrop) { transition:none;animation:none; }
}