/* Download first; show the real tray-to-client path below. */
.dl-hero .dl-hero-grid{display:block}
.download-intro{display:grid;grid-template-columns:1.5fr .85fr;gap:48px;align-items:center;margin-bottom:30px}
.download-intro>div:first-child{display:grid;gap:14px}
.dl-hero .download-intro h1{font-size:clamp(30px,3.1vw,42px);line-height:1.32}
.download-intro .dl-img.photo{max-height:210px;border-radius:22px}
.download-intro .dl-img.photo img{height:210px;object-fit:cover}
.download-intro .dl-img.photo span{font-size:11px;left:12px;bottom:12px}
.dl-hero .download-picker{padding:0;border:0;background:transparent;box-shadow:none}
.dl-hero .picker-head{padding-bottom:16px}
.dl-hero .picker-head h2{font:500 17px/1.5 var(--body)}
.dl-hero .platforms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.dl-hero .platforms .plat{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:26px;border:1px solid var(--line);border-radius:22px;background:#fff;min-width:0;box-shadow:0 22px 42px -36px #14141338}
.dl-hero .plat .pi{display:grid;width:44px;height:44px;border-radius:13px}
.dl-hero .plat b{font-size:21px;gap:8px}
.dl-hero .plat .plat-chip{font-size:11px}
.dl-hero .plat small{font-size:12px;line-height:1.65}
.platform-desc{font-size:14px;line-height:1.8;color:var(--ink-2);margin:0;flex:1}
.dl-hero .plat .btn{width:100%;min-height:48px;font-size:13px;padding:11px 10px;white-space:normal;text-align:center;line-height:1.5;gap:8px}
.dl-hero .picker-hint{margin:14px 0 0;padding:0;border:0;border-radius:0;background:transparent;font-size:12px;line-height:1.75}
.dl-hero .note{margin-top:14px;max-width:100%;font-size:12px}
.flow-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0 0 32px}
.flow-steps li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:5px 10px;align-content:start;position:relative}
.flow-steps li>span{grid-row:1/span 2;color:var(--crail);font:24px/1.4 var(--display)}
.flow-steps b{font-size:16px;line-height:1.6;font-weight:500}
.flow-steps small{font-size:12px;line-height:1.75;color:var(--ink-2)}
.flow-stage{display:grid;grid-template-columns:minmax(260px,.8fr) 36px minmax(0,1.7fr);gap:18px;align-items:start}
.flow-stage figure{margin:0;min-width:0}
.flow-stage figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;min-height:42px}
.flow-stage figcaption b{display:block;font-size:17px;font-weight:500;line-height:1.5}
.flow-stage figcaption span{display:block;font-size:11px;line-height:1.7;color:var(--ink-2)}
.flow-tray figcaption{display:block}
.system-strip{display:flex;align-items:center;justify-content:space-between;padding:7px 12px;background:#eeebe5;border:1px solid var(--line);border-radius:14px 14px 0 0;font-size:10px;color:var(--ink-2)}
.system-strip button{display:grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:6px;padding:3px 7px;cursor:pointer}
.system-strip button img{width:20px;height:20px;object-fit:contain}
.tray-surface{position:relative;border:1px solid var(--line);border-top:0;border-radius:0 0 16px 16px;overflow:hidden;box-shadow:0 30px 52px -42px #14141350}
.client-flow .cp-shot{display:block;width:100%;padding:0;border:0;background:transparent}
.client-flow .cp-shot img{width:100%;height:auto;display:block;transform:none}
.tray-hotspot{position:absolute;left:74%;top:3.5%;width:14%;height:7.5%;background:transparent;border:2px solid var(--clay);border-radius:8px;cursor:pointer;box-shadow:0 0 0 3px #d9775720}
.client-flow button:focus-visible{outline:2px solid var(--clay);outline-offset:3px}
.client-flow .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.flow-arrow{font:32px/1 var(--display);color:var(--clay);padding-top:230px;text-align:center}
.flow-hint,.flow-caption{font-size:12px;line-height:1.8;color:var(--ink-2);margin:14px 0 0}
.flow-client #flow-screen{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#faf8f4;box-shadow:0 30px 52px -42px #14141350}
.flow-switch{display:flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:999px;background:var(--ivory);flex-shrink:0}
.flow-switch button{border:0;border-radius:999px;background:transparent;color:var(--ink-2);font:12px/1.5 var(--body);padding:7px 12px;cursor:pointer}
.flow-switch button[aria-selected="true"]{background:var(--ink);color:var(--ivory)}
.client-flow>.content-note{margin-top:26px;font-size:11px;line-height:1.8}
@media(max-width:900px){.download-intro{gap:24px}.dl-hero .platforms .plat{padding:20px}.dl-hero .plat b{font-size:18px}.flow-stage{grid-template-columns:minmax(230px,.85fr) 24px minmax(0,1.4fr);gap:12px}.flow-client figcaption{align-items:flex-start;flex-direction:column}.flow-arrow{font-size:24px}}
@media(max-width:760px){.download-intro{display:block}.download-intro .dl-img{display:none}.dl-hero .platforms{grid-template-columns:1fr}.dl-hero .platforms .plat{padding:22px;gap:14px}.dl-hero .plat b{font-size:21px}.dl-hero .dl-title-line{white-space:normal}.dl-hero .plat .btn{font-size:14px}.flow-stage{grid-template-columns:1fr;gap:22px}.flow-tray{width:min(100%,400px);justify-self:center}.flow-arrow{padding-top:0;transform:rotate(90deg);font-size:28px}.flow-client{width:100%}.flow-client figcaption{flex-direction:row;flex-wrap:wrap;align-items:center}.flow-steps{grid-template-columns:1fr;gap:16px;margin-bottom:28px}.flow-steps li{grid-template-columns:32px minmax(0,1fr)}.flow-stage figcaption b{font-size:16px}.flow-switch button{padding:7px 11px}.client-flow>.content-note{margin-top:20px}}
