.workspace { max-width: none; padding: 90px 0; border-top: 1px solid var(--line); }
.workspace > .section-heading { max-width: 1400px; padding-inline: 7%; margin-inline: auto; }
.workspace .workspace-intro { max-width: 425px; color: var(--muted); font-size: 16px; line-height: 1.85; }
.workspace-grid { display: flex; gap: 20px; overflow-x: auto; }
.workspace-photo { flex: 0 0 30%; min-width: 0; padding: 0; border: 0; background: transparent; border-radius: 18px; }
.workspace-photo img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.workspace-photo .workspace-soft { position: absolute; inset: 0; opacity: 0; filter: blur(1.35px); pointer-events: none; }
.workspace-grid.is-carousel { position: relative; display: block; height: clamp(390px,43vw,590px); overflow: hidden; perspective: 1200px; touch-action: pan-y pinch-zoom; }
.is-carousel .workspace-photo { position: absolute; left: 50%; top: 24px; width: clamp(245px,30vw,430px); height: calc(100% - 60px); margin-left: clamp(-215px,-15vw,-122.5px); transform-origin: center; backface-visibility: hidden; box-shadow: 0 14px 28px #00000035; will-change: transform; }
.workspace-grid.is-stepping .workspace-photo { transition: transform 650ms cubic-bezier(.22,1,.36,1), opacity 650ms ease; }
.workspace-photo:focus-visible { outline-offset: -5px; }
.workspace-controls { display: flex; justify-content: center; gap: 14px; margin-top: 12px; }
.workspace-controls button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; appearance: none; -webkit-appearance: none; border: 1px solid #c3a77545; border-radius: 50%; color: var(--gold); background: transparent; line-height: 1; transition: background 180ms ease; }
.workspace-controls svg { display: block; width: 22px; height: 22px; pointer-events: none; }
.workspace-controls button:hover { background: #c3a77515; }
@media(min-width:801px) and (max-width:1380px) { .header nav { display: none; } .header .menu-toggle { display: block; } .header-actions { margin-left: auto; } }
@media(max-width:800px) { .workspace { padding-top: 65px; padding-bottom: 65px; } .workspace .workspace-intro { font-size: 14px; } .workspace-grid.is-carousel { height: clamp(360px,80vw,510px); perspective: 850px; margin-inline: 0; } .is-carousel .workspace-photo { width: min(66vw,340px); margin-left: max(-33vw,-170px); top: 16px; height: calc(100% - 42px); border-radius: 15px; } }
@media(max-width:360px) { .workspace h2 { font-size: 36px; } }
@media(prefers-reduced-motion:reduce) { .workspace-grid.is-stepping .workspace-photo, .workspace-controls button { transition: none; } }
