
@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@400;500&display=swap');
#xy-pv-real{--xy-bg:light-dark(#fff,#151515);--xy-ink:light-dark(#0a0a0a,#f2f2f2);--xy-muted:light-dark(#626262,#b1b1b1);--xy-line:light-dark(#e5e5e5,#393939);--xy-soft:light-dark(#f5f5f5,#202020);color:var(--xy-ink);background:var(--xy-bg);font:15px/1.65 Inter,Arial,sans-serif;color-scheme:light}
#xy-pv-real *{box-sizing:border-box}#xy-pv-real h1,#xy-pv-real h2,#xy-pv-real h3,#xy-pv-real p,#xy-pv-real figure{margin:0}#xy-pv-real a{color:inherit}#xy-pv-real .xy-wrap{width:calc(100% - 48px);max-width:1150px;margin:auto}#xy-pv-real .xy-nav{padding:22px 0;display:flex;gap:24px;justify-content:space-between;align-items:center;border-bottom:1px solid var(--xy-line)}#xy-pv-real .xy-brand{font-weight:500;letter-spacing:.2em;font-size:13px}#xy-pv-real .xy-nav span:last-child{font-size:12px;color:var(--xy-muted)}#xy-pv-real .xy-intro{padding:72px 0 44px}#xy-pv-real .xy-kicker{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--xy-muted);margin-bottom:20px}#xy-pv-real h1{font:400 clamp(54px,8vw,92px)/1.05 'Instrument Serif',Georgia,serif;margin-bottom:28px}#xy-pv-real .xy-lead{font:400 clamp(27px,4vw,42px)/1.15 'Instrument Serif',Georgia,serif;max-width:700px;margin-bottom:22px}#xy-pv-real .xy-description{max-width:720px;color:var(--xy-muted)}#xy-pv-real .xy-shot{padding:16px;background:var(--xy-soft);border-radius:12px}#xy-pv-real img{width:100%;display:block;height:auto}#xy-pv-real figcaption{font-size:12px;color:var(--xy-muted);padding-top:12px}#xy-pv-real .xy-section{padding:70px 0;border-bottom:1px solid var(--xy-line)}#xy-pv-real .xy-editorial{display:grid;grid-template-columns:1fr 1.3fr;gap:56px}#xy-pv-real h2{font:400 clamp(30px,4vw,44px)/1.15 'Instrument Serif',Georgia,serif}#xy-pv-real h3{font-size:16px;font-weight:500;margin-bottom:10px}#xy-pv-real .xy-copy p{color:var(--xy-muted);margin-bottom:28px}#xy-pv-real .xy-copy p:last-child{margin-bottom:0}#xy-pv-real .xy-archive{margin-top:34px;max-height:560px;overflow:hidden;border-radius:8px}#xy-pv-real .xy-docs{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:34px}#xy-pv-real details{margin-top:12px}#xy-pv-real summary{font-size:13px;font-weight:500;padding:12px 0;cursor:pointer}#xy-pv-real details img{margin-top:12px}#xy-pv-real .xy-doc-thumb{max-height:320px;overflow:hidden;background:#fff;border:1px solid var(--xy-line)}#xy-pv-real .xy-process{list-style:none;padding:0;margin:32px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:18px}#xy-pv-real .xy-process li{border-top:1px solid var(--xy-line);padding-top:18px}#xy-pv-real .xy-process span{color:var(--xy-muted);font-size:12px}#xy-pv-real .xy-process b{display:block;font-weight:500;margin:12px 0 8px}#xy-pv-real .xy-process p{font-size:13px;color:var(--xy-muted)}#xy-pv-real .xy-cta{padding:76px 0;text-align:center}#xy-pv-real .xy-cta p{max-width:620px;margin:24px auto;color:var(--xy-muted)}#xy-pv-real .xy-button{display:inline-block;background:var(--xy-ink);color:var(--xy-bg);text-decoration:none;padding:15px 27px;border-radius:30px;font-size:14px}#xy-pv-real .xy-foot{padding:22px 0;border-top:1px solid var(--xy-line);font-size:12px;color:var(--xy-muted)}
@media(max-width:680px){#xy-pv-real .xy-wrap{width:calc(100% - 32px)}#xy-pv-real .xy-intro{padding-top:44px}#xy-pv-real .xy-editorial{grid-template-columns:1fr;gap:25px}#xy-pv-real .xy-section{padding:44px 0}#xy-pv-real .xy-process{grid-template-columns:1fr}#xy-pv-real .xy-process li{display:grid;grid-template-columns:30px 1fr;gap:0 12px}#xy-pv-real .xy-process b{margin:0 0 6px}#xy-pv-real .xy-process p{grid-column:2}#xy-pv-real .xy-docs{grid-template-columns:1fr}#xy-pv-real .xy-shot{padding:6px}}

#xy-pv-real .pv-screen{overflow:hidden;aspect-ratio:1888/865;border-radius:6px;background:#f5f8fa}
#xy-pv-real .pv-screen img{margin-top:-3.44%}
#xy-pv-real .xy-archive{max-height:none;aspect-ratio:1887/843}
#xy-pv-real .xy-archive img{margin-top:-3.81%}
#xy-pv-real .pv-document{overflow:hidden;aspect-ratio:990/930;background:#fff}
#xy-pv-real .pv-document img{margin-top:-16.16%}
#xy-pv-real .pv-drawing{aspect-ratio:990/1000}
#xy-pv-real details img{margin-top:-16.16%}
#xy-pv-real .xy-doc-thumb{max-height:320px}
#xy-pv-real .xy-intro{padding-top:60px}
.pv-home-screen{width:100%;aspect-ratio:1888/865;overflow:hidden;background:#f5f8fa}
.project-image .pv-home-screen img{width:100%;height:auto;object-fit:initial;display:block;margin-top:-3.44%;transform:none}
.project-summary .pv-home-lead{font-family:var(--serif);font-size:26px;line-height:1.15;color:#fff;margin-bottom:16px}
@media(max-width:680px){#xy-pv-real .xy-intro{padding-top:36px}}

/* Demonstration workflow with safe source captures; all content remains visible without JS. */
#xy-pv-real .pv-demo-note{max-width:740px;margin-top:20px;color:var(--xy-muted);font-size:13px}
#xy-pv-real .pv-workflow-list{margin-top:40px}
#xy-pv-real .pv-workflow-step{display:grid;grid-template-columns:240px minmax(0,1fr);gap:35px;padding:34px 0;border-top:1px solid var(--xy-line);align-items:start}
#xy-pv-real .pv-step-number{display:block;font-size:12px;color:var(--xy-muted);margin-bottom:15px}
#xy-pv-real .pv-step-copy h3{font-size:20px;line-height:1.3;margin-bottom:14px}
#xy-pv-real .pv-step-copy p{font-size:14px;color:var(--xy-muted)}
#xy-pv-real .pv-workflow-image{border:1px solid var(--xy-line);border-radius:8px;overflow:hidden;background:#f5f8fa}
#xy-pv-real .pv-workflow-document{max-width:560px;border:1px solid var(--xy-line);background:#fff}
#xy-pv-real .pv-demo-download{display:inline-block;margin-top:20px;font-size:13px;text-underline-offset:5px}
@media(max-width:850px){#xy-pv-real .pv-workflow-step{grid-template-columns:1fr;gap:20px}#xy-pv-real .pv-workflow-document{max-width:100%}}

/* A compact, manual workflow viewer. Progressive enhancement keeps every step available without JS. */
#xy-pv-real .pv-workflow-controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
#xy-pv-real .pv-workflow-controls[hidden],#xy-pv-real .pv-workflow-step[hidden]{display:none}
#xy-pv-real .pv-workflow-select{appearance:none;font:inherit;font-size:13px;border:1px solid var(--xy-line);background:var(--xy-bg);color:var(--xy-ink);padding:12px 16px;border-radius:24px;cursor:pointer;min-height:44px}
#xy-pv-real .pv-workflow-select span{opacity:.65;margin-right:6px}
#xy-pv-real .pv-workflow-select[aria-pressed="true"]{background:var(--xy-ink);color:var(--xy-bg);border-color:var(--xy-ink)}
#xy-pv-real .pv-workflow-select:hover{border-color:var(--xy-ink)}
#xy-pv-real .pv-workflow-select:focus-visible{outline:2px solid var(--xy-ink);outline-offset:4px}
#xy-pv-real .pv-workflow-list{margin-top:24px}
#xy-pv-real .pv-workflow-step{padding:24px 0 0;border-top:0;grid-template-columns:215px minmax(0,1fr);gap:30px}
#xy-pv-real .pv-workflow-image{align-self:start}
#xy-pv-real .pv-order-document{margin:0}
#xy-pv-real .pv-order-document summary{padding:16px 0;border-top:1px solid var(--xy-line);border-bottom:1px solid var(--xy-line)}
#xy-pv-real .pv-order-document .pv-workflow-document{margin-top:20px}
#xy-pv-real .xy-docs{margin-top:22px;gap:28px}
#xy-pv-real .xy-docs details{margin:0;border-top:1px solid var(--xy-line);border-bottom:1px solid var(--xy-line)}
@media(max-width:850px){#xy-pv-real .pv-workflow-step{grid-template-columns:1fr;gap:20px}}
@media(max-width:480px){#xy-pv-real .pv-workflow-controls{gap:8px}#xy-pv-real .pv-workflow-select{padding:11px 13px;font-size:12px}}
