/* Mirrored orbit: the circle's centre sits beyond the right edge. */
.orbit-area{width:44%}
.orbit-dial{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.orbit-dial line{stroke:#a2a39e;stroke-width:1;stroke-linecap:round}
.orbit-dial .major{stroke:#888a84;stroke-width:1.5}
.orbit-dial .minor{opacity:.55}
.track{z-index:2}
.project-card{color:inherit;text-decoration:none}
.project-card.is-active{transform:rotate(var(--straighten));box-shadow:0 8px 18px #18202a14,0 28px 48px -15px #18202a40}
.project-peek{left:41.5%;width:16%;padding:22px 18px;border:1px solid #d9dde1;border-radius:12px;background:linear-gradient(155deg,#fff 65%,#fafbfc);box-shadow:0 2px 4px #18202a03,0 12px 32px -12px #18202a1a;transition:opacity .12s ease-out,visibility 0s,border-color .3s,box-shadow .3s}
.project-peek:hover,.project-peek:focus-within{border-color:#bcc3ca;box-shadow:0 3px 6px #18202a05,0 16px 36px -12px #18202a24}
.peek-number{font-size:10px;letter-spacing:.035em;margin-bottom:18px}
.peek-category{font-size:9px;line-height:1.65;letter-spacing:.025em;color:#85898e}
.peek-title{font-size:clamp(17px,1.5vw,24px);line-height:1.4;letter-spacing:-.025em;margin:9px 0 12px;font-weight:550;text-wrap:pretty}
.peek-description{font-size:12px;line-height:1.85;color:#636971;text-wrap:pretty}
.project-peek .peek-open{display:flex;justify-content:space-between;width:100%;margin-top:19px;padding:13px 0 0;border-bottom:0;border-top:1px solid #e9ebee;font-size:11px;color:#262b30}
.peek-open .arrow-icon{transition:transform .3s var(--ease)}
.project-peek:hover .peek-open .arrow-icon{transform:translate(2px,-2px)}
@media(min-width:761px){
 /* The orbit's central slot and its summary share the same horizontal axis. */
 .project-peek,.hero.has-selection .project-peek{left:40%;top:50%;transform:translateY(-50%)}
}
.peek-title{overflow-wrap:anywhere}
.peek-open{display:inline-flex;align-items:center;gap:12px}
.arrow-icon{display:inline-block;width:22px;height:22px;flex:none;vertical-align:middle}
.peek-open .arrow-icon{width:16px;height:16px}
.orbit-controls button svg{width:16px;height:16px;display:block;margin:auto}
.work-heading h2{font-size:clamp(42px,5.2vw,80px);letter-spacing:-2.8px}
.work-item{min-width:0;color:inherit;text-decoration:none}
@media(min-width:761px){
 .works .work-grid{column-gap:clamp(30px,3vw,56px);row-gap:68px}
}
.work-caption{min-width:0}
.work-caption h3{min-width:0;overflow-wrap:anywhere}
.work-caption>span{flex-shrink:0}
.work-cover,.project-card{container-type:inline-size}
.legal-ai .card-main{width:86%!important;top:24%!important}
.project-card.legal-ai .cover-title,.work-cover.legal-ai .cover-title{font-size:clamp(19px,8.1cqw,49px);letter-spacing:-.045em;line-height:1.08;overflow-wrap:normal;text-wrap:balance}
.legal-ai .card-top{font-size:clamp(6px,1.8cqw,10px)}
.legal-ai .card-bottom{font-size:clamp(8px,2.2cqw,12px);gap:12px}
.legal-ai .card-bottom>span{min-width:0;max-width:88%;line-height:1.25}
@media(max-width:1100px) and (min-width:761px){.project-peek{left:42%;width:15%;padding:18px 14px}.peek-description{font-size:11px}.peek-title{font-size:17px}}
@media(max-width:1100px) and (min-width:761px){.hero .project-peek{left:40.5%}}
@media(max-width:760px){
 .orbit-area{width:100%;height:510px}
 .project-peek{left:auto;width:auto;padding:0 22px}
 .hero.has-selection .project-peek{padding:22px}
 .work-heading h2{font-size:clamp(39px,10.5vw,65px);letter-spacing:-2px}
 .work-cover .cover-title{font-size:10cqw}
 .work-caption h3{font-size:17px;line-height:1.45}
 .project-card.legal-ai .cover-title,.work-cover.legal-ai .cover-title{font-size:8.1cqw}
 .orbit-slot .project-card.oral .cover-title,.work-cover.oral .cover-title{font-size:9.2cqw;letter-spacing:-.045em}
 .orbit-slot .project-card.oral .card-bottom,.work-cover.oral .card-bottom{font-size:2.4cqw}
 .card-bottom .arrow-icon{width:18px;height:18px}
}
@media(prefers-reduced-motion:reduce){.project-card,.project-peek{transition:none}}

/* Product cover uses the prototype's blue, white glass and actual workspace. */
.legal-ai .legal-app-cover{background:linear-gradient(125deg,#fff 0%,#eef3fc 57%,#dce7f7 100%);color:#28313f}
.legal-brand-icon{position:absolute;left:6%;top:9%;width:9%;aspect-ratio:1;border:1px solid #fff;border-radius:28%;display:grid;place-items:center;background:#ffffffb3;box-shadow:0 4px 10px #5477a514}
.legal-brand-icon img{width:62%;height:62%}
.legal-cover-heading{position:absolute;left:6%;top:32%;width:44%;font-size:6.8cqw;font-weight:550;line-height:1.02;letter-spacing:-.055em}
.legal-cover-subtitle{position:absolute;left:6%;top:67%;font-size:2.65cqw;color:#526a8e}
.legal-cover-tag{position:absolute;left:6%;bottom:9%;font-size:1.55cqw;letter-spacing:.1em;color:#6884ab}
.legal-app-screen{position:absolute;width:76%;max-width:none;height:auto;left:51%;top:17%;border:3px solid #ffffffd9;border-radius:10px;transform:rotate(-8deg);box-shadow:-9px 15px 32px #466a9d21;pointer-events:none}
.legal-cover-arrow{position:absolute;right:5%;bottom:8%;color:#3478e6;background:#ffffffcb;border:1px solid #fff;border-radius:50%;width:7%;aspect-ratio:1;display:grid;place-items:center}
.legal-cover-arrow .arrow-icon{width:55%;height:55%}
.hero-name-stop{display:inline-block;width:.14em;height:.14em;margin-left:.13em;background:var(--accent);vertical-align:baseline}

/* One spring drives card scale and arc spacing; the sibling dial stays fixed. */
.orbit-stage{position:absolute;inset:0;transform-origin:44% 50%;will-change:transform}
.gallery{touch-action:pan-x;cursor:grab}
.gallery .project-card{cursor:grab}
.gallery.is-dragging,.gallery.is-dragging .project-card{cursor:grabbing;user-select:none}
.project-peek{cursor:pointer}