/* The orbit and project cards belong only to the client showcase. */
.clients-hero { display:grid; grid-template-columns:1.1fr 1fr; gap:5%; align-items:center; }
.showcase-jump { display:inline-block; margin-top:28px; padding-block:12px; }
.orbit-panel { position:relative; border:1px solid var(--line); background:radial-gradient(ellipse at center,#15202a80,transparent 70%); min-width:0; }
.orbit-label,.orbit-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px; font-size:.6875rem; letter-spacing:1px; color:var(--muted); }
#orbit { display:block; width:100%; height:360px; touch-action:pan-y; cursor:grab; }
#orbit:active { cursor:grabbing; }
.orbit-controls { flex-wrap:wrap; border-top:1px solid var(--line); letter-spacing:0; }
.orbit-controls button { background:transparent; color:var(--ink); border:1px solid var(--line); padding:10px 12px; min-height:44px; font-size:.75rem; }
.orbit-controls button:hover { border-color:var(--red); }
#orbit-shift { margin-left: auto; }
.client-grid { display:grid; gap:32px; }
.client-card { display:grid; grid-template-columns:1.1fr 1fr; border:1px solid var(--line); background:#0d1117; }
.client-art { position:relative; min-height:420px; display:grid; place-items:center; overflow:hidden; background:radial-gradient(ellipse at 60% 50%,#29404c,#101820 68%); padding:40px; }
.concept-window { width:100%; max-width:450px; background:#ecece5; color:#172b32; box-shadow:0 25px 70px #0008; transform:perspective(900px) rotateY(-9deg) rotateX(4deg); transition:transform .5s; position:relative; overflow:hidden; }
.client-card:hover .concept-window,.client-card:focus-within .concept-window { transform:perspective(900px) rotateY(0) rotateX(0); }
.concept-bar { display:flex; align-items:center; gap:5px; padding:13px; border-bottom:1px solid #172b3225; }
.concept-bar i { height:4px; width:4px; border-radius:50%; background:#172b3270; }
.concept-bar span { margin-left:auto; font-size:7px; letter-spacing:1.5px; }
.concept-body { padding:36px 24px 48px; position:relative; z-index:1; }
.concept-body > span { font-size:7px; letter-spacing:1px; }
.concept-body strong { display:block; margin:22px 0; font:500 clamp(1.25rem,2.3vw,2rem)/1.1 'Space Grotesk',sans-serif; letter-spacing:-1px; }
.concept-line { width:45%; height:3px; background:#172b3230; margin-top:8px; }
.concept-line.short { width:30%; }
.concept-button { width:65px; height:20px; background:#193e3f; margin-top:24px; }
.concept-sphere { position:absolute; right:-60px; bottom:-60px; width:220px; height:220px; border-radius:50%; background:repeating-radial-gradient(ellipse at 35% 30%,#527274 0 1px,#193e3f 2px 9px); }
.art-caption { position:absolute; bottom:18px; left:24px; font-size:.625rem; letter-spacing:1.5px; color:#a4b9c2; }
.client-copy { padding:36px; }
.inner-page .client-copy h3 { font-size:2.5rem; margin:30px 0 18px; }
.client-copy p { font-size:.9375rem; }
.client-tags { display:flex; flex-wrap:wrap; list-style:none; padding:0; gap:8px; margin:25px 0; }
.client-tags li { font-size:.6875rem; color:#b3bec7; padding:8px 10px; border:1px solid var(--line); }
.client-details { border-top:1px solid var(--line); }
.client-details summary { display:flex; justify-content:space-between; gap:16px; cursor:pointer; padding:22px 0; list-style:none; font-size:.875rem; }
.client-details summary::-webkit-details-marker { display:none; }
.client-details summary span { color:var(--red); }
.client-details[open] summary span { transform:rotate(45deg); }
.client-details p + p { margin-top:16px; }
.concept-screenshot {display: block; width: 100%; height: auto; object-fit: cover;}
@media(max-width:1000px) { .clients-hero { grid-template-columns:1fr; gap:40px; } .orbit-panel { max-width:650px; width:100%; } }
@media(max-width:800px) { .client-card { grid-template-columns:1fr; } .client-art { min-height:330px; padding:30px; } .client-copy { padding:26px; } #orbit { height:300px; } .concept-body strong { font-size:1.6rem; } }
@media(prefers-reduced-motion:reduce) { .concept-window { transition:none; } }
