/* Bespoke illustrations for the current homepage. Archive routes retain their visuals. */
.copy-page .copy-principle-visual.bespoke-principle{height:auto;aspect-ratio:3/2;background:radial-gradient(ellipse at 50% 90%,#dfedf37a,transparent 75%),#fbfcf9;border-color:#e1e9e8}
.copy-page .bespoke-principle>img,.copy-page .copy-principle:nth-child(3) .bespoke-principle>img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;padding:0}
.bespoke-scenario-art{margin:-12px -12px 14px;max-width:100%}
.bespoke-scenario-art img{display:block;width:100%;height:auto}
.bespoke-away-scene{position:relative;isolation:isolate;padding:58px 0 26px}
.bespoke-away-scene>img:first-of-type{position:relative;z-index:1;width:112%;max-width:none;margin-left:-6%;animation:copy-float 8s ease-in-out infinite;filter:drop-shadow(0 20px 24px #547f8e0d)}
.bespoke-orbit{position:absolute;z-index:-1;inset:20px 4% 8%;border:1px dashed #bfd9e2;border-radius:50%;transform:rotate(-15deg);background:radial-gradient(ellipse,#e7f3f588,transparent 65%)}
.bespoke-away-clock{position:absolute;z-index:2;width:120px;height:auto;right:0;top:0;transform:rotate(9deg)}
.bespoke-away-spark{position:absolute;z-index:2;left:5%;bottom:14%;width:46px;height:46px;display:grid;place-items:center;color:#79a68b;background:#f0f8f2;border:4px solid #fff;border-radius:50%;box-shadow:0 8px 20px #3b657417}
.bespoke-away-spark svg{width:25px;height:25px}
.copy-page .copy-computer-visual{width:115%;margin-left:-8%;isolation:isolate}
.copy-page .copy-computer-visual>img{display:block;width:100%;mix-blend-mode:normal;filter:drop-shadow(0 18px 28px #5d8c9c09)}
.bespoke-shared-scene{position:relative;width:min(960px,100%);margin:20px auto 0}
.copy-page .bespoke-shared-scene>img{display:block;width:100%;max-width:100%;margin:0}
.bespoke-collaborator{position:absolute;z-index:2;color:#1fa3de;width:40px;height:46px;filter:drop-shadow(0 5px 5px #40657925)}
.bespoke-collaborator svg{position:relative;z-index:1;width:100%;height:100%}
.bespoke-collaborator i{position:absolute;left:-22px;top:-17px;width:55px;height:32px;border:1px solid currentColor;border-radius:50%;transform:rotate(-10deg);opacity:.55}
.collaborator-1{left:35%;top:36%;transform:rotate(-8deg)}
.collaborator-2{left:68%;top:47%;color:#d0a06d;transform:rotate(8deg)}
.collaborator-3{left:48%;top:67%;color:#86a887;transform:rotate(-5deg)}
.copy-page .canvas-node-icon svg{width:26px;height:26px;display:block;overflow:visible}
@media(min-width:701px) and (max-width:980px){.copy-principles{gap:16px}.bespoke-away-clock{width:90px}.bespoke-away-scene{padding-top:45px}}
@media(max-width:700px){.copy-page .copy-principle-visual.bespoke-principle{max-height:300px;aspect-ratio:3/2}.bespoke-scenario-art{margin:-6px -10px 12px;max-width:calc(100% + 20px)}.copy-page .copy-computer-visual{width:min(560px,112%);margin-left:-6%!important}.bespoke-away-scene{padding-top:45px}.bespoke-away-clock{width:100px;right:1%}.bespoke-shared-scene{width:110%;margin-left:-5%}.bespoke-collaborator{width:29px;height:34px}.bespoke-collaborator i{width:40px;height:24px;left:-16px;top:-12px}}
@media(prefers-reduced-motion:reduce){.bespoke-away-scene>img:first-of-type{animation:none}}
.bespoke-page .canvas-node-icon>img{display:block;width:28px;height:28px;object-fit:contain}
.bespoke-page .copy-away,.bespoke-page .copy-computers{overflow:hidden;overflow:clip}
@media(max-width:700px){.copy-page .copy-computer-visual{width:100%;margin-left:0!important}.bespoke-away-scene>img:first-of-type{width:108%;margin-left:-4%}}
/* Around-the-clock office: generated voxel art with editable time layers. */
.bespoke-away-rush{padding-top:65px;padding-bottom:32px}
.bespoke-away-rush .bespoke-orbit{inset:28px 2% 7%;background:none;animation:office-time-orbit 36s linear infinite}
.bespoke-away-rush .bespoke-orbit::before{content:"";position:absolute;top:7%;left:20%;width:8px;height:8px;background:#8ec9df;border:3px solid #fff;border-radius:50%;box-shadow:0 2px 6px #699eaf20}
.bespoke-away-rush .bespoke-orbit-inner{inset:12% 8% 15%;border-color:#cfe3eb;opacity:.65;animation:office-time-orbit-reverse 48s linear infinite}
.bespoke-around-clock{position:absolute;z-index:2;right:4%;bottom:7%;padding:8px 14px;border:1px solid #d7eaf1;border-radius:999px;background:#f8fcfbef;color:#44809a;font:650 13px/1.2 var(--display);letter-spacing:.06em;box-shadow:0 6px 20px #527d9410}
.bespoke-away-rush .bespoke-away-spark{left:0;bottom:20%}
.bespoke-away-rush .bespoke-away-clock{top:0;right:-1%}
@keyframes office-time-orbit{from{transform:rotate(-15deg)}to{transform:rotate(345deg)}}
@keyframes office-time-orbit-reverse{from{transform:rotate(18deg)}to{transform:rotate(-342deg)}}
@media(max-width:700px){.bespoke-away-rush{padding-top:45px}.bespoke-away-rush .bespoke-away-clock{width:86px;right:-1%;top:-4px}.bespoke-around-clock{font-size:11px;padding:7px 12px;right:1%;bottom:4%}.bespoke-away-rush .bespoke-away-spark{width:36px;height:36px;left:-1%;bottom:21%}.bespoke-away-rush .bespoke-away-spark svg{width:21px;height:21px}}
@media(prefers-reduced-motion:reduce){.bespoke-away-rush .bespoke-orbit,.bespoke-away-rush .bespoke-orbit-inner{animation:none}}
/* One voxel specialist per use case; props carry the original icon meanings. */
.bespoke-scenario-art.scenario-character{height:226px;margin:-4px -8px 24px;max-width:calc(100% + 16px);display:grid;place-items:center;position:relative}
.scenario-character::before{content:"";position:absolute;inset:20% 8% 0;background:radial-gradient(ellipse,#eaf6fa99,transparent 68%);z-index:0}
.bespoke-scenario-art.scenario-character img{position:relative;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 12px #456c7b08)}
@media(min-width:701px) and (max-width:980px){.bespoke-scenario-art.scenario-character{height:180px;margin-inline:-15px;max-width:calc(100% + 30px)}}
@media(max-width:700px){.bespoke-scenario-art.scenario-character{height:190px;margin-bottom:20px}}
@media(max-width:600px){.bespoke-page .copy-scenarios{grid-template-columns:1fr}.bespoke-page .copy-scenario,.bespoke-page .copy-scenario:nth-child(4),.bespoke-page .copy-scenario:last-child{grid-column:auto}.bespoke-scenario-art.scenario-character{height:220px;margin:0 0 22px;max-width:100%}.bespoke-page .copy-scenario{padding:26px}.bespoke-page .copy-scenario h3{font-size:22px}.bespoke-page .copy-scenario p{font-size:15px}}
.bespoke-scenario-art.scenario-character{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.bespoke-scenario-art.scenario-character img{min-width:0;min-height:0;max-height:100%}
/* Voxel cloud computer: powered-up left, inactive right, one accessible range. */
.copy-page .copy-computer-visual.mini-comparison{width:100%;margin:0;min-width:0}
.mini-stage{position:relative;width:100%;aspect-ratio:3/2;isolation:isolate}
.mini-stage>img,.mini-on-layer>img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;pointer-events:none}
.mini-stage .mini-off-image{filter:grayscale(1) brightness(.77) contrast(.88);opacity:.72}
.mini-on-layer{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--mini-split)) 0 0);pointer-events:none}
.mini-on-layer>img{position:relative;z-index:1}
.mini-power-glow{position:absolute;inset:20% 4% 6%;background:radial-gradient(ellipse at 65% 63%,#1fa3de28,transparent 68%);filter:blur(10px)}
.mini-scan-line{position:absolute;top:9%;bottom:9%;left:var(--mini-split);z-index:3;width:2px;transform:translateX(-50%);background:linear-gradient(transparent,#8acde5 20%,#fff 50%,#8acde5 80%,transparent);box-shadow:0 0 16px #89d2ec44;pointer-events:none}
.mini-scan-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid #fff;background:#fafdffe8;box-shadow:0 4px 18px #456c7b24,inset 0 0 0 1px #bfdde94d;color:#3987a7;backdrop-filter:blur(12px)}
.mini-scan-handle svg{width:26px;height:26px}
.mini-stage .mini-range{position:absolute;z-index:4;inset:0 auto 0 -22px;width:calc(100% + 44px);height:100%;margin:0;padding:0;appearance:none;-webkit-appearance:none;background:transparent;border:0;border-radius:0;box-shadow:none;cursor:ew-resize;touch-action:pan-y;outline:none}
.mini-range::-webkit-slider-runnable-track{height:0;background:transparent;border:0}
.mini-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:44px;height:44px;margin-top:-22px;border:0;border-radius:50%;background:transparent;box-shadow:none}
.mini-range::-moz-range-track{height:0;background:transparent;border:0}
.mini-range::-moz-range-thumb{width:44px;height:44px;border:0;border-radius:50%;background:transparent;box-shadow:none}
.mini-stage:has(.mini-range:focus-visible) .mini-scan-handle{outline:3px solid #1fa3de;outline-offset:4px}
.mini-controls{display:flex;justify-content:center;align-items:center;margin:8px 8% 0}
.mini-motion-toggle{width:32px;height:32px;padding:5px;display:grid;place-items:center;border:1px solid #d9e7ed;border-radius:50%;background:#ffffffb3;color:#527d94;cursor:pointer}
.mini-motion-toggle:hover{background:#fff;border-color:#a7ccdc}
.mini-motion-toggle:focus-visible{outline:3px solid #1fa3de;outline-offset:4px}
.mini-motion-toggle svg{grid-area:1/1;width:20px;height:20px}
.mini-motion-toggle .mini-play-icon,.mini-motion-toggle[data-paused="true"] .mini-pause-icon{display:none}
.mini-motion-toggle[data-paused="true"] .mini-play-icon{display:block}
.mini-motion-toggle[hidden]{display:none}
.mini-controls:has(.mini-motion-toggle[hidden]){display:none}
.mini-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.mini-controls{margin-top:4px}.mini-scan-handle{width:38px;height:38px}.mini-scan-handle svg{width:23px;height:23px}}
@media(prefers-reduced-motion:reduce){.mini-stage *{animation:none!important;transition:none!important}}