.cp-showcase{--cp-primary:var(--site-primary,#2563eb);--cp-ink:#17243b;--cp-muted:#68778c;--cp-border:#e2e8f0;--cp-surface:#fff;--cp-soft:#f6f8fc;color:var(--cp-ink)}
.cp-showcase .cp-card-grid{display:grid;grid-template-columns:repeat(var(--cp-columns,3),minmax(0,1fr));gap:24px;align-items:stretch}
.cp-showcase .cp-card{box-sizing:border-box;display:flex;flex-direction:column;min-width:0;height:100%;background:var(--cp-surface);border:1px solid var(--cp-border);border-radius:17px;overflow:hidden;box-shadow:0 3px 14px #1b335004;transition:box-shadow .2s,border-color .2s,transform .2s}
.cp-showcase .cp-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--cp-primary) 25%,var(--cp-border));box-shadow:0 14px 32px #1b335010}
.cp-showcase .cp-card-media{display:block;position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;flex-shrink:0;background:var(--cp-soft);color:var(--cp-primary);text-decoration:none;border-bottom:1px solid var(--cp-border)}
.cp-showcase .cp-card-media>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s}
.cp-showcase .cp-card:hover .cp-card-media>img{transform:scale(1.035)}
.cp-showcase .cp-media-empty{display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 75% 20%,color-mix(in srgb,var(--cp-primary) 7%,transparent),transparent 65%),var(--cp-soft)}
.cp-showcase .cp-empty-symbol{display:flex;align-items:center;justify-content:center;width:90px;height:90px;border-radius:26px;border:1px solid color-mix(in srgb,var(--cp-primary) 12%,var(--cp-border));background:var(--cp-surface);color:color-mix(in srgb,var(--cp-primary) 75%,var(--cp-muted));transform:rotate(-6deg)}
.cp-showcase .cp-empty-symbol svg{transform:rotate(6deg)}
.cp-showcase .cp-media-arrow{display:flex;align-items:center;justify-content:center;position:absolute;inset-block-start:14px;inset-inline-end:14px;width:34px;height:34px;border-radius:50%;background:var(--cp-surface);color:var(--cp-ink);font-size:18px;box-shadow:0 2px 8px #0f172a0d;opacity:0;transition:opacity .2s}
.cp-showcase .cp-card:hover .cp-media-arrow,.cp-showcase .cp-card:focus-within .cp-media-arrow{opacity:1}
.cp-showcase .cp-project-image-link{position:absolute;inset:0}
.cp-showcase .cp-card-body{display:flex;flex-direction:column;flex:1;min-width:0;padding:24px;align-items:flex-start}
.cp-showcase .cp-service-icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;background:color-mix(in srgb,var(--cp-primary) 8%,var(--cp-surface));color:var(--cp-primary);border-radius:11px;font-size:21px;margin-block-end:15px}
.cp-showcase .cp-card h3{font-size:1.04rem;font-weight:700;line-height:1.9;margin:0 0 10px;color:var(--cp-ink);overflow-wrap:anywhere}
.cp-showcase .cp-card h3 a{color:inherit;text-decoration:none}
.cp-showcase .cp-card h3 a:hover{color:var(--cp-primary)}
.cp-showcase .cp-card-description{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:.86rem;line-height:2.05;color:var(--cp-muted);margin:0 0 20px;overflow-wrap:anywhere}
.cp-showcase .cp-card-link{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;margin-block-start:auto;padding-block-start:16px;border-top:1px solid var(--cp-border);font-size:.81rem;font-weight:600;line-height:1.9;color:var(--cp-primary);text-decoration:none}
.cp-showcase .cp-card-link>span[aria-hidden]{font-size:18px;transition:transform .2s}
.cp-showcase .cp-card-link:hover>span[aria-hidden]{transform:translateX(-3px)}
.cp-showcase .cp-category{display:inline-block;max-width:100%;border-radius:6px;padding:3px 8px;margin-block-end:10px;background:color-mix(in srgb,var(--cp-primary) 7%,var(--cp-surface));color:var(--cp-primary);font-size:.72rem;font-weight:500;line-height:1.9;overflow-wrap:anywhere}
.cp-showcase .cp-card-client{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:.77rem;line-height:1.9;margin:0 0 17px;color:var(--cp-muted)}
.cp-showcase .cp-card-client strong{font-weight:500;color:var(--cp-ink)}
.cp-showcase .cp-service-list{grid-template-columns:1fr}
.cp-showcase .cp-service-list>.cp-card{flex-direction:row;align-items:stretch}
.cp-showcase .cp-service-list .cp-card-media{width:32%;max-width:320px;aspect-ratio:auto;min-height:210px;border-bottom:0;border-inline-end:1px solid var(--cp-border)}
.cp-showcase .cp-service-list .cp-card-body{padding:26px 30px}
.cp-showcase .cp-service-list .cp-service-icon{width:36px;height:36px;font-size:18px;margin-block-end:10px}
.cp-showcase .cp-service-list .cp-card-description{-webkit-line-clamp:2;max-width:780px}
.cp-showcase .cp-service-list .cp-card-link{max-width:210px}
.cp-detail-heading .cz-page-heading{padding-block:clamp(36px,5vw,64px);background:linear-gradient(120deg,color-mix(in srgb,var(--site-primary,#2563eb) 4%,#f7f9fc),#f9fafc)}
.cp-detail-heading .cz-page-heading h1{font-size:clamp(1.6rem,3vw,2.45rem);line-height:1.7;max-width:900px;margin-block:16px 12px;overflow-wrap:anywhere}
.cp-detail-heading .cz-page-heading .cz-prose{font-size:.98rem;line-height:2;max-width:800px;color:#68778c}
.cp-detail-heading .cz-breadcrumb{font-size:.78rem;line-height:1.9}
.cp-showcase.cp-detail{padding-block:clamp(32px,5vw,64px)}
.cp-showcase .cp-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:34px;align-items:start}
.cp-showcase .cp-detail-wide{grid-template-columns:1fr}
.cp-showcase .cp-detail-main{min-width:0;display:grid;gap:30px}
.cp-showcase .cp-detail-image{width:100%;margin:0;border-radius:18px;overflow:hidden;background:var(--cp-soft);border:1px solid var(--cp-border)}
.cp-showcase .cp-detail-image>img{display:block;width:100%;max-height:560px;object-fit:contain;height:auto}
.cp-showcase .cp-content-panel{padding:30px;border:1px solid var(--cp-border);border-radius:17px;background:var(--cp-surface)}
.cp-showcase .cp-section-heading{display:flex;align-items:center;gap:11px;margin-block-end:22px}
.cp-showcase .cp-section-heading>span{width:4px;height:23px;border-radius:3px;background:var(--cp-primary);flex-shrink:0}
.cp-showcase .cp-section-heading h2{font-size:1.15rem;line-height:1.9;font-weight:700;color:var(--cp-ink);margin:0}
.cp-showcase .cp-prose{font-size:.96rem;line-height:2.3;color:var(--cp-muted);white-space:pre-line;overflow-wrap:anywhere}
.cp-showcase .cp-detail-aside{min-width:0;display:grid;gap:20px;position:sticky;top:110px}
.cp-showcase .cp-side-panel{padding:25px;border:1px solid var(--cp-border);background:var(--cp-surface);border-radius:16px}
.cp-showcase .cp-side-panel h2{font-size:1.02rem;line-height:1.9;margin:0 0 20px;color:var(--cp-ink)}
.cp-showcase .cp-small-label{display:block;font-size:.72rem;font-weight:600;line-height:1.9;color:var(--cp-primary);margin-block-end:7px}
.cp-showcase .cp-benefits{padding:0;margin:0;list-style:none;display:grid;gap:16px}
.cp-showcase .cp-benefits li{display:flex;align-items:flex-start;gap:10px;font-size:.85rem;line-height:2;color:var(--cp-muted);overflow-wrap:anywhere}
.cp-showcase .cp-benefits li>span[aria-hidden]{display:flex;align-items:center;justify-content:center;flex:0 0 22px;height:22px;border-radius:50%;background:color-mix(in srgb,var(--cp-primary) 8%,var(--cp-surface));color:var(--cp-primary);font-size:12px;margin-block-start:3px}
.cp-showcase .cp-inquiry-panel{padding:26px;border:1px solid color-mix(in srgb,var(--cp-primary) 16%,var(--cp-border));border-radius:16px;background:color-mix(in srgb,var(--cp-primary) 4%,var(--cp-surface))}
.cp-showcase .cp-inquiry-panel h2{font-size:1.12rem;line-height:1.9;margin:0 0 12px;color:var(--cp-ink)}
.cp-showcase .cp-inquiry-panel p{font-size:.85rem;line-height:2.1;color:var(--cp-muted);margin:0 0 20px}
.cp-showcase .cp-primary-link{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:46px;padding:10px 16px;background:var(--cp-primary);color:var(--cz-on-primary,#fff);border:1px solid var(--cp-primary);border-radius:10px;text-decoration:none;font-size:.82rem;font-weight:600;line-height:1.9}
.cp-showcase .cp-primary-link:hover{filter:brightness(.95)}
.cp-showcase .cp-project-meta{display:grid;gap:0;margin:0 0 22px}
.cp-showcase .cp-project-meta>div{padding-block:15px;border-bottom:1px solid var(--cp-border)}
.cp-showcase .cp-project-meta>div:first-child{padding-block-start:0}
.cp-showcase .cp-project-meta dt{font-size:.75rem;line-height:1.9;color:var(--cp-muted);margin-block-end:5px;font-weight:400}
.cp-showcase .cp-project-meta dd{font-size:.9rem;line-height:1.9;color:var(--cp-ink);font-weight:600;margin:0;overflow-wrap:anywhere}
.cp-showcase .cp-related,.cp-showcase .cp-gallery-section{margin-block-start:56px;padding-block-start:36px;border-top:1px solid var(--cp-border)}
.cp-showcase .cp-gallery-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-block-end:22px}
.cp-showcase .cp-gallery-heading .cp-section-heading{margin:0}
.cp-showcase .cp-gallery-heading>p{font-size:.79rem;line-height:1.9;color:var(--cp-muted);margin:0}
.cp-showcase .cp-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cp-showcase .cp-gallery-item{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--cp-border);background:var(--cp-soft)}
.cp-showcase .cp-gallery-item>a{display:block;position:relative;aspect-ratio:4/3;overflow:hidden}
.cp-showcase .cp-gallery-item img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.cp-showcase .cp-gallery-item a:hover img{transform:scale(1.035)}
.cp-showcase .cp-gallery-zoom{display:flex;align-items:center;justify-content:center;position:absolute;inset-block-end:12px;inset-inline-end:12px;border-radius:50%;width:34px;height:34px;background:var(--cp-surface);color:var(--cp-ink);font-size:18px;box-shadow:0 3px 14px #0f172a18}
.cp-showcase a:focus-visible{outline:3px solid color-mix(in srgb,var(--cp-primary) 50%,transparent);outline-offset:4px}
body[data-color-scheme="dark"] .cp-showcase{--cp-ink:#e8eef8;--cp-muted:#a8b7ce;--cp-border:#334159;--cp-surface:#172235;--cp-soft:#121d2e}
body[data-color-scheme="dark"] .cp-detail-heading .cz-page-heading{background:#121d2e;color:#e8eef8}
body[data-color-scheme="dark"] .cp-detail-heading .cz-page-heading .cz-prose{color:#a8b7ce}
@media(min-width:992px){.cp-showcase .cp-project-featured>.cp-card:first-child{grid-column:span 2}.cp-showcase .cp-project-featured>.cp-card:first-child .cp-card-media{aspect-ratio:21/9}}
@media(max-width:1100px) and (min-width:768px){.cp-showcase .cp-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cp-showcase .cp-service-list{grid-template-columns:1fr}}
@media(max-width:991.98px){.cp-showcase .cp-detail-grid{grid-template-columns:1fr;gap:26px}.cp-showcase .cp-detail-aside{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.cp-showcase .cp-detail-aside>section:only-child{grid-column:1/-1}.cp-showcase .cp-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cp-showcase .cp-card-body{padding:21px}}
@media(max-width:767.98px){.cp-showcase .cp-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.cp-showcase .cp-service-list{grid-template-columns:1fr}.cp-showcase .cp-service-list .cp-card-media{width:34%;min-height:190px}.cp-showcase .cp-service-list .cp-card-body{padding:20px}.cp-showcase .cp-media-arrow{opacity:1}.cp-showcase .cp-detail-aside{grid-template-columns:1fr}.cp-showcase .cp-content-panel{padding:24px}.cp-showcase .cp-related,.cp-showcase .cp-gallery-section{margin-block-start:36px;padding-block-start:28px}}
@media(max-width:575.98px){.cp-showcase .cp-card-grid{grid-template-columns:1fr}.cp-showcase .cp-card-media{aspect-ratio:16/9}.cp-showcase .cp-service-list>.cp-card{flex-direction:column}.cp-showcase .cp-service-list .cp-card-media{width:100%;max-width:none;aspect-ratio:16/9;min-height:0;border-inline-end:0;border-bottom:1px solid var(--cp-border)}.cp-showcase .cp-service-list .cp-card-body{padding:22px}.cp-showcase .cp-card h3{font-size:1.02rem}.cp-showcase .cp-content-panel{padding:22px 18px}.cp-showcase .cp-detail-image{border-radius:14px}.cp-showcase .cp-side-panel,.cp-showcase .cp-inquiry-panel{padding:22px}.cp-showcase .cp-gallery-grid{gap:12px}.cp-showcase .cp-gallery-zoom{width:28px;height:28px;inset-block-end:8px;inset-inline-end:8px;font-size:15px}.cp-showcase .cp-prose{font-size:.91rem;line-height:2.2}}
@media(prefers-reduced-motion:reduce){.cp-showcase *{transition:none!important;scroll-behavior:auto!important}.cp-showcase .cp-card:hover,.cp-showcase .cp-card:hover .cp-card-media>img,.cp-showcase .cp-gallery-item a:hover img{transform:none}}