.usecase-preview-block{display:flex;flex-direction:column;gap:var(--gap-l)}.preview-top{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--gap-s)}.preview-top .header-area{display:flex;flex-direction:column;gap:var(--gap-xs)}.preview-top .header-area p,.preview-top .header-area h2{margin:0}.preview-controls{display:flex;gap:var(--gap-xs);flex-shrink:0}.preview-nav{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border:1px solid currentColor;border-radius:50%;background:transparent;color:inherit;font-size:1.2rem;cursor:pointer;transition:opacity var(--transition-default),background var(--transition-default);line-height:1;padding:0}.preview-nav:hover:not(:disabled){background:color-mix(in srgb,currentColor 10%,transparent)}.preview-nav:disabled{opacity:.25;cursor:default}.preview-viewport{overflow:hidden}.preview-track{gap:var(--gap-xl);display:flex;transition:transform .4s ease}.preview-card{display:flex;flex-direction:row;flex:0 0 auto;gap:var(--gap-l);color:inherit;text-decoration:none;justify-content:center;position:static}.preview-card:before,.preview-card:after{display:none}.preview-card-media{position:relative;width:300px;height:300px;flex:0 0 300px;overflow:hidden;border-radius:var(--border-radius)}.preview-card-media img,.preview-card-media video{width:100%;height:100%;object-fit:cover;display:block}.preview-card-stats{flex-direction:column;position:absolute;inset:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--gap-xs);padding:var(--gap-s);pointer-events:none}.preview-card-content{width:300px;flex:0 0 300px;display:flex;flex-direction:column;justify-content:center;gap:var(--gap-xs)}.preview-card-content .preview-type{font-size:var(--font-size-xs);font-family:var(--font-main-superwide);margin:0}.preview-card-content .preview-title{font-size:var(--font-size-l);font-family:var(--font-main);line-height:var(--line-height-title);margin:0}.preview-card-content .preview-summary{font-size:var(--font-size-m);margin:0}.preview-card-content .preview-cta{margin-top:var(--gap-xs)}.preview-card-all{display:flex;flex:0 0 632px;min-height:300px;align-items:flex-end;justify-content:space-between;gap:var(--gap-l);padding:var(--gap-l);border:1px solid color-mix(in srgb,currentColor 22%,transparent);border-radius:var(--border-radius);background:linear-gradient(135deg,color-mix(in srgb,var(--secondary-color) 18%,transparent),transparent 58%),color-mix(in srgb,currentColor 4%,transparent);color:inherit;text-align:left;text-decoration:none;position:relative;overflow:hidden;transition:border-color var(--transition-default),transform var(--transition-default)}.preview-card-all:before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--secondary-gradient)}.preview-card-all:after{display:none}.preview-card-all:hover,.preview-card-all:focus-visible{border-color:color-mix(in srgb,var(--secondary-color) 72%,currentColor)}.preview-card-all-copy{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gap-xs);max-width:27rem}.preview-card-all-copy p,.preview-card-all-copy h3{margin:0}.preview-card-all-copy h3{font-family:var(--font-main);font-size:var(--font-size-xl);line-height:var(--line-height-title)}.preview-card-all-copy>p:last-child{font-size:var(--font-size-m);line-height:var(--line-height-body)}.preview-card-all-arrow{display:grid;place-items:center;flex:0 0 3rem;width:3rem;height:3rem;border-radius:50%;background:var(--black-dark);color:var(--white-light);font-size:1.4rem;line-height:1;transition:transform var(--transition-default)}.preview-card-all:hover .preview-card-all-arrow,.preview-card-all:focus-visible .preview-card-all-arrow{transform:translate(.25rem)}@media(max-width:850px){.preview-card,.preview-card-all{width:100%;flex:0 0 100%}.preview-card{flex-direction:column;align-items:center;justify-content:space-between}.preview-card-media{width:100%;flex:0 0 auto}.preview-card-content{width:100%;flex:0 0 auto;max-width:400px}.preview-card-all{min-height:420px}}@media(max-width:580px){.preview-card-stats{flex-direction:column}.preview-card-all{min-height:360px;padding:var(--gap-m)}.preview-card-all-copy h3{font-size:var(--font-size-l)}}
