/* A local, user-controlled wipe animation inside the Photos section. */
.project-preview{margin:42px 0 48px;padding:32px;border:1px solid #34515f;background:linear-gradient(135deg,#152c3a,#0c1c28);isolation:isolate}
.preview-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:26px}.preview-heading .eyebrow{font-size:9px;letter-spacing:1.8px;margin-bottom:12px}.preview-heading h3{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:36px;letter-spacing:-1px;line-height:1.15}.preview-heading>p{max-width:340px;font-size:13px;line-height:1.8}
.preview-layout{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(240px,1fr);gap:32px;align-items:center}.preview-visual,.preview-controls{min-width:0}
.preview-stage{position:relative;aspect-ratio:3/2;overflow:hidden;background:#0b1c29;border:1px solid #3e596a;user-select:none;touch-action:pan-y}.preview-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.preview-stage>canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;cursor:crosshair}.preview-stage>canvas[hidden]{display:none}.preview-concept-label{position:absolute;left:16px;top:16px;z-index:2;max-width:calc(100% - 32px);font:600 9px/1.4 Arial,Helvetica,sans-serif;letter-spacing:1.5px;color:#f5f3ed;background:#0b1824c9;border:1px solid #8ba0ab66;padding:7px 9px;pointer-events:none}.preview-stage-hint{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:2;white-space:nowrap;padding:8px 13px;background:#0b1824db;border:1px solid #78909a88;color:#edf3f5;font-size:11px;pointer-events:none}.preview-stage-hint[hidden]{display:none}
.preview-roller{position:absolute;left:48%;top:50%;width:46px;height:46px;transform:translate(-50%,-50%) rotate(-18deg);z-index:3;color:var(--orange,#fa834b);pointer-events:none;filter:drop-shadow(0 3px 4px #06101bcc)}.preview-roller svg{width:100%;height:100%;display:block}.preview-roller[hidden]{display:none}
.project-preview .preview-disclaimer{font-size:10px;line-height:1.7;color:#b6c6cf;margin-top:12px}.preview-choices{border:0;padding:0;margin:0 0 22px;min-width:0}.preview-choices legend{font:600 11px/1.6 Arial,Helvetica,sans-serif;color:#c6d5dd;margin-bottom:10px}.preview-choices>div{display:flex;gap:7px;flex-wrap:wrap}.preview-choice{border:1px solid #587386;background:#112533;color:#cfdae2;min-height:44px;padding:10px 12px;font:600 11px/1.4 Arial,Helvetica,sans-serif;transition:background .18s,border-color .18s}.preview-choice:hover{background:#203b4b;border-color:#fa9c69}.preview-choice.is-selected{color:#102330;background:#fa9c69;border-color:#fa9c69}
.preview-controls h4{font-family:Georgia,'Times New Roman',serif;font-size:26px;font-weight:400;letter-spacing:-.4px;line-height:1.25;margin:0 0 10px;color:#f5f3ed}.project-preview .preview-description{font-size:12px;line-height:1.8;color:#c1d0d9;margin-bottom:22px;min-height:43px}.preview-interactive-controls[hidden]{display:none}
.preview-reveal-label{display:flex;align-items:center;justify-content:space-between;gap:12px;font:600 11px/1.5 Arial,Helvetica,sans-serif;color:#d9e3e8}.preview-reveal-label output{color:#fa9c69;font-variant-numeric:tabular-nums;font-size:13px;min-width:40px;text-align:right}
#preview-range{display:block;width:100%;height:44px;padding:0;margin:2px 0 0;accent-color:#fa9c69;cursor:ew-resize;background:transparent;touch-action:pan-y}#preview-range:focus-visible{outline:3px solid #fa834b;outline-offset:3px}.project-preview .preview-instructions{font-size:10px;line-height:1.65;color:#b6c7d1;margin:0 0 15px}
.preview-play{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:47px;border:1px solid #fa834b;background:#fa834b;color:#14232d;font:700 12px/1.5 Arial,Helvetica,sans-serif;padding:11px 14px;transition:background .18s}.preview-play:hover{background:#ff9b67;border-color:#ff9b67}.preview-play[aria-pressed=true]{background:#f3d1ba;border-color:#f3d1ba}.preview-play>svg{width:18px;height:18px;flex-shrink:0}.preview-secondary-actions{display:flex;justify-content:space-between;gap:12px;margin-top:6px}.preview-secondary-actions button{min-height:44px;border:0;background:transparent;padding:8px 1px;color:#c3d4dd;font:11px/1.5 Arial,Helvetica,sans-serif;text-decoration:underline;text-underline-offset:4px}.preview-secondary-actions button:hover{color:#fa9c69}.project-preview .preview-status{font-size:10px;line-height:1.65;color:#bbd0dc;min-height:33px;margin-top:2px}.preview-discuss{font-size:12px;margin-top:17px;gap:22px}.preview-discuss span{font-size:20px}
@media(max-width:1000px){.project-preview{padding:26px}.preview-layout{gap:24px;grid-template-columns:minmax(0,1.4fr) minmax(235px,1fr)}.preview-heading{gap:28px}.preview-heading h3{font-size:31px}.preview-heading>p{max-width:285px;font-size:12px}}
@media(max-width:850px){.preview-heading{display:block}.preview-heading>p{max-width:550px;margin-top:15px}.preview-layout{grid-template-columns:1fr;gap:24px}.preview-controls{display:grid;grid-template-columns:1fr 1fr;column-gap:30px;align-items:start}.preview-choices{grid-column:1}.preview-controls h4,.preview-description{grid-column:1}.preview-interactive-controls{grid-column:2;grid-row:1/5}.preview-discuss{grid-column:1;margin-top:2px}.preview-controls .preview-description{min-height:0;margin-bottom:18px}}
@media(max-width:580px){.project-preview{padding:20px 16px;margin:32px 0 36px}.preview-heading{margin-bottom:21px}.preview-heading .eyebrow{font-size:8px;letter-spacing:1.3px}.preview-heading h3{font-size:30px}.preview-heading>p{font-size:12px}.preview-stage{aspect-ratio:1.2}.preview-concept-label{top:12px;left:12px;font-size:7px;letter-spacing:1.1px;padding:7px;max-width:calc(100% - 24px)}.preview-stage-hint{font-size:10px;bottom:18px;padding:7px 10px}.preview-roller{width:41px;height:41px}.preview-controls{display:block}.preview-choices{margin-bottom:18px}.preview-choices>div{gap:8px}.preview-choice{flex:1;padding-inline:8px;font-size:11px}.preview-controls h4{font-size:25px}.preview-controls .preview-description{margin-bottom:19px}.preview-discuss{margin-top:20px}.project-preview .preview-status{min-height:17px}.project-preview .preview-disclaimer{font-size:9px}}
@media(prefers-reduced-motion:reduce){.preview-choice,.preview-play{transition:none}.preview-roller{transform:translate(-50%,-50%)}}
