.design-case-page{--case-bg: #111111;--case-text: #f0ede8;--case-muted: #777772;--case-border: #222220;--case-panel: #1a1a1a;display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100svh;background:var(--case-bg);color:var(--case-text)}.design-case-sidebar{position:sticky;top:0;display:flex;height:100svh;flex-direction:column;overflow-y:auto;padding:36px 28px;border-right:1px solid var(--case-border);scrollbar-width:none}.design-case-sidebar::-webkit-scrollbar{display:none}.design-case-sidebar__back,.design-case-sidebar__cta,.design-case-contact a{color:inherit;text-decoration:none}.design-case-sidebar__back{display:inline-flex;width:fit-content;margin-bottom:36px;color:var(--case-muted);font-size:12px;transition:color .18s ease}.design-case-sidebar__back:hover,.design-case-contact a:hover{color:var(--case-text)}.design-case-sidebar__kicker,.design-case-meta dt,.design-case-copy h2{color:var(--case-muted);font-family:var(--font-mono);font-size:9px;font-weight:500;letter-spacing:.12em;line-height:1.3;text-transform:uppercase}.design-case-sidebar__title{margin-top:10px;font-family:Georgia,Times New Roman,serif;font-size:34px;font-weight:400;letter-spacing:-.02em;line-height:1.1}.design-case-sidebar__description{margin-top:14px;color:var(--case-muted);font-size:12px;line-height:1.75}.design-case-sidebar__cta{display:inline-flex;width:fit-content;margin-top:20px;padding:9px 18px;border:1px solid var(--case-border);border-radius:999px;font-size:11px;transition:border-color .18s ease}.design-case-sidebar__cta:hover{border-color:var(--case-text)}.design-case-sidebar__divider{width:100%;height:1px;margin:24px 0;background:var(--case-border)}.design-case-meta{display:flex;flex-direction:column;gap:16px;margin:0}.design-case-meta dd{margin:3px 0 0;color:var(--case-text);font-size:13px}.design-case-copy h2{margin-bottom:10px}.design-case-copy p{margin-bottom:24px;color:var(--case-muted);font-size:12px;line-height:1.75}.design-case-copy strong{color:var(--case-text);font-weight:500}.design-case-contact{display:grid;gap:4px;margin-top:auto;padding-top:24px;border-top:1px solid var(--case-border)}.design-case-contact__title{color:var(--case-text);font-size:13px;font-weight:500}.design-case-contact p:not(.design-case-contact__title),.design-case-contact a{color:var(--case-muted);font-size:12px;line-height:1.5}.design-case-contact nav{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}.design-case-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-content:start;padding:36px 32px}.design-case-carousel{position:relative;aspect-ratio:4 / 5;overflow:hidden;border-radius:6px;background:var(--case-panel);cursor:default;animation:designCaseFadeUp .5s ease both;animation-delay:var(--delay)}.design-case-carousel__track{display:flex;height:100%;transition:transform .42s cubic-bezier(.4,0,.2,1);will-change:transform}.design-case-carousel__slide{width:100%;height:100%;flex:1 0 0;margin:0}.design-case-carousel__slide img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.design-case-carousel__dots{position:absolute;z-index:4;top:8px;right:8px;left:8px;display:flex;gap:3px}.design-case-carousel__dots button{height:2px;flex:1;padding:0;border:0;border-radius:2px;background:#ffffff4d;cursor:pointer;transition:background-color .18s ease}.design-case-carousel__dots button.is-active,.design-case-carousel__dots button:hover,.design-case-carousel__dots button:focus-visible{background:#ffffffe6}.design-case-carousel__nav{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:0 8px;opacity:0;pointer-events:none;transition:opacity .18s ease}.design-case-carousel:hover .design-case-carousel__nav,.design-case-carousel:focus-within .design-case-carousel__nav{opacity:1}.design-case-carousel__nav button{display:grid;width:28px;height:28px;place-items:center;border:0;border-radius:50%;background:#00000080;color:#fff;cursor:pointer;font-size:16px;line-height:1;pointer-events:auto;transition:background-color .18s ease}.design-case-carousel__nav button:hover{background:#000000d9}.design-case-carousel__counter{position:absolute;right:10px;bottom:8px;z-index:2;display:flex;justify-content:flex-end;color:#ffffff8c;font-family:var(--font-mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase}.design-case-sidebar__back:focus-visible,.design-case-sidebar__cta:focus-visible,.design-case-contact a:focus-visible,.design-case-carousel__nav button:focus-visible,.design-case-carousel__dots button:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.design-index-card{position:relative;display:block;aspect-ratio:4 / 5;overflow:hidden;border-radius:6px;background:var(--case-panel);color:var(--case-text);text-decoration:none;animation:designCaseFadeUp .5s ease both;animation-delay:var(--delay)}.design-index-card img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .36s ease}.design-index-card:hover img{transform:scale(1.035)}.design-index-card__overlay{position:absolute;inset:auto 0 0;display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:54px 12px 12px;background:linear-gradient(to top,#000000b8,#0000)}.design-index-card__overlay span{display:grid;gap:4px}.design-index-card__overlay strong{color:#fff;font-size:13px;font-weight:500;line-height:1.2}.design-index-card__overlay small{color:#ffffff9e;font-family:var(--font-mono);font-size:9px;letter-spacing:.05em;line-height:1.35;text-transform:uppercase}.design-index-card:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}@keyframes designCaseFadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1120px){.design-case-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.design-case-page{grid-template-columns:1fr}.design-case-sidebar{position:relative;height:auto;padding:28px 22px;border-right:0;border-bottom:1px solid var(--case-border)}.design-case-sidebar__back{margin-bottom:30px}.design-case-gallery{grid-template-columns:1fr;gap:14px;padding:22px}.design-case-carousel__nav{opacity:1}}