
.wcm-hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    aspect-ratio: 1920 / 700;
    min-height: 0;
    overflow: hidden;
}
.wcm-hero .wcm-hero-media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.wcm-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .28);
}
.wcm-hero .container {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    color: #fff;
}
.wcm-hero .content {
    position: relative;
    bottom: auto;
    max-width: 800px;
    margin-top: auto;
    background: transparent;
}
.hero-media video,
.brand-slide-card video,
.category-card video,
.product-card video,
.project-card .image video,
.blog-card .image video,
.service-cover-content > video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product-gallery .main-image a { display: block; height: 100%; }
.product-gallery .main-image video,
.product-gallery .thumbs video { width: 100%; height: 100%; object-fit: contain; }
.gallery-area video {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}
.wcm-contact-form label { display: block; margin-bottom: 8px; }
.wcm-captcha { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.faq-title { width: 100%; text-align: left; border: 0; background: transparent; }
.product-filter .filter-group { margin-bottom: 20px; }
.product-filter .link-btn { display: block; margin-top: 12px; }
.marquee-strip a { color: inherit; }
@media (max-width: 767px) {
    .wcm-hero { aspect-ratio: 16 / 10; }
    .wcm-hero .desc { font-size: 14px; }
    .wcm-captcha { flex-wrap: wrap; }
    body.home-page .hero-area .content {
        left: 20px;
        right: 20px;
        width: auto;
        max-width: calc(100% - 40px);
    }
    body.home-page .hero-area .content .title { font-size: clamp(2rem, 8.3vw, 2.6rem); }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
    .wow { visibility: visible !important; }
}

.breadcrumb > :not(:last-child)::after {
    content: "/";
    display: inline-block;
    margin-inline-start: 12px;
    color: inherit;
    opacity: 0.5;
}

.popular-tags .tags a.active {
    background: var(--primary-color);
    color: var(--light-color);
}

.blog-tools .blog-search,
.blog-tools .popular-tags {
    min-width: 0;
}

.popular-tags .tags {
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: auto;
    padding: 3px 3px 12px;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--primary-color) var(--line-color);
}

.popular-tags .tags a {
    flex: 0 0 auto;
    white-space: nowrap;
}

.popular-tags .tags::-webkit-scrollbar {
    height: 7px;
}

.popular-tags .tags::-webkit-scrollbar-track {
    background: var(--line-color);
    border-radius: 999px;
}

.popular-tags .tags::-webkit-scrollbar-thumb {
    background: var(--primary-color);
    border-radius: 999px;
}

.popular-tags .tags::-webkit-scrollbar-thumb:hover {
    background: var(--dark-color);
}

.popular-tags .tags:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 4px;
}

@supports selector(::-webkit-scrollbar) {
    .popular-tags .tags {
        scrollbar-width: auto;
        scrollbar-color: auto;
    }
}

.form-error { display: block; color: #b42318; margin-top: 6px; font-size: 13px; }
.contact-area .info-card .value + .value { margin-top: 8px; }

.wcm-contact-form .captcha-row .wcm-captcha { margin-bottom: 0; gap: 8px; flex-wrap: nowrap; }
.captcha-image { flex-shrink: 0; }
.captcha-image img { display: block; max-width: 100%; height: auto; border-radius: 8px; }
.captcha-refresh { flex-shrink: 0; width: 40px; height: 44px; padding: 0; border: 1px solid var(--line-color); border-radius: 8px; background: var(--surface-color); color: var(--primary-color); }
.captcha-refresh:hover, .captcha-refresh:focus-visible { border-color: var(--primary-color); }
.captcha-refresh:disabled { opacity: .5; cursor: wait; }
.contact-form-wrap .section-title .desc { margin: 0 0 16px; max-width: 65ch; }
.wcm-contact-form .select2-container--default .select2-selection--multiple { min-height: 50px; padding: 7px 12px; border: 1px solid var(--line-color); border-radius: var(--border-radius); background: var(--surface-color); }
.wcm-contact-form .select2-container--focus .select2-selection--multiple { border-color: var(--primary-color); }
.wcm-contact-form .select2-selection__rendered { display: flex !important; flex-wrap: wrap; gap: 5px; padding: 0 !important; }
.wcm-contact-form .select2-container--default .select2-selection__choice { display: flex; align-items: center; gap: 5px; margin: 0; padding: 4px 8px; border: 0; border-radius: 6px; background: var(--light-color, #f6efeb); color: var(--dark-color); white-space: normal; }
.wcm-contact-form .select2-search--inline .select2-search__field { margin-top: 3px; font: inherit; min-width: 120px; max-width: 100%; }
.offer-products-dropdown { font-family: var(--title-font); border-color: var(--line-color); }
.select2-container--default .offer-products-dropdown .select2-results__option--highlighted[aria-selected] { background: var(--primary-color); }
.catalog-actions { display: flex; align-items: center; gap: 12px; }
.catalog-preview { max-width: 650px; }
.catalog-preview img { display: block; max-width: 100%; max-height: 60vh; margin: 24px auto; object-fit: contain; }
@media (max-width: 575px) {
    .catalog-actions { gap: 6px; }
    .catalog-download-item .catalog-action { flex-shrink: 0; }
}

.hero-media video{position:absolute;inset:0}.hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media(max-width:767px){.hero-media video{display:none}}

/* Reserve the actual carousel footprint before Owl initializes (layout-shift trace: about-us-area). */
body.home-page .hero-area{height:100vh;height:100svh;min-height:720px}
.hero-slider:not(.owl-loaded){display:block}
.hero-slider:not(.owl-loaded) .hero-slide:not(:first-child){display:none}
@media(max-width:767px){body.home-page .hero-area,body.home-page .hero-area .hero-slider,body.home-page .hero-area .owl-stage-outer,body.home-page .hero-area .owl-stage,body.home-page .hero-area .owl-item,body.home-page .hero-area .hero-slide{height:100svh;min-height:620px}}
