:root { --tm-surface-radius-small: 12px; --tm-surface-radius-medium: 16px; --tm-surface-radius-large: 24px; --tm-surface-shadow-small: 0 3px 10px rgb(32 36 43 / 8%), 0 1px 3px rgb(32 36 43 / 4%); --tm-surface-shadow-medium: 0 8px 20px rgb(32 36 43 / 10%), 0 2px 6px rgb(32 36 43 / 5%); --tm-surface-shadow-large: 0 12px 32px rgb(32 36 43 / 12%), 0 3px 8px rgb(32 36 43 / 5%); }
[data-media-surface="small"] { --media-radius: var(--tm-surface-radius-small); --media-shadow: var(--tm-surface-shadow-small); }
[data-media-surface="medium"] { --media-radius: var(--tm-surface-radius-medium); --media-shadow: var(--tm-surface-shadow-medium); }
[data-media-surface="large"] { --media-radius: var(--tm-surface-radius-large); --media-shadow: var(--tm-surface-shadow-large); }
[data-media-surface] { overflow: hidden; border-radius: var(--media-radius) !important; box-shadow: var(--media-shadow) !important; }
[data-media-surface] > img, [data-media-surface] .product-window, [data-media-surface] .product-window-content, [data-media-surface] .product-window-content > img, [data-media-surface] .tm-short-media { border-radius: inherit !important; box-shadow: none !important; }
#worktool-examples .tm-tool-carousel-viewport { padding-top: 28px; }
@media (max-width: 767px) {
[data-design="4"][data-design="4"] #customer-stories .customer-case { grid-template-columns: minmax(0px, 1fr); gap: 32px; }
}