html {
    scroll-behavior: smooth;
    scroll-padding-top: 76px;
}

body {
    text-rendering: optimizeLegibility;
}

img {
    max-width: 100%;
    height: auto;
}

a:focus-visible,
button:focus-visible {
    outline: 2px solid #2f7aff;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

@supports (content-visibility: auto) {
    .section-wrap,
    .bundle-section,
    .cat-overview,
    .features-section,
    .services-section,
    .process-section,
    .content-section,
    .timeline-wrap,
    .tips-section,
    .cta-section,
    .product-row,
    .component-block,
    .intro-card,
    .contact-card,
    .service-card,
    .overview-grid {
        content-visibility: auto;
        contain-intrinsic-size: auto 520px;
    }

    .comp-card,
    .soft-card,
    .module-card,
    .advantage-item,
    .process-cell,
    .service-cell,
    .mini-card {
        content-visibility: auto;
        contain-intrinsic-size: auto 220px;
    }
}