/* Lightbox and nav-sheet surfaces for the motion runtime. Tokens come from tokens/motion.css. */
.cc-lb{position:fixed;inset:0;z-index:80;display:none;place-items:center;padding:clamp(20px,4vw,64px)}
.cc-lb.is-open{display:grid}
.cc-lb-scrim{position:absolute;inset:0;background:rgba(21,17,16,.72);opacity:0;transition:opacity var(--dur-panel) var(--ease-editorial)}
.cc-lb.cc-in .cc-lb-scrim{opacity:1}
.cc-lb-figure{position:relative;z-index:1;margin:0;display:grid;gap:14px;max-width:min(72vh,860px);width:100%;opacity:0;transform:translate3d(0,10px,0) scale(.985);transition:opacity var(--dur-panel) var(--ease-out),transform var(--dur-panel) var(--ease-out)}
.cc-lb.cc-in .cc-lb-figure{opacity:1;transform:none}
.cc-lb-frame{overflow:hidden;background:var(--shell-050);aspect-ratio:3/4}
.cc-lb-img{width:100%;height:100%;object-fit:cover;display:block}
.cc-lb-frame.cc-from-right .cc-lb-img{animation:cc-slide-in-r var(--dur-panel) var(--ease-out) both}
.cc-lb-frame.cc-from-left .cc-lb-img{animation:cc-slide-in-l var(--dur-panel) var(--ease-out) both}
@keyframes cc-slide-in-r{from{opacity:0;transform:translate3d(14px,0,0)}to{opacity:1;transform:none}}
@keyframes cc-slide-in-l{from{opacity:0;transform:translate3d(-14px,0,0)}to{opacity:1;transform:none}}
.cc-lb-caption{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:baseline;padding-top:10px;border-top:1px solid var(--line-metal)}
.cc-lb-index{font:var(--type-caption);font-size:var(--text-micro);letter-spacing:var(--tracking-micro);color:var(--metal-300);font-variant-numeric:tabular-nums}
.cc-lb-text{font:var(--type-caption);color:var(--porcelain-200)}
.cc-lb-controls{position:absolute;z-index:2;top:clamp(16px,3vw,32px);right:clamp(16px,3vw,32px);display:flex;gap:8px}
.cc-lb-btn{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--porcelain-050);border:1px solid rgba(252,250,248,.34);border-radius:var(--radius-xs);cursor:pointer;font-size:20px;transition:background var(--dur-state) var(--ease-editorial),border-color var(--dur-state) var(--ease-editorial)}
.cc-lb-btn:hover{background:rgba(252,250,248,.12);border-color:var(--porcelain-050)}
.cc-lb-btn:focus-visible{outline:2px solid var(--porcelain-050);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.cc-lb-scrim,.cc-lb-figure{opacity:1 !important;transform:none !important;transition:none !important}.cc-lb-frame.cc-from-right .cc-lb-img,.cc-lb-frame.cc-from-left .cc-lb-img{animation:none !important}}

/* Mobile nav sheet — cascade of items over a scrim */
.cc-sheet{position:absolute;inset:0;z-index:60;display:grid;grid-template-rows:auto 1fr}
.cc-sheet-scrim{position:relative;z-index:0;background:rgba(21,17,16,.42);opacity:0;border:0;padding:0;cursor:pointer;transition:opacity var(--dur-panel) var(--ease-editorial)}
.cc-sheet.cc-in .cc-sheet-scrim{opacity:1}
.cc-sheet-panel{position:relative;z-index:2;background:var(--porcelain-050);padding:20px;display:grid;align-content:start;gap:4px;transform:translate3d(0,-10px,0);opacity:0;transition:transform var(--dur-panel) var(--ease-out),opacity var(--dur-panel) var(--ease-out)}
.cc-sheet.cc-in .cc-sheet-panel{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){.cc-sheet-scrim,.cc-sheet-panel{opacity:1 !important;transform:none !important;transition:none !important}}