html body .elementor-5601 .elementor-element.elementor-element-7675ee44 {
--content-width: 100%;
--padding-left: var(--cie-section-padding-inline);
--padding-right: var(--cie-section-padding-inline);
padding-inline: var(--cie-section-padding-inline) !important;
}
html body .elementor-5601 .elementor-element.elementor-element-7675ee44 > .e-con-inner {
max-width: 100% !important;
width: 100% !important;
padding-inline: 0 !important;
}
body .elementor-5601 .cie-home-range-grid {
--cie-range-gap: clamp(12px, 1.25vw, 24px);
--cie-range-columns: 5;
--cie-range-width: calc((100% - (var(--cie-range-columns) - 1) * var(--cie-range-gap)) / var(--cie-range-columns));
display: flex;
width: 100%;
flex-wrap: wrap;
justify-content: center;
align-items: stretch;
gap: var(--cie-range-gap);
}
body .elementor-5601 .cie-home-range-grid .cie-home-range-card {
display: flex;
flex-direction: column;
flex: 0 0 clamp(0px, var(--cie-range-width), 100%);
width: clamp(0px, var(--cie-range-width), 100%);
min-width: 0;
border-radius: clamp(22px, 2.083333vw, 30px);
}
html body .elementor-5601 .cie-home-range-grid .cie-home-range-card .s3i-parent-cat-thumb {
height: clamp(140px, 11.111111vw, 192px) !important;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
html body .elementor-5601 .cie-home-range-grid .cie-home-range-card .s3i-parent-cat-thumb img {
width: 90% !important;
height: 75% !important;
object-fit: contain;
max-height: none !important;
transform: none !important;
} html body .elementor-5601 .cie-home-range-grid .cie-home-range-card[href$="/product-category/intercom/"] .s3i-parent-cat-thumb img {
height: 58% !important;
}
html body .elementor-5601 .cie-home-range-grid .cie-home-range-card[href$="/product-category/access-control/"] .s3i-parent-cat-thumb img {
height: 55% !important;
}
html body .elementor-5601 .cie-home-range-grid .cie-home-range-card:is([href$="/product-category/audio/"], [href$="/product-category/audio-visual/"]) .s3i-parent-cat-thumb img {
width: 90% !important;
max-width: 100% !important;
height: 85% !important;
}
body .elementor-5601 .cie-home-range-card .s3i-parent-cat-content {
flex: 1;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
padding: clamp(16px, 1.458333vw, 28px) !important;
gap: clamp(12px, 1.041667vw, 20px) !important;
text-align: left;
}
body .elementor-5601 .cie-home-range-card .s3i-parent-cat-title {
text-align: left;
margin: 0;
font-size: clamp(18px, 1.145833vw, 22px) !important;
line-height: 1.35 !important;
}
body .elementor-5601 .cie-home-range-card .cie-home-range-description {
margin: 0;
font-size: clamp(16px, 0.9375vw, 18px);
line-height: 1.5;
color: #292929;
}
body .elementor-5601 .cie-home-range-card:is(:hover, :focus-visible) .cie-home-range-description {
color: #fff;
}
body .elementor-5601 .cie-home-range-card .cie-home-range-cta {
display: inline-flex;
align-items: center;
justify-content: center;
align-self: flex-start;
margin-top: auto;
max-width: 100%;
min-height: 44px;
padding: clamp(10px, 0.833333vw, 16px) clamp(16px, 1.25vw, 24px);
border-radius: 999px;
background: var(--e-global-color-5631cd3, #a6ce39);
color: #000 !important;
font-size: clamp(16px, 0.9375vw, 18px);
font-weight: 600;
line-height: 1.25;
text-align: center;
transition: background-color .2s ease;
}
body .elementor-5601 .cie-home-range-card .cie-home-range-cta:hover,
body .elementor-5601 .cie-home-range-card:focus-visible .cie-home-range-cta {
background: var(--e-global-color-af3cd91, #cad1d6);
color: #000 !important;
}
@media (max-width: 1279px) {
body .elementor-5601 .cie-home-range-grid { --cie-range-columns: 3; }
}
@media (max-width: 900px) {
body .elementor-5601 .cie-home-range-grid { --cie-range-columns: 2; }
}
@media (max-width: 599px) {
body .elementor-5601 .cie-home-range-grid { --cie-range-columns: 1; }
} html body .elementor-5601 .elementor-element.elementor-element-45dde1e4 {
display: block !important;
} @media (hover: hover) and (pointer: fine) {
body .elementor-5601 .cie-home-range-grid .cie-home-range-card {
--cie-range-card-height: clamp(320px, 23.611111vw, 400px);
--cie-range-title-rail: clamp(64px, 4.583333vw, 88px);
--cie-range-panel-padding: clamp(16px, 1.458333vw, 28px);
position: relative;
height: var(--cie-range-card-height);
overflow: hidden;
}
html body .elementor-5601 .cie-home-range-grid .cie-home-range-card .s3i-parent-cat-thumb {
height: calc(var(--cie-range-card-height) - var(--cie-range-title-rail)) !important;
}
body .elementor-5601 .cie-home-range-card .s3i-parent-cat-content {
position: absolute;
inset-inline: 0;
bottom: 0;
max-height: 100%;
background: inherit;
border-radius: 0;
transform: translateY(calc(100% - var(--cie-range-title-rail)));
transition: transform .3s ease;
}
body .elementor-5601 .cie-home-range-card .s3i-parent-cat-title {
display: flex;
align-items: center;
min-height: calc(var(--cie-range-title-rail) - 2 * var(--cie-range-panel-padding));
flex-shrink: 0;
}
body .elementor-5601 .cie-home-range-card :is(.cie-home-range-description, .cie-home-range-cta) {
visibility: hidden;
}
body .elementor-5601 .cie-home-range-card:is(:hover, :focus-visible) .s3i-parent-cat-content {
transform: translateY(0);
overflow-y: auto;
}
body .elementor-5601 .cie-home-range-card:is(:hover, :focus-visible) :is(.cie-home-range-description, .cie-home-range-cta) {
visibility: visible;
}
}
@media (prefers-reduced-motion: reduce) {
body .elementor-5601 .cie-home-range-grid .cie-home-range-card,
body .elementor-5601 .cie-home-range-card .s3i-parent-cat-content,
body .elementor-5601 .cie-home-range-card .cie-home-range-cta {
transition: none !important;
}
}