html { scrollbar-gutter: stable; }
header.wrap { padding-top: 22px; padding-bottom: 20px; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible { outline: 2px solid #e8ff27; outline-offset: 5px; }
.orbit-hero { overflow: clip; padding: 27px 0 29px; }
.orbit-heading { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.orbit-heading .eyebrow { font-size: .875rem; letter-spacing: .06em; }
.orbit-demo { color: #aaa; font-size: .8125rem; }
.orbit-stage { position: relative; height: clamp(470px, 65svh, 720px); max-width: 1600px; margin: auto; isolation: isolate; touch-action: pan-y; user-select: none; }
.orbit-center { position: absolute; left: 50%; top: 50%; width: max-content; max-width: calc(100% - 40px); transform: translate(-50%, -50%); text-align: center; z-index: 100; pointer-events: none; }
.orbit-signature { display: block; font-size: .875rem; letter-spacing: .02em; margin-bottom: 22px; color: #ddd; }
.orbit-center h1 { margin: 0; font-size: clamp(3.5rem, 7.6vw, 8rem); line-height: .92; letter-spacing: -.08em; font-weight: 700; text-wrap: balance; }
.orbit-center h1 span { color: #e8ff27; }
.orbit-cards { position: absolute; inset: 0; }
.orbit-card { position: absolute; left: 50%; top: 50%; width: clamp(146px, 17vw, 225px); height: clamp(185px, 21.5vw, 284px); padding: 0; border: 0; color: var(--ink); background: var(--cover); border-radius: 18px; overflow: hidden; box-shadow: 0 16px 36px #0003; will-change: transform; transform: translate(-50%, -50%); text-align: left; outline-offset: 5px; }
.orbit-card .card-face { display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding: 18px; border: 0; border-radius: inherit; transition: border-color 160ms; }
.card-top { display: flex; align-items: center; justify-content: space-between; font-size: .875rem; font-weight: 500; }
.card-category { display: inline-flex; align-items: center; align-self: flex-start; max-width: 90%; border: 1px solid currentColor; border-radius: 100px; padding: 5px 8px; margin-top: 13px; font-size: .62rem; line-height: 1; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-arrow { font-size: 1.4rem; opacity: 0; transition: opacity 150ms; }
.card-number { font-size: clamp(4rem, 7vw, 6.4rem); line-height: .9; font-weight: 500; letter-spacing: -.1em; }
.card-label { display: -webkit-box; overflow: hidden; font-size: .9375rem; font-weight: 500; line-height: 1.1; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.card-action { display: block; font-size: .8125rem; margin-top: 6px; opacity: .8; }
.orbit-card:hover .card-face, .orbit-card:focus-visible .card-face { border: 0; }
.orbit-card:hover .card-arrow, .orbit-card:focus-visible .card-arrow { opacity: 1; }
.orbit-card:focus-visible { z-index: 240 !important; outline: 3px solid white; }
.orbit-toolbar { display: flex; justify-content: space-between; gap: 28px; align-items: center; margin-top: 12px; }
.orbit-guidance { display: flex; align-items: baseline; gap: 24px; }
.orbit-state { font-size: .8125rem; text-transform: uppercase; letter-spacing: .07em; color: #e8ff27; min-width: 176px; }
.orbit-guidance p { margin: 0; color: #c0c0c0; font-size: .875rem; line-height: 1.5; }
.orbit-bottom { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; margin-top: 28px; }
.orbit-bottom p { margin: 0; font-size: .8125rem; color: #aaa; }
.orbit-bottom a { font-size: .875rem; white-space: nowrap; }
.projects-link { border-bottom: 1px solid #e8ff27; padding-bottom: 6px; }
.orbit-bottom a span { margin-left: 18px; }
body.project-open { overflow: hidden; }
.project-dialog { width: min(1180px, calc(100% - 48px)); max-width: none; max-height: calc(100svh - 48px); padding: 0; border: 1px solid #545454; border-radius: 12px; color: #f1f1ed; background: #1c1c1c; overscroll-behavior: contain; box-shadow: 0 35px 120px #0008; }
.project-dialog::backdrop { background: #000b; backdrop-filter: blur(12px); }
.project-dialog[open] { animation: open-project 220ms ease-out; }
.project-shell { padding: clamp(20px, 3.2vw, 46px); }
.project-dialog-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 25px; color: #b7b7b7; font-size: .8125rem; }
.project-close { display: flex; align-items: center; gap: 14px; background: none; border: 1px solid #777; border-radius: 100px; color: #f1f1ed; padding: 8px 17px; min-height: 44px; font-size: .875rem; }
.project-close span { font-size: 1.7rem; line-height: .7; }
.project-close:hover { color: #e8ff27; border-color: #e8ff27; }
.project-layout { display: grid; grid-template-columns: 1.16fr 1fr; gap: clamp(32px, 5vw, 70px); }
.project-cover { min-height: 330px; aspect-ratio: 1.06; display: flex; flex-direction: column; justify-content: space-between; padding: 30px; border-radius: 10px; background: var(--cover); color: var(--ink); }
.cover-label { font-size: .875rem; }
.cover-number { font-size: clamp(8rem, 19vw, 17rem); line-height: .83; letter-spacing: -.12em; font-weight: 500; margin-left: -.035em; }
.cover-footer { font-size: 1rem; letter-spacing: -.04em; }
.project-copy { display: flex; flex-direction: column; justify-content: center; padding: 12px 0; }
.project-category { color: #e8ff27; font-size: .875rem; margin-bottom: 18px; }
.project-copy h2 { font-size: clamp(2.5rem, 4.6vw, 4.75rem); line-height: 1; letter-spacing: -.065em; margin: 0 0 25px; }
.project-copy > p { font-size: 1.0625rem; line-height: 1.55; margin: 0; color: #ddd; }
.project-note { border-top: 1px solid #555; margin-top: 38px; padding-top: 20px; }
.project-note > span { color: #aaa; font-size: .8125rem; text-transform: uppercase; letter-spacing: .06em; }
.project-note p { font-size: .875rem; line-height: 1.5; color: #aaa; margin: 10px 0 0; }
.project-pager { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 25px; margin-top: 25px; border-top: 1px solid #555; }
.project-pager button { display: flex; gap: 15px; align-items: center; background: none; border: none; color: #f1f1ed; padding: 10px 0; font-size: .9375rem; min-height: 44px; }
.project-pager button:hover { color: #e8ff27; }
.project-pager #project-count { color: #aaa; font-size: .875rem; font-variant-numeric: tabular-nums; }
@keyframes open-project { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
.orbit-hero.is-reduced .orbit-stage { height: auto; padding: 65px 4vw 30px; }
.orbit-hero.is-reduced .orbit-center { position: relative; left: auto; top: auto; transform: none; width: 100%; margin-bottom: 50px; }
.orbit-hero.is-reduced .orbit-cards { position: static; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; }
.orbit-hero.is-reduced .orbit-card { position: relative; left: auto; top: auto; transform: none !important; width: 100%; height: auto; min-height: 210px; opacity: 1 !important; will-change: auto; }
@media (max-width: 900px) {
 .orbit-guidance { flex-direction: column; gap: 5px; }
 .orbit-demo { display: none; }
 .orbit-center h1 { font-size: clamp(3.6rem, 9vw, 6rem); }
 .orbit-hero.is-reduced .orbit-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
 .orbit-hero { padding-top: 23px; }
 .orbit-heading .eyebrow { font-size: .8125rem; }
 .orbit-stage { height: clamp(460px, 65svh, 580px); }
 .orbit-center { width: max-content; max-width: calc(100% - 32px); }
 .orbit-center h1 { font-size: clamp(2.9rem, 11vw, 4rem); }
 .orbit-signature { margin-bottom: 16px; }
 .orbit-card { width: 124px; height: 164px; border-radius: 13px; }
 .orbit-card .card-face { padding: 12px; }
 .card-top { font-size: .875rem; }
 .card-number { font-size: 4rem; }
 .card-category { max-width: 100%; white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; font-size: .56rem; line-height: 1.15; letter-spacing: .025em; padding: 4px 6px; }
 .card-label { font-size: .8125rem; -webkit-line-clamp: 2; overflow-wrap: anywhere; }
 .card-action { display: none; }
 .orbit-toolbar { gap: 16px; margin-top: 2px; }
 .orbit-state { min-width: 0; font-size: .75rem; }
 .orbit-guidance p { font-size: .875rem; max-width: 230px; }
 .orbit-bottom { flex-direction: column; gap: 18px; margin-top: 25px; }
 .orbit-bottom p { font-size: .8125rem; }
 .project-dialog { width: calc(100% - 24px); max-height: calc(100svh - 24px); border-radius: 12px; }
 .project-dialog-top { position: sticky; top: -20px; z-index: 3; background: #1c1c1c; margin-top: -10px; padding-top: 10px; }
 .project-dialog-top > span { max-width: 170px; line-height: 1.35; }
 .project-layout { grid-template-columns: 1fr; gap: 26px; }
 .project-cover { min-height: 220px; aspect-ratio: 1.35; padding: 20px; }
 .cover-number { font-size: 9rem; }
 .project-copy { padding: 0; }
 .project-copy h2 { font-size: 2.7rem; }
 .project-note { margin-top: 24px; padding-top: 18px; }
 .orbit-hero.is-reduced .orbit-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
 .orbit-hero.is-reduced .orbit-card { min-height: 185px; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* One category at the top; no decorative outline around the photo or label. */
.orbit-card .card-top{gap:8px;align-items:flex-start}
.orbit-card .card-category{border:0;border-radius:0;padding:0;margin:0;max-width:100%;font-size:.8rem;line-height:1.2;letter-spacing:.02em;white-space:normal;overflow-wrap:anywhere}
.orbit-card .card-arrow{flex-shrink:0}
.orbit-card .card-face{border:0}
/* Retain a keyboard-only focus cue outside the image. */
.orbit-card:focus-visible{outline:2px dashed currentColor;outline-offset:5px}
@media(max-width:600px){.orbit-card .card-category{font-size:.75rem}.orbit-card .card-arrow{display:none}.orbit-card .card-number{font-size:3.5rem}.orbit-card .card-label{font-size:.8125rem}}

.orbit-card .card-label{white-space:normal;overflow-wrap:anywhere;-webkit-line-clamp:2;line-height:1.15}
