.elementor-9701 .elementor-element.elementor-element-5b804f5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9701 .elementor-element.elementor-element-387dc52{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9701 .elementor-element.elementor-element-387dc52:not(.elementor-motion-effects-element-type-background), .elementor-9701 .elementor-element.elementor-element-387dc52 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://dervirga-smart.com/wp-content/uploads/2026/07/dervirga-zigbee-relays-control-modules-hero.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-9701 .elementor-element.elementor-element-d9caf0d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-9701 .elementor-element.elementor-element-ecbbcad{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9701 .elementor-element.elementor-element-3b00720{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-divider .elementor-divider__text{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-9701 .elementor-element.elementor-element-e7fe0d9{--divider-border-style:solid;--divider-color:#000;--divider-border-width:1px;}.elementor-9701 .elementor-element.elementor-element-e7fe0d9 .elementor-divider-separator{width:100%;}.elementor-9701 .elementor-element.elementor-element-e7fe0d9 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-9701 .elementor-element.elementor-element-00eaf7b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-button .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );}.elementor-9701 .elementor-element.elementor-element-6dbd725 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-9701 .elementor-element.elementor-element-c1f1b98{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9701 .elementor-element.elementor-element-baa2c96{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-477d07a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-d822115{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-8e0162f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-widget-image .widget-image-caption{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-9701 .elementor-element.elementor-element-0708ae9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-9701 .elementor-element.elementor-element-eb28e07 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-9701 .elementor-element.elementor-element-eb28e07 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-9701 .elementor-element.elementor-element-eb28e07{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-9701 .elementor-element.elementor-element-eb28e07 .elementor-icon-list-text{transition:color 0.3s;}.elementor-9701 .elementor-element.elementor-element-04ab348 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-9701 .elementor-element.elementor-element-46c4123{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-b565010{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-3c6e872{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-086491e .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-9701 .elementor-element.elementor-element-086491e .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-9701 .elementor-element.elementor-element-086491e{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-9701 .elementor-element.elementor-element-086491e .elementor-icon-list-text{transition:color 0.3s;}.elementor-9701 .elementor-element.elementor-element-353fbab .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-9701 .elementor-element.elementor-element-3cdf7ef{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-267fde7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-895e4ef{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-cdc0e1c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-a1eae1b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-44791c1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-b985cee{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-2e6d846{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-000a285{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-5cbc544{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-32f5268{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-cbb0e27{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-bfdb9e1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-894dd10{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-5b29262{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-a78b2c6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-55dfb2d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-426fe0d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-f0f1f13{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-c72cedd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-015edda{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-11c7013 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-9701 .elementor-element.elementor-element-12a8577{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-8187aca{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-cfe55e9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-b769427{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-1be1b33{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-1b24451{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-e7ca5eb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-ee68a27{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-79b4fc3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-2df595e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-be18998{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-f9a3697{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-c240fa0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-7dda738{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-4fa3ff6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-2f59403{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-79f8736{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-112aaae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-2eaecb8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-9404cbf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-149ab4d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-e26ca4b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-0daff59{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-3ed1bed{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-2f675d0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-8f66de2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-8f66de2:not(.elementor-motion-effects-element-type-background), .elementor-9701 .elementor-element.elementor-element-8f66de2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://dervirga-smart.com/wp-content/uploads/2026/07/dervirga-zigbee-relay-oem-odm-project-support.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-9701 .elementor-element.elementor-element-c953c4a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-bf510fa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-9701 .elementor-element.elementor-element-6a1a24f .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-9701 .elementor-element.elementor-element-c9db8e2 .elementor-button-content-wrapper{flex-direction:row-reverse;}@media(min-width:1025px){.elementor-9701 .elementor-element.elementor-element-387dc52:not(.elementor-motion-effects-element-type-background), .elementor-9701 .elementor-element.elementor-element-387dc52 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:scroll;}.elementor-9701 .elementor-element.elementor-element-8f66de2:not(.elementor-motion-effects-element-type-background), .elementor-9701 .elementor-element.elementor-element-8f66de2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:scroll;}}@media(max-width:1024px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-divider .elementor-divider__text{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );}.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-size:var( --e-global-typography-text-font-size );}}@media(max-width:767px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-divider .elementor-divider__text{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );}.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-size:var( --e-global-typography-text-font-size );}}/* Start custom CSS for container, class: .elementor-element-5b804f5 *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 01 — HERO BANNER WITH BREADCRUMB

   Banner background:
   .dv-zigbee-relays-01-inner
   ========================================================= */


/* =========================================================
   01. HERO OUTER SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 0 40px;

  display: flex;
  align-items: center;
  justify-content: center;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #05302F;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5,
.elementor-9701 .elementor-element.elementor-element-5b804f5 * {
  box-sizing: border-box;
}


/* =========================================================
   02. HERO INNER — BANNER CONTENT WINDOW
   Background image is placed on this container
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-inner {
  position: relative;
  isolation: isolate;

  width: 100%;
  max-width: 1200px;
  min-height: 560px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;

  overflow: hidden;

  background-color: #0C504E;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-attachment: scroll !important;
}


/* =========================================================
   03. LEFT DARK-GREEN GRADIENT OVERLAY
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-inner::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 0;

  pointer-events: none;

  background:
    linear-gradient(
      90deg,
      rgba(5, 48, 47, 0.98) 0%,
      rgba(5, 48, 47, 0.96) 25%,
      rgba(7, 62, 60, 0.84) 43%,
      rgba(8, 70, 68, 0.50) 60%,
      rgba(8, 70, 68, 0.14) 78%,
      rgba(8, 70, 68, 0) 100%
    );
}


/* =========================================================
   04. BREADCRUMB CONTAINER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb {
  position: relative;
  z-index: 2;

  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 28px 54px 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;

  color: rgba(255, 255, 255, 0.76);
}


/* Elementor spacing reset */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-breadcrumb
  > .elementor-element,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-breadcrumb
  .elementor-widget,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-breadcrumb
  .elementor-widget-container,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-breadcrumb-widget {
  width: 100%;

  margin: 0 !important;
  padding: 0 !important;
}


/* =========================================================
   05. BREADCRUMB NAVIGATION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-nav {
  width: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;

  column-gap: 0;
  row-gap: 4px;
}


/* Previous-level links */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-link {
  display: inline-flex;
  align-items: center;

  width: auto;

  color: rgba(255, 255, 255, 0.76);
  text-decoration: none;

  transition:
    color 0.25s ease,
    opacity 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-link:hover,
.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-link:focus-visible {
  color: #FFB304;
  text-decoration: none;
}


/* Breadcrumb separators */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-separator {
  display: inline-flex;
  align-items: center;

  width: auto;

  padding: 0 8px;

  font-size: 15px;
  font-weight: 400;
  line-height: 1;

  color: rgba(255, 179, 4, 0.88);
}


/* Current page */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-current {
  display: inline-flex;
  align-items: center;

  width: auto;

  font-weight: 600;

  color: #FFB304;
}


/* Breadcrumb keyboard focus */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-link:focus-visible {
  outline: 2px solid rgba(255, 179, 4, 0.72);
  outline-offset: 3px;
}


/* =========================================================
   06. HERO BODY
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-body {
  position: relative;
  z-index: 2;

  width: 100%;
  min-width: 0;
  min-height: 0;

  margin: 0;
  padding: 18px 54px 42px;

  display: flex;
  flex: 1 1 auto;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}


/* Elementor container reset */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-body
  > .elementor-element {
  min-width: 0;
}


/* =========================================================
   07. HERO CONTENT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-content {
  position: relative;
  z-index: 2;

  width: 49%;
  max-width: 550px;
  min-width: 0;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;

  gap: 0 !important;
}


/* 除顶部标签外，直接子组件占满内容栏宽度 */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-content
  > .elementor-element:not(.dv-zigbee-relays-01-label) {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
}


/* =========================================================
   08. EYEBROW LABEL
   Label → H1 = 18px
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-label {
  width: auto;

  margin: 0 0 18px !important;
  padding: 0 !important;

  align-self: flex-start;

  font-family: Inter, Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 2.2px;
  text-transform: uppercase;

  color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-label
  .elementor-widget-container {
  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-label
  .elementor-heading-title {
  margin: 0 !important;
  padding: 0 !important;

  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;

  color: inherit;
}


/* =========================================================
   09. H1 TITLE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-title {
  width: 100%;

  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-title
  .elementor-widget-container {
  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-title
  .elementor-heading-title {
  margin: 0 !important;
  padding: 0 !important;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 54px;
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -1px;

  color: #FFFFFF;

  text-wrap: balance;
}


/* =========================================================
   10. HERO GOLD DIVIDER
   Elementor Divider Widget
   40px × 6px
   H1 → Divider = 10px
   Divider → Description = 15px
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-divider {
  width: 40px !important;
  max-width: 40px !important;

  margin: 10px 0 15px !important;
  padding: 0 !important;

  align-self: flex-start;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-divider
  .elementor-widget-container {
  width: 40px !important;
  height: 6px !important;

  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-divider
  .elementor-divider {
  display: block !important;

  width: 40px !important;
  height: 6px !important;

  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-divider
  .elementor-divider-separator {
  display: block !important;

  width: 40px !important;
  max-width: 40px !important;
  height: 6px !important;
  min-height: 6px !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  background-color: #FFB304 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-divider
  .elementor-divider-separator::before,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-divider
  .elementor-divider-separator::after {
  content: none !important;
  display: none !important;
}


/* =========================================================
   11. DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-desc {
  width: 100%;
  max-width: 530px;

  margin: 0 !important;
  padding: 0 !important;

  font-family: Inter, Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.7;

  color: rgba(255, 255, 255, 0.92);
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-desc
  .elementor-widget-container {
  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-desc p {
  margin: 0 !important;
  padding: 0 !important;

  font: inherit;
  color: inherit;
}


/* =========================================================
   12. BUTTON GROUP
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-actions {
  width: auto;

  margin: 28px 0 0;
  padding: 0;

  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;

  gap: 14px;
}


/* =========================================================
   13. BUTTON WIDGET RESET
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-primary,
.elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-secondary {
  width: auto;

  margin: 0;
  padding: 0;
}


/* =========================================================
   14. PRIMARY BUTTON
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-primary
  .elementor-button {
  min-height: 48px;

  padding: 13px 24px;

  border: 1px solid #008C88;
  border-radius: 4px;

  background-color: #008C88;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;

  color: #FFFFFF;

  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-primary
  .elementor-button:hover,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-primary
  .elementor-button:focus-visible {
  border-color: #FFB304;
  background-color: #FFB304;

  color: #FFFFFF;

  transform: translateY(-2px);

  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.18);
}


/* =========================================================
   15. SECONDARY BUTTON
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button {
  min-height: 48px;

  padding: 13px 24px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: transparent;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;

  color: #FFFFFF;

  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:hover,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:focus-visible {
  border-color: #008C88;
  background-color: #008C88;

  color: #FFFFFF;

  transform: translateY(-2px);

  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.18);
}


/* =========================================================
   16. BUTTON CONTENT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-actions
  .elementor-button-content-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}


/* =========================================================
   17. PRIMARY BUTTON ICON
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-primary
  .elementor-button-icon {
  font-size: 18px;
  line-height: 1;
}


/* =========================================================
   18. WHATSAPP ICON
   Official green, 22px, unchanged on hover
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 22px !important;
  line-height: 1 !important;

  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button-icon i {
  font-size: 22px !important;
  line-height: 1 !important;

  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button-icon svg {
  display: block;

  width: 22px !important;
  height: 22px !important;

  color: #25D366 !important;
  fill: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:hover
  .elementor-button-icon,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:focus-visible
  .elementor-button-icon,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:hover
  .elementor-button-icon i,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:focus-visible
  .elementor-button-icon i {
  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:hover
  .elementor-button-icon svg,
.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-secondary
  .elementor-button:focus-visible
  .elementor-button-icon svg {
  color: #25D366 !important;
  fill: #25D366 !important;
}


/* =========================================================
   19. ACCESSIBILITY FOCUS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-5b804f5
  .dv-zigbee-relays-01-actions
  .elementor-button:focus-visible {
  outline: 3px solid rgba(255, 179, 4, 0.42);
  outline-offset: 3px;
}


/* =========================================================
   20. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-5b804f5 {
    padding: 0 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-inner {
    min-height: 540px;

    padding: 0;

    background-position: 61% center !important;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-inner::before {
    background:
      linear-gradient(
        90deg,
        rgba(5, 48, 47, 0.98) 0%,
        rgba(5, 48, 47, 0.94) 37%,
        rgba(7, 62, 60, 0.68) 65%,
        rgba(8, 70, 68, 0.16) 100%
      );
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb {
    padding: 26px 38px 0;

    font-size: 13px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-body {
    padding: 18px 38px 36px;

    align-items: center;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-content {
    width: 58%;
    max-width: 520px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-title
    .elementor-heading-title {
    font-size: 46px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-desc {
    font-size: 17px;
  }

}


/* =========================================================
   21. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-5b804f5 {
    padding: 0 20px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-inner {
    min-height: 620px;

    padding: 0;

    align-items: stretch;

    background-position: 74% center !important;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-inner::before {
    background:
      linear-gradient(
        0deg,
        rgba(5, 48, 47, 0.99) 0%,
        rgba(5, 48, 47, 0.94) 52%,
        rgba(5, 48, 47, 0.54) 75%,
        rgba(5, 48, 47, 0.12) 100%
      ),
      linear-gradient(
        90deg,
        rgba(5, 48, 47, 0.86) 0%,
        rgba(5, 48, 47, 0.36) 100%
      );
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb {
    padding: 22px 22px 0;

    font-size: 12px;
    line-height: 1.5;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-nav {
    align-items: flex-start;

    row-gap: 4px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb-separator {
    padding-right: 6px;
    padding-left: 6px;

    font-size: 14px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-body {
    padding: 18px 22px 44px;

    flex: 1 1 auto;
    align-items: flex-end;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-content {
    width: 100%;
    max-width: 100%;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-label {
    margin-bottom: 18px !important;

    font-size: 12px;
    letter-spacing: 1.8px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-title
    .elementor-heading-title {
    font-size: 38px;
    line-height: 1.12;
    letter-spacing: -0.5px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-desc {
    font-size: 16px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-actions {
    width: 100%;

    margin-top: 24px;

    gap: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-primary,
  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-secondary {
    width: 100%;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-primary
    .elementor-button,
  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-secondary
    .elementor-button {
    width: 100%;

    justify-content: center;
  }

}


/* =========================================================
   22. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-inner {
    min-height: 640px;

    padding: 0;

    background-position: 75% center !important;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-breadcrumb {
    padding: 20px 18px 0;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5 .dv-zigbee-relays-01-body {
    padding: 18px 18px 40px;
  }

  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-title
    .elementor-heading-title {
    font-size: 35px;
  }

}


/* =========================================================
   23. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-primary
    .elementor-button,
  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-secondary
    .elementor-button,
  .elementor-9701 .elementor-element.elementor-element-5b804f5
    .dv-zigbee-relays-01-breadcrumb-link {
    transition: none;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c1f1b98 *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 02 — PRODUCT RANGE
   ========================================================= */


/* =========================================================
   01. SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 40px 40px 30px;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98,
.elementor-9701 .elementor-element.elementor-element-c1f1b98 * {
  box-sizing: border-box;
}


/* =========================================================
   02. INNER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-inner {
  position: relative;

  width: 100%;
  max-width: 1200px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;

  box-sizing: border-box;
}


/* =========================================================
   03. STANDARD SECTION HEADING
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-header {
  width: 100%;
  max-width: 900px;

  margin: 0 auto 20px;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}


/* =========================================================
   04. EYEBROW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-eyebrow {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   05. H2
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-title {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.22;

  color: #008C88;

  text-wrap: balance;
}


/* =========================================================
   06. STANDARD GOLD DIVIDER
   35px line + 6px dot + 35px line
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-divider {
  width: 86px;
  height: 6px;

  margin: 10px auto 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-divider-line {
  display: block;

  width: 35px;
  min-width: 35px;
  height: 2px;

  background-color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-divider-dot {
  display: block;

  width: 6px;
  min-width: 6px;
  height: 6px;

  border-radius: 50%;

  background-color: #FFB304;
}


/* =========================================================
   07. DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-description {
  width: 100%;
  max-width: 900px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;

  color: #5F7378;
}


/* =========================================================
   08. PRODUCT RANGE GRID
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-grid {
  width: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 20px;
  align-items: stretch;
}


/* =========================================================
   09. PRODUCT RANGE CARD
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  border: 1px solid rgba(12, 80, 78, 0.13);
  border-radius: 8px;

  background-color: #FFFFFF;

  overflow: hidden;

  box-shadow:
    0 7px 22px rgba(12, 80, 78, 0.07);

  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}


/* 4px gold hover line */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card::before {
  content: "";

  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 3;

  width: 100%;
  height: 4px;

  background-color: #FFB304;

  transform: scaleX(0);
  transform-origin: left center;

  transition: transform 0.28s ease;

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card:hover,
.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card:focus-within {
  transform: translateY(-5px);

  border-color: rgba(255, 179, 4, 0.42);

  box-shadow:
    0 16px 34px rgba(12, 80, 78, 0.13);
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card:hover::before,
.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card:focus-within::before {
  transform: scaleX(1);
}


/* =========================================================
   10. CARD MEDIA AREA
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-media {
  position: relative;

  width: 100%;
  min-height: 215px;

  margin: 0;
  padding: 18px 20px 14px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-bottom: 1px solid rgba(12, 80, 78, 0.10);

  background-color: #FFFFFF;

  overflow: hidden;
}


/* subtle decorative ring */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-media::before {
  content: "";

  position: absolute;
  top: 50%;
  left: 50%;

  width: 185px;
  height: 185px;

  border: 1px solid rgba(0, 140, 136, 0.08);
  border-radius: 50%;

  transform: translate(-50%, -50%);

  pointer-events: none;
}


/* =========================================================
   11. PRODUCT IMAGE WIDGET
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-image {
  position: relative;
  z-index: 2;

  width: 100%;
  max-width: 100%;

  margin: 0;
  padding: 0;

  text-align: center;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-image
  .elementor-widget-container {
  width: 100%;

  display: flex;
  align-items: center;
  justify-content: center;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-image img {
  display: block;

  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 205px;

  margin: 0 auto;

  object-fit: contain;

  transition: transform 0.32s ease;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-card:hover
  .dv-zigbee-relays-02-image img {
  transform: scale(1.025);
}


/* PN6 + PN16II group image */

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-image-multi img {
  max-width: 94%;
  max-height: 205px;
}


/* MINI16A image */

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-image-mini img {
  max-width: 64%;
  max-height: 205px;
}


/* =========================================================
   12. CARD INFORMATION AREA
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-info {
  position: relative;

  width: 100%;
  height: 100%;

  margin: 0;
  padding: 22px 24px 22px;

  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;

  background-color: #0C504E;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;

  overflow: hidden;
}


/* dark overlay for readability */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-info::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 1;

  background:
    linear-gradient(
      180deg,
      rgba(12, 80, 78, 0.86) 0%,
      rgba(8, 58, 57, 0.90) 100%
    );

  pointer-events: none;
}


/* soft gold-green decoration */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-info::after {
  content: "";

  position: absolute;
  right: -30px;
  bottom: -30px;
  z-index: 1;

  width: 150px;
  height: 150px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(255, 179, 4, 0.16) 0%,
      rgba(255, 179, 4, 0.06) 40%,
      rgba(255, 179, 4, 0) 72%
    );

  pointer-events: none;
}


/* keep content above overlays */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-info > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   13. MODEL GROUP LABEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-model-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 10px;
  padding: 5px 10px;

  border: 1px solid rgba(255, 179, 4, 0.78);
  border-radius: 3px;

  background-color: rgba(255, 179, 4, 0.10);

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1px;
  text-transform: uppercase;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-model-label
  .elementor-widget-container,
.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-model-label
  .elementor-heading-title {
  margin: 0 !important;
  padding: 0 !important;

  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: inherit;
}


/* =========================================================
   14. CARD H3
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card-title {
  width: 100%;

  margin: 0 0 10px;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-card-title
  .elementor-widget-container {
  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-card-title
  .elementor-heading-title {
  min-height: 58px;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.22;

  color: #FFFFFF;
}


/* =========================================================
   15. CARD DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card-desc {
  width: 100%;

  margin: 0 0 14px;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-card-desc,
.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-card-desc p {
  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.65;

  color: rgba(255, 255, 255, 0.84);
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-card-desc
  .elementor-widget-container,
.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-card-desc p {
  margin: 0 !important;
  padding: 0 !important;
}


/* =========================================================
   16. ICON LIST
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-list {
  width: 100%;

  margin: 0;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-list
  .elementor-icon-list-items {
  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  gap: 9px;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-list
  .elementor-icon-list-item {
  margin: 0;
  padding: 0;

  display: flex;
  align-items: flex-start;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-list
  .elementor-icon-list-icon {
  width: 18px;
  min-width: 18px;

  margin: 2px 8px 0 0;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  color: #7FE0DB;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-list
  .elementor-icon-list-icon i {
  font-size: 14px;
  color: #7FE0DB;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-list
  .elementor-icon-list-icon svg {
  width: 14px;
  height: 14px;
  fill: #7FE0DB;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-list
  .elementor-icon-list-text {
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;

  color: rgba(255, 255, 255, 0.90);
}


/* =========================================================
   17. CARD BUTTON WIDGET
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-button {
  width: auto;

  margin: auto 0 0;
  padding: 22px 0 0;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-button
  .elementor-button {
  min-height: 48px;

  padding: 13px 22px;

  border: 1px solid #008C88;
  border-radius: 4px;

  background-color: #008C88;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;

  color: #FFFFFF;

  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-button
  .elementor-button:hover,
.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-button
  .elementor-button:focus-visible {
  border-color: #FFB304;
  background-color: #FFB304;

  color: #FFFFFF;

  transform: translateY(-2px);

  box-shadow:
    0 8px 18px rgba(12, 80, 78, 0.14);
}

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-button
  .elementor-button-icon {
  font-size: 17px;
}


/* =========================================================
   18. ACCESSIBILITY
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-c1f1b98
  .dv-zigbee-relays-02-button
  .elementor-button:focus-visible {
  outline: 3px solid rgba(255, 179, 4, 0.38);
  outline-offset: 3px;
}


/* =========================================================
   19. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 {
    padding: 40px 30px 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-grid {
    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-media {
    min-height: 220px;
    padding: 20px 18px 16px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-image img {
    max-height: 185px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-image-multi img {
    max-width: 98%;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-image-mini img {
    max-width: 72%;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-info {
    padding: 23px 20px 22px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-card-title
    .elementor-heading-title {
    min-height: 54px;

    font-size: 22px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-list
    .elementor-icon-list-text {
    font-size: 13.5px;
  }

}


/* =========================================================
   20. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 {
    padding: 36px 20px 28px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-header {
    margin-bottom: 20px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-title {
    font-size: 28px;
    line-height: 1.25;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-description {
    font-size: 15px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-grid {
    grid-template-columns: 1fr;

    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card {
    border-radius: 7px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-media {
    min-height: 230px;
    padding: 22px 20px 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-image img {
    max-height: 195px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-image-multi img {
    max-width: 94%;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-image-mini img {
    max-width: 58%;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-info {
    padding: 22px 20px 22px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-card-title
    .elementor-heading-title {
    min-height: 0;

    font-size: 23px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card-desc {
    margin-bottom: 17px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-button {
    width: 100%;

    padding-top: 21px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-button
    .elementor-button {
    width: 100%;

    justify-content: center;
  }

}


/* =========================================================
   21. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-eyebrow {
    padding: 6px 12px;

    font-size: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-media {
    min-height: 210px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-image img {
    max-height: 178px;
  }

  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-image-mini img {
    max-width: 64%;
  }

}


/* =========================================================
   22. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card,
  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-card::before,
  .elementor-9701 .elementor-element.elementor-element-c1f1b98 .dv-zigbee-relays-02-image img,
  .elementor-9701 .elementor-element.elementor-element-c1f1b98
    .dv-zigbee-relays-02-button
    .elementor-button {
    transition: none;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3cdf7ef *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 03 — FEATURED MODELS
   ========================================================= */


/* =========================================================
   01. SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 40px 40px 30px;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #F4FAF9;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef,
.elementor-9701 .elementor-element.elementor-element-3cdf7ef * {
  box-sizing: border-box;
}


/* =========================================================
   02. INNER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-inner {
  position: relative;

  width: 100%;
  max-width: 1200px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
}


/* =========================================================
   03. STANDARD SECTION HEADING
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-header {
  width: 100%;
  max-width: 900px;

  margin: 0 auto 20px;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}


/* =========================================================
   04. EYEBROW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-eyebrow {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   05. H2
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-title {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.22;

  color: #008C88;

  text-wrap: balance;
}


/* =========================================================
   06. STANDARD GOLD DIVIDER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-divider {
  width: 86px;
  height: 6px;

  margin: 10px auto 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-divider-line {
  display: block;

  width: 35px;
  min-width: 35px;
  height: 2px;

  background-color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-divider-dot {
  display: block;

  width: 6px;
  min-width: 6px;
  height: 6px;

  border-radius: 50%;

  background-color: #FFB304;
}


/* =========================================================
   07. HEADING DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-description {
  width: 100%;
  max-width: 900px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;

  color: #5F7378;
}


/* =========================================================
   08. PRODUCT GRID
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-grid {
  width: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 18px;
  align-items: stretch;
}


/* =========================================================
   09. PRODUCT CARD
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  border: 1px solid rgba(12, 80, 78, 0.14);
  border-radius: 8px;

  background-color: #FFFFFF;

  overflow: hidden;

  box-shadow:
    0 8px 24px rgba(12, 80, 78, 0.07);

  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}


/* Hover gold line */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card::before {
  content: "";

  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 5;

  width: 100%;
  height: 4px;

  background-color: #FFB304;

  transform: scaleX(0);
  transform-origin: left center;

  transition: transform 0.28s ease;

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card:hover,
.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card:focus-within {
  transform: translateY(-5px);

  border-color: rgba(255, 179, 4, 0.48);

  box-shadow:
    0 17px 36px rgba(12, 80, 78, 0.13);
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card:hover::before,
.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card:focus-within::before {
  transform: scaleX(1);
}


/* =========================================================
   10. MODEL BAR
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-model-bar {
  position: relative;
  z-index: 3;

  width: 100%;

  margin: 0;
  padding: 11px 18px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  background-color: #0C504E;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-model-code {
  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 1.2px;
  text-transform: uppercase;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-model-type {
  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.7px;
  text-transform: uppercase;

  color: #FFB304;
}


/* =========================================================
   11. IMAGE AREA
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-media {
  position: relative;

  width: 100%;
  min-height: 250px;

  margin: 0;
  padding: 22px 20px 18px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-bottom: 1px solid rgba(12, 80, 78, 0.10);

  background-color: #FFFFFF;

  overflow: hidden;
}


/* Background circle */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-media::before {
  content: "";

  position: absolute;
  top: 50%;
  left: 50%;

  width: 205px;
  height: 205px;

  border: 1px solid rgba(0, 140, 136, 0.09);
  border-radius: 50%;

  transform: translate(-50%, -50%);

  pointer-events: none;
}


/* Small lower platform */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-media::after {
  content: "";

  position: absolute;
  right: 20%;
  bottom: 27px;
  left: 20%;

  height: 16px;

  border-radius: 50%;

  background:
    radial-gradient(
      ellipse at center,
      rgba(12, 80, 78, 0.12) 0%,
      rgba(12, 80, 78, 0.04) 45%,
      rgba(12, 80, 78, 0) 75%
    );

  filter: blur(3px);

  pointer-events: none;
}


/* =========================================================
   12. PRODUCT IMAGE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-image {
  position: relative;
  z-index: 2;

  width: 100%;

  margin: 0;
  padding: 0;

  text-align: center;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-image
  .elementor-widget-container {
  width: 100%;

  display: flex;
  align-items: center;
  justify-content: center;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-image img {
  display: block;

  width: auto;
  max-width: 100%;
  height: auto;

  margin: 0 auto;

  object-fit: contain;

  transition: transform 0.32s ease;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-card:hover
  .dv-zigbee-relays-03-image img {
  transform: scale(1.03);
}


/* PN6 */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-image-pn6 img {
  max-width: 78%;
  max-height: 200px;
}


/* PN16II */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-image-pn16ii img {
  max-width: 97%;
  max-height: 185px;
}


/* MINI16A */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-image-mini16a img {
  max-width: 64%;
  max-height: 205px;
}


/* =========================================================
   13. CARD INFORMATION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-info {
  position: relative;

  width: 100%;
  height: 100%;

  margin: 0;
  padding: 23px 22px 22px;

  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;

  background-color: #FFFFFF;

  overflow: hidden;
}


/* Decorative bottom-right block */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-info::after {
  content: "";

  position: absolute;
  right: -42px;
  bottom: -42px;

  width: 120px;
  height: 120px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0, 140, 136, 0.08) 0%,
      rgba(0, 140, 136, 0.025) 48%,
      rgba(0, 140, 136, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-info > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   14. CARD TITLE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card-title {
  width: 100%;

  margin: 0 0 9px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 23px;
  font-weight: 600;
  line-height: 1.24;

  color: #0C504E;
}


/* =========================================================
   15. CARD DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card-desc {
  width: 100%;
  min-height: 76px;

  margin: 0 0 16px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14.5px;
  font-weight: 400;
  line-height: 1.65;

  color: #5F7378;
}


/* =========================================================
   16. FEATURE TAGS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-tags {
  width: 100%;

  margin: 0 0 16px;
  padding: 0;

  display: flex;
  flex-wrap: wrap;

  gap: 7px;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-tag {
  width: auto;

  margin: 0;
  padding: 6px 9px;

  border: 1px solid rgba(0, 140, 136, 0.20);
  border-radius: 3px;

  background-color: #F4FAF9;

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;

  color: #0C504E;
}


/* =========================================================
   17. FEATURE LIST PANEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-features {
  width: 100%;

  margin: 0;
  padding: 14px 14px;

  border-left: 3px solid #008C88;
  border-radius: 0 4px 4px 0;

  background-color: #F4FAF9;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-feature-list {
  width: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  gap: 8px;

  list-style: none;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-feature-list li {
  position: relative;

  margin: 0;
  padding: 0 0 0 22px;

  font-family: Inter, Arial, sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #41545B;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-feature-list li::before {
  content: "✓";

  position: absolute;
  top: 0;
  left: 0;

  width: 16px;
  height: 16px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;

  color: #008C88;
}


/* =========================================================
   18. CARD BUTTON
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-button {
  width: auto;

  margin: auto 0 0;
  padding: 20px 0 0;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-button
  .elementor-button {
  min-height: 48px;

  padding: 13px 21px;

  border: 1px solid #008C88;
  border-radius: 4px;

  background-color: #008C88;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;

  color: #FFFFFF;

  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-button
  .elementor-button:hover,
.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-button
  .elementor-button:focus-visible {
  border-color: #FFB304;
  background-color: #FFB304;

  color: #FFFFFF;

  transform: translateY(-2px);

  box-shadow:
    0 8px 18px rgba(12, 80, 78, 0.15);
}

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-button
  .elementor-button-icon {
  font-size: 17px;
}


/* =========================================================
   19. FOCUS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-3cdf7ef
  .dv-zigbee-relays-03-button
  .elementor-button:focus-visible {
  outline: 3px solid rgba(255, 179, 4, 0.38);
  outline-offset: 3px;
}


/* =========================================================
   20. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef {
    padding: 40px 30px 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card:last-child {
    width: calc(50% - 9px);

    grid-column: 1 / -1;
    justify-self: center;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-media {
    min-height: 235px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-image-pn6 img {
    max-height: 190px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-image-pn16ii img {
    max-height: 175px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-image-mini16a img {
    max-height: 195px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card-desc {
    min-height: 72px;
  }

}


/* =========================================================
   21. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef {
    padding: 36px 20px 28px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-title {
    font-size: 28px;
    line-height: 1.25;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-description {
    font-size: 15px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-grid {
    grid-template-columns: 1fr;

    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card:last-child {
    width: 100%;

    grid-column: auto;
    justify-self: stretch;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-media {
    min-height: 230px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-info {
    padding: 22px 20px 22px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card-title {
    font-size: 23px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card-desc {
    min-height: 0;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-button {
    width: 100%;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-button
    .elementor-button {
    width: 100%;

    justify-content: center;
  }

}


/* =========================================================
   22. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-eyebrow {
    padding: 6px 12px;

    font-size: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-model-bar {
    padding-right: 14px;
    padding-left: 14px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-media {
    min-height: 215px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-image-pn6 img {
    max-width: 82%;
    max-height: 175px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-image-pn16ii img {
    max-width: 100%;
    max-height: 160px;
  }

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-image-mini16a img {
    max-width: 66%;
    max-height: 180px;
  }

}


/* =========================================================
   23. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card,
  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-card::before,
  .elementor-9701 .elementor-element.elementor-element-3cdf7ef .dv-zigbee-relays-03-image img,
  .elementor-9701 .elementor-element.elementor-element-3cdf7ef
    .dv-zigbee-relays-03-button
    .elementor-button {
    transition: none;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-bfdb9e1 *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 04 — RELAY & CONTROL FUNCTIONS
   ========================================================= */


/* =========================================================
   01. SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 40px 40px 30px;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1,
.elementor-9701 .elementor-element.elementor-element-bfdb9e1 * {
  box-sizing: border-box;
}


/* =========================================================
   02. INNER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-inner {
  position: relative;

  width: 100%;
  max-width: 1200px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
}


/* =========================================================
   03. STANDARD SECTION HEADING
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-header {
  width: 100%;
  max-width: 900px;

  margin: 0 auto 20px;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}


/* =========================================================
   04. EYEBROW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-eyebrow {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   05. H2
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-title {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.22;

  color: #008C88;

  text-wrap: balance;
}


/* =========================================================
   06. STANDARD GOLD DIVIDER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-divider {
  width: 86px;
  height: 6px;

  margin: 10px auto 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-divider-line {
  display: block;

  width: 35px;
  min-width: 35px;
  height: 2px;

  background-color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-divider-dot {
  display: block;

  width: 6px;
  min-width: 6px;
  height: 6px;

  border-radius: 50%;

  background-color: #FFB304;
}


/* =========================================================
   07. HEADING DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-description {
  width: 100%;
  max-width: 900px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;

  color: #5F7378;
}


/* =========================================================
   08. MAIN CONTENT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-content {
  width: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns:
    minmax(0, 0.88fr)
    minmax(0, 1.12fr);

  gap: 20px;
  align-items: stretch;
}


/* =========================================================
   09. LEFT CONTROL PATH PANEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-panel {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 30px 28px 28px;

  display: flex;
  flex-direction: column;
  align-items: flex-start;

  border-radius: 8px;

  background-color: #0C504E;

  overflow: hidden;

  box-shadow:
    0 12px 30px rgba(12, 80, 78, 0.15);
}


/* Decorative background glow */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-panel::before {
  content: "";

  position: absolute;
  top: -80px;
  right: -70px;

  width: 280px;
  height: 280px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0, 140, 136, 0.52) 0%,
      rgba(0, 140, 136, 0.18) 46%,
      rgba(0, 140, 136, 0) 72%
    );

  pointer-events: none;
}


/* Fine line pattern */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-panel::after {
  content: "";

  position: absolute;
  inset: 0;

  opacity: 0.10;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    );

  background-size: 38px 38px;

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-panel > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   10. LEFT PANEL LABEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 6px 11px;

  border: 1px solid rgba(255, 179, 4, 0.82);
  border-radius: 4px;

  background-color: rgba(255, 179, 4, 0.08);

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1.2px;
  text-transform: uppercase;

  color: #FFB304;
}


/* =========================================================
   11. LEFT PANEL TITLE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-title {
  width: 100%;
  max-width: 430px;

  margin: 0 0 12px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.2;

  color: #FFFFFF;
}


/* =========================================================
   12. LEFT PANEL DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-desc {
  width: 100%;
  max-width: 440px;

  margin: 0 0 24px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14.5px;
  font-weight: 400;
  line-height: 1.7;

  color: rgba(255, 255, 255, 0.82);
}


/* =========================================================
   13. CONTROL FLOW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow {
  width: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;
}


/* Individual step */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow-step {
  position: relative;

  width: 100%;

  margin: 0;
  padding: 0 0 19px;

  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);

  gap: 13px;
  align-items: start;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1
  .dv-zigbee-relays-04-flow-step:last-child {
  padding-bottom: 0;
}


/* Vertical connecting line */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1
  .dv-zigbee-relays-04-flow-step:not(:last-child)::after {
  content: "";

  position: absolute;
  top: 39px;
  bottom: 4px;
  left: 21px;

  width: 2px;

  background-color: rgba(255, 179, 4, 0.42);
}


/* Step number */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow-number {
  position: relative;
  z-index: 2;

  width: 44px;
  height: 44px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255, 179, 4, 0.68);
  border-radius: 50%;

  background-color: rgba(5, 48, 47, 0.88);

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;

  color: #FFB304;
}


/* Step content */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow-copy {
  width: 100%;

  margin: 0;
  padding: 2px 0 0;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow-title {
  width: 100%;

  margin: 0 0 4px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow-text {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.55;

  color: rgba(255, 255, 255, 0.74);
}


/* =========================================================
   14. LEFT PANEL NOTE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-note {
  width: 100%;

  margin: auto 0 0;
  padding: 18px 0 0;

  border-top: 1px solid rgba(255, 179, 4, 0.36);
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-note p {
  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.6;

  color: rgba(255, 255, 255, 0.80);
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-note strong {
  font-weight: 700;
  color: #FFB304;
}

/* =========================================================
   15. RIGHT GRID WRAPPER
   Elementor outer container
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-grid-wrap {
  position: relative;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100%;

  margin: 0 !important;
  padding: 0 !important;

  display: block !important;
  align-self: stretch;

  overflow: visible;
}


/* Force the HTML widget to fill the complete right column */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1
  .dv-zigbee-relays-04-grid-wrap
  > .elementor-element,
.elementor-9701 .elementor-element.elementor-element-bfdb9e1
  .dv-zigbee-relays-04-grid-wrap
  > .elementor-widget-html {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1
  .dv-zigbee-relays-04-grid-wrap
  .elementor-widget-container {
  width: 100% !important;
  max-width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-grid {
  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 16px;
  align-items: stretch;
}


/* =========================================================
   16. FUNCTION CARD
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 22px 20px 20px;

  border: 1px solid rgba(12, 80, 78, 0.13);
  border-radius: 7px;

  background-color: #F8FCFB;

  overflow: hidden;

  box-shadow:
    0 7px 20px rgba(12, 80, 78, 0.06);

  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    background-color 0.28s ease,
    box-shadow 0.28s ease;
}


/* Hover top gold line */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card::before {
  content: "";

  position: absolute;
  top: 0;
  right: 0;
  left: 0;

  width: 100%;
  height: 4px;

  background-color: #FFB304;

  transform: scaleX(0);
  transform-origin: left center;

  transition: transform 0.28s ease;

  pointer-events: none;
}


/* Decorative lower corner */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card::after {
  content: "";

  position: absolute;
  right: -44px;
  bottom: -44px;

  width: 120px;
  height: 120px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0, 140, 136, 0.09) 0%,
      rgba(0, 140, 136, 0.025) 48%,
      rgba(0, 140, 136, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card:hover {
  transform: translateY(-5px);

  border-color: rgba(255, 179, 4, 0.46);
  background-color: #FFFFFF;

  box-shadow:
    0 15px 30px rgba(12, 80, 78, 0.12);
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card:hover::before {
  transform: scaleX(1);
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   17. CARD TOP AREA
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-top {
  width: 100%;

  margin: 0 0 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 12px;
}


/* Text-based function icon */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-icon {
  width: 52px;
  min-width: 52px;
  height: 52px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(0, 140, 136, 0.18);
  border-radius: 6px;

  background-color: #EAF6F4;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.2px;

  color: #008C88;
}


/* Model or role label */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-label {
  width: auto;

  margin: 0;
  padding: 5px 8px;

  border: 1px solid rgba(255, 179, 4, 0.58);
  border-radius: 3px;

  background-color: rgba(255, 179, 4, 0.06);

  font-family: Inter, Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.8px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   18. CARD H3
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-title {
  width: 100%;

  margin: 0 0 8px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 21px;
  font-weight: 600;
  line-height: 1.25;

  color: #0C504E;
}


/* =========================================================
   19. CARD DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-desc {
  width: 100%;
  min-height: 70px;

  margin: 0 0 14px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.62;

  color: #5F7378;
}


/* =========================================================
   20. CARD LIST
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-list {
  width: 100%;

  margin: 0;
  padding: 13px 0 0;

  border-top: 1px solid rgba(12, 80, 78, 0.10);

  display: flex;
  flex-direction: column;

  gap: 7px;

  list-style: none;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-list li {
  position: relative;

  margin: 0;
  padding: 0 0 0 19px;

  font-family: Inter, Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.48;

  color: #41545B;
}

.elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-list li::before {
  content: "";

  position: absolute;
  top: 7px;
  left: 0;

  width: 7px;
  height: 7px;

  border-radius: 50%;

  background-color: #008C88;
}


/* =========================================================
   21. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 {
    padding: 40px 30px 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-content {
    grid-template-columns: 1fr;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-panel {
    min-height: 0;
    padding: 28px 26px 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 24px;
    row-gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow-step {
    padding-bottom: 0;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1
    .dv-zigbee-relays-04-flow-step::after {
    display: none;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-note {
    margin-top: 24px;
  }

}


/* =========================================================
   22. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 {
    padding: 36px 20px 28px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-title {
    font-size: 28px;
    line-height: 1.25;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-description {
    font-size: 15px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-content {
    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-panel {
    padding: 25px 20px 24px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow {
    display: flex;
    flex-direction: column;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-flow-step {
    padding-bottom: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1
    .dv-zigbee-relays-04-flow-step:not(:last-child)::after {
    display: block;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-grid {
    grid-template-columns: 1fr;

    gap: 16px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card-desc {
    min-height: 0;
  }

}


/* =========================================================
   23. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-eyebrow {
    padding: 6px 12px;

    font-size: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-path-panel {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card {
    padding-right: 18px;
    padding-left: 18px;
  }

}


/* =========================================================
   24. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card,
  .elementor-9701 .elementor-element.elementor-element-bfdb9e1 .dv-zigbee-relays-04-card::before {
    transition: none;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-426fe0d *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 05 — MODEL COMPARISON
   ========================================================= */


/* =========================================================
   01. SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 40px 40px 30px;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #F4FAF9;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d,
.elementor-9701 .elementor-element.elementor-element-426fe0d * {
  box-sizing: border-box;
}


/* =========================================================
   02. INNER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-inner {
  position: relative;

  width: 100%;
  max-width: 1200px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
}


/* =========================================================
   03. STANDARD SECTION HEADING
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-header {
  width: 100%;
  max-width: 900px;

  margin: 0 auto 20px;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}


/* =========================================================
   04. EYEBROW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-eyebrow {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   05. H2
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-title {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.22;

  color: #008C88;

  text-wrap: balance;
}


/* =========================================================
   06. STANDARD GOLD DIVIDER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-divider {
  width: 86px;
  height: 6px;

  margin: 10px auto 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-divider-line {
  display: block;

  width: 35px;
  min-width: 35px;
  height: 2px;

  background-color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-divider-dot {
  display: block;

  width: 6px;
  min-width: 6px;
  height: 6px;

  border-radius: 50%;

  background-color: #FFB304;
}


/* =========================================================
   07. HEADING DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-description {
  width: 100%;
  max-width: 900px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;

  color: #5F7378;
}


/* =========================================================
   08. MOBILE SCROLL HINT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-scroll-hint {
  display: none;

  width: 100%;

  margin: 0 0 8px;
  padding: 7px 10px;

  border: 1px solid rgba(0, 140, 136, 0.16);
  border-radius: 4px;

  background-color: rgba(255, 255, 255, 0.72);

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;

  color: #0C504E;

  text-align: center;
}


/* =========================================================
   09. TABLE OUTER CARD
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table-card {
  position: relative;

  width: 100%;

  margin: 0;
  padding: 0;

  border: 1px solid rgba(12, 80, 78, 0.14);
  border-radius: 8px;

  background-color: #FFFFFF;

  overflow: hidden;

  box-shadow:
    0 10px 28px rgba(12, 80, 78, 0.08);
}


/* top gold accent */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table-card::before {
  content: "";

  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 5;

  width: 100%;
  height: 4px;

  background-color: #FFB304;

  pointer-events: none;
}


/* =========================================================
   10. TABLE SCROLL WRAPPER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table-wrap {
  width: 100%;

  margin: 0;
  padding: 0;

  overflow-x: auto;
  overflow-y: hidden;

  scrollbar-width: thin;
  scrollbar-color: #008C88 #EAF4F2;

  -webkit-overflow-scrolling: touch;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table-wrap::-webkit-scrollbar {
  height: 8px;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table-wrap::-webkit-scrollbar-track {
  background-color: #EAF4F2;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table-wrap::-webkit-scrollbar-thumb {
  border-radius: 8px;

  background-color: #008C88;
}


/* =========================================================
   11. COMPARISON TABLE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table {
  width: 100%;
  min-width: 1040px;

  margin: 0;
  padding: 0;

  border: 0;
  border-collapse: separate;
  border-spacing: 0;

  table-layout: fixed;

  background-color: #FFFFFF;
}


/* =========================================================
   12. TABLE COLUMN WIDTHS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table col:first-child {
  width: 190px;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table col:not(:first-child) {
  width: 283px;
}


/* =========================================================
   13. TABLE HEADER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table thead th {
  position: relative;

  margin: 0;
  padding: 21px 18px 18px;

  border: 0;
  border-right: 1px solid rgba(255, 255, 255, 0.13);
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);

  background-color: #0C504E;

  font-family: Inter, Arial, sans-serif;

  color: #FFFFFF;

  text-align: left;
  vertical-align: top;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  thead th:last-child {
  border-right: 0;
}


/* sticky first header */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 8;

  background-color: #083F3D;
}


/* =========================================================
   14. HEADER MODEL CONTENT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-model-code {
  display: block;

  width: max-content;
  max-width: 100%;

  margin: 0 0 7px;
  padding: 5px 9px;

  border: 1px solid rgba(255, 179, 4, 0.76);
  border-radius: 3px;

  background-color: rgba(255, 179, 4, 0.08);

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1px;

  color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-model-name {
  display: block;

  margin: 0 0 4px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-model-role {
  display: block;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;

  color: rgba(255, 255, 255, 0.72);
}


/* first header text */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-feature-heading {
  display: block;

  margin: 8px 0 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;

  color: #FFFFFF;
}


/* =========================================================
   15. GROUP ROWS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table .dv-zigbee-relays-05-group th {
  position: relative;

  margin: 0;
  padding: 11px 18px;

  border: 0;
  border-bottom: 1px solid rgba(12, 80, 78, 0.14);

  background-color: #DDEEEB;

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 1.2px;
  text-transform: uppercase;

  color: #0C504E;

  text-align: left;
}


/* =========================================================
   16. TABLE CELLS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table tbody th,
.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table tbody td {
  margin: 0;
  padding: 13px 18px;

  border: 0;
  border-right: 1px solid rgba(12, 80, 78, 0.09);
  border-bottom: 1px solid rgba(12, 80, 78, 0.09);

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 13.5px;
  line-height: 1.52;

  color: #41545B;

  text-align: left;
  vertical-align: middle;

  overflow-wrap: anywhere;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  tbody td:last-child {
  border-right: 0;
}


/* sticky feature column */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  tbody tr:not(.dv-zigbee-relays-05-group)
  th {
  position: sticky;
  left: 0;
  z-index: 4;

  background-color: #F4FAF9;

  font-weight: 700;

  color: #0C504E;
}


/* =========================================================
   17. ALTERNATE ROWS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  tbody tr:not(.dv-zigbee-relays-05-group):nth-child(even)
  td {
  background-color: #FAFCFC;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  tbody tr:not(.dv-zigbee-relays-05-group):nth-child(even)
  th {
  background-color: #EDF7F5;
}


/* =========================================================
   18. ROW HOVER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  tbody tr:not(.dv-zigbee-relays-05-group) {
  transition: background-color 0.22s ease;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  tbody tr:not(.dv-zigbee-relays-05-group):hover
  td {
  background-color: rgba(0, 140, 136, 0.09);

  color: #263B40;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-table
  tbody tr:not(.dv-zigbee-relays-05-group):hover
  th {
  background-color: #008C88;

  color: #FFFFFF;
}


/* =========================================================
   19. STATUS BADGES
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: auto;
  max-width: 100%;

  margin: 0;
  padding: 5px 8px;

  border-radius: 3px;

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-badge-confirmed {
  border: 1px solid rgba(0, 140, 136, 0.25);

  background-color: #E8F6F4;

  color: #007B77;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-badge-required {
  border: 1px solid rgba(255, 179, 4, 0.48);

  background-color: rgba(255, 179, 4, 0.10);

  color: #765300;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-badge-pending {
  border: 1px solid rgba(95, 115, 120, 0.22);

  background-color: #F1F4F4;

  color: #5F7378;
}


/* =========================================================
   20. CHECK AND DASH
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-check {
  display: inline-flex;
  align-items: center;

  gap: 7px;

  font-weight: 600;

  color: #0C504E;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-check::before {
  content: "✓";

  width: 17px;
  height: 17px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background-color: #E4F5F2;

  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;

  color: #008C88;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-dash {
  color: #8A999D;
}


/* =========================================================
   21. TABLE NOTE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table-note {
  width: 100%;

  margin: 0;
  padding: 14px 18px;

  border-top: 1px solid rgba(12, 80, 78, 0.10);

  background-color: #FAFCFC;

  font-family: Inter, Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.6;

  color: #5F7378;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table-note strong {
  font-weight: 700;

  color: #0C504E;
}


/* =========================================================
   22. SUPPORT BAR
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support {
  position: relative;

  width: 100%;

  margin: 20px 0 0;
  padding: 20px 22px;

  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;

  gap: 28px;

  border: 1px solid rgba(255, 179, 4, 0.30);
  border-left: 4px solid #FFB304;
  border-radius: 6px;

  background:
    linear-gradient(
      135deg,
      #0C504E 0%,
      #083F3D 100%
    );

  overflow: hidden;

  box-shadow:
    0 10px 26px rgba(12, 80, 78, 0.15);
}


/* subtle background pattern */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 0;

  opacity: 0.08;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    );

  background-size: 34px 34px;

  pointer-events: none;
}


/* soft gold decoration */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support::after {
  content: "";

  position: absolute;
  top: 50%;
  right: 150px;
  z-index: 0;

  width: 200px;
  height: 200px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(255, 179, 4, 0.15) 0%,
      rgba(255, 179, 4, 0.04) 45%,
      rgba(255, 179, 4, 0) 72%
    );

  transform: translateY(-50%);

  pointer-events: none;
}


/* Elementor child width reset */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support
  > .elementor-element {
  position: relative;
  z-index: 2;

  min-width: 0;
}


/* =========================================================
   23. SUPPORT COPY
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-copy {
  position: relative;
  z-index: 2;

  width: auto !important;
  max-width: 790px;
  min-width: 0;

  margin: 0 !important;
  padding: 0 !important;

  flex: 1 1 auto !important;
}


/* ensure the HTML widget occupies available space */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support
  > .elementor-widget-html {
  width: auto !important;
  max-width: none !important;
  min-width: 0;

  flex: 1 1 auto !important;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support
  > .elementor-widget-html
  > .elementor-widget-container {
  width: 100%;

  margin: 0 !important;
  padding: 0 !important;
}


/* support label */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 7px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1.3px;
  text-transform: uppercase;

  color: #FFB304;
}


/* support title */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-title {
  width: 100%;

  margin: 0 0 5px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.28;

  color: #FFFFFF;
}


/* support description */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-text {
  width: 100%;
  max-width: 790px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.6;

  color: rgba(255, 255, 255, 0.82);
}


/* =========================================================
   24. WHATSAPP SUPPORT BUTTON
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-button {
  position: relative;
  z-index: 2;

  width: auto !important;
  min-width: max-content;

  margin: 0 0 0 auto !important;
  padding: 0 !important;

  flex: 0 0 auto !important;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button {
  min-height: 48px;

  padding: 12px 22px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: transparent;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;

  color: #FFFFFF;

  white-space: nowrap;

  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:hover,
.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:focus-visible {
  border-color: #FFB304;
  background-color: #FFB304;

  color: #FFFFFF;

  transform: translateY(-2px);

  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.18);
}


/* WhatsApp icon */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 22px !important;
  line-height: 1 !important;

  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button-icon i {
  font-size: 22px !important;
  line-height: 1 !important;

  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button-icon svg {
  display: block;

  width: 22px !important;
  height: 22px !important;

  color: #25D366 !important;
  fill: #25D366 !important;
}


/* keep WhatsApp green on hover */

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:hover
  .elementor-button-icon,
.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:focus-visible
  .elementor-button-icon,
.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:hover
  .elementor-button-icon i,
.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:focus-visible
  .elementor-button-icon i {
  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:hover
  .elementor-button-icon svg,
.elementor-9701 .elementor-element.elementor-element-426fe0d
  .dv-zigbee-relays-05-support-button
  .elementor-button:focus-visible
  .elementor-button-icon svg {
  color: #25D366 !important;
  fill: #25D366 !important;
}


/* =========================================================
   MOBILE SUPPORT BAR
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support {
    padding: 19px 18px;

    flex-direction: column !important;
    align-items: stretch !important;

    gap: 16px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d
    .dv-zigbee-relays-05-support
    > .elementor-widget-html {
    width: 100% !important;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-title {
    font-size: 21px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-button {
    width: 100% !important;

    margin: 0 !important;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d
    .dv-zigbee-relays-05-support-button
    .elementor-button {
    width: 100%;

    justify-content: center;
  }

}


/* =========================================================
   25. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-426fe0d {
    padding: 40px 30px 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table {
    min-width: 980px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table col:first-child {
    width: 180px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table col:not(:first-child) {
    width: 266px;
  }

}


/* =========================================================
   26. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-426fe0d {
    padding: 36px 20px 28px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-title {
    font-size: 28px;
    line-height: 1.25;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-description {
    font-size: 15px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-scroll-hint {
    display: block;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table {
    min-width: 920px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table col:first-child {
    width: 170px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table col:not(:first-child) {
    width: 250px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table thead th {
    padding: 18px 15px 16px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table tbody th,
  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-table tbody td {
    padding: 12px 15px;

    font-size: 13px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support {
    padding: 18px;

    flex-direction: column;
    align-items: stretch;

    gap: 15px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-support-button {
    width: 100%;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d
    .dv-zigbee-relays-05-support-button
    .elementor-button {
    width: 100%;

    justify-content: center;
  }

}


/* =========================================================
   27. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-426fe0d {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-eyebrow {
    padding: 6px 12px;

    font-size: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-426fe0d .dv-zigbee-relays-05-title {
    font-size: 27px;
  }

}


/* =========================================================
   28. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-426fe0d
    .dv-zigbee-relays-05-table
    tbody tr,
  .elementor-9701 .elementor-element.elementor-element-426fe0d
    .dv-zigbee-relays-05-support-button
    .elementor-button {
    transition: none;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-12a8577 *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 06 — INSTALLATION & INPUTS
   ========================================================= */


/* =========================================================
   01. SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 40px 40px 30px;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-12a8577,
.elementor-9701 .elementor-element.elementor-element-12a8577 * {
  box-sizing: border-box;
}


/* =========================================================
   02. INNER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-inner {
  position: relative;

  width: 100%;
  max-width: 1200px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
}


/* =========================================================
   03. STANDARD SECTION HEADING
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-header {
  width: 100%;
  max-width: 900px;

  margin: 0 auto 20px;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}


/* =========================================================
   04. EYEBROW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-eyebrow {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   05. H2
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-title {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.22;

  color: #008C88;

  text-wrap: balance;
}


/* =========================================================
   06. STANDARD GOLD DIVIDER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-divider {
  width: 86px;
  height: 6px;

  margin: 10px auto 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-divider-line {
  display: block;

  width: 35px;
  min-width: 35px;
  height: 2px;

  background-color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-divider-dot {
  display: block;

  width: 6px;
  min-width: 6px;
  height: 6px;

  border-radius: 50%;

  background-color: #FFB304;
}


/* =========================================================
   07. HEADING DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-description {
  width: 100%;
  max-width: 900px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;

  color: #5F7378;
}


/* =========================================================
   08. MAIN LAYOUT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-layout {
  width: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns:
    minmax(0, 1.85fr)
    minmax(330px, 1fr);

  gap: 20px;
  align-items: stretch;
}


/* Elementor width reset */

.elementor-9701 .elementor-element.elementor-element-12a8577
  .dv-zigbee-relays-06-layout
  > .elementor-element {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}


/* =========================================================
   09. INSTALLATION CARD GRID
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-grid {
  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 18px;
  align-items: stretch;
}


/* =========================================================
   10. INSTALLATION CARD
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  border: 1px solid rgba(12, 80, 78, 0.14);
  border-radius: 8px;

  background-color: #FFFFFF;

  overflow: hidden;

  box-shadow:
    0 9px 25px rgba(12, 80, 78, 0.07);

  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}


/* Hover gold line */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card::before {
  content: "";

  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 5;

  width: 100%;
  height: 4px;

  background-color: #FFB304;

  transform: scaleX(0);
  transform-origin: left center;

  transition: transform 0.28s ease;

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card:hover,
.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card:focus-within {
  transform: translateY(-5px);

  border-color: rgba(255, 179, 4, 0.46);

  box-shadow:
    0 16px 34px rgba(12, 80, 78, 0.13);
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card:hover::before,
.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card:focus-within::before {
  transform: scaleX(1);
}


/* =========================================================
   11. INSTALLATION MEDIA
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-media {
  position: relative;

  width: 100%;
  min-height: 215px;

  margin: 0;
  padding: 20px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-bottom: 1px solid rgba(12, 80, 78, 0.10);

  background-color: #FFFFFF;

  overflow: hidden;
}


/* Technical circle */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-media::before {
  content: "";

  position: absolute;
  top: 50%;
  left: 50%;

  width: 180px;
  height: 180px;

  border: 1px solid rgba(0, 140, 136, 0.09);
  border-radius: 50%;

  transform: translate(-50%, -50%);

  pointer-events: none;
}


/* grounding shadow */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-media::after {
  content: "";

  position: absolute;
  right: 20%;
  bottom: 24px;
  left: 20%;

  height: 15px;

  border-radius: 50%;

  background:
    radial-gradient(
      ellipse at center,
      rgba(12, 80, 78, 0.12) 0%,
      rgba(12, 80, 78, 0.03) 48%,
      rgba(12, 80, 78, 0) 75%
    );

  filter: blur(3px);

  pointer-events: none;
}


/* =========================================================
   12. PRODUCT IMAGE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-image {
  position: relative;
  z-index: 2;

  width: 100%;

  margin: 0;
  padding: 0;

  text-align: center;
}

.elementor-9701 .elementor-element.elementor-element-12a8577
  .dv-zigbee-relays-06-image
  .elementor-widget-container {
  width: 100%;

  display: flex;
  align-items: center;
  justify-content: center;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-image img {
  display: block;

  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 175px;

  margin: 0 auto;

  object-fit: contain;

  transition: transform 0.32s ease;
}

.elementor-9701 .elementor-element.elementor-element-12a8577
  .dv-zigbee-relays-06-install-card:hover
  .dv-zigbee-relays-06-image img {
  transform: scale(1.025);
}


/* DIN rail group image */

.elementor-9701 .elementor-element.elementor-element-12a8577
  .dv-zigbee-relays-06-image-din img {
  max-width: 96%;
  max-height: 170px;
}


/* MINI16A image */

.elementor-9701 .elementor-element.elementor-element-12a8577
  .dv-zigbee-relays-06-image-mini img {
  max-width: 62%;
  max-height: 178px;
}


/* =========================================================
   13. INSTALLATION INFO
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-info {
  position: relative;

  width: 100%;
  height: 100%;

  margin: 0;
  padding: 22px 21px 21px;

  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;

  background:
    linear-gradient(
      180deg,
      #F8FCFB 0%,
      #F1F8F7 100%
    );

  overflow: hidden;
}


/* Corner decoration */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-info::after {
  content: "";

  position: absolute;
  right: -40px;
  bottom: -40px;

  width: 120px;
  height: 120px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0, 140, 136, 0.10) 0%,
      rgba(0, 140, 136, 0.03) 47%,
      rgba(0, 140, 136, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-info > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   14. INSTALLATION LABEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 10px;
  padding: 5px 9px;

  border: 1px solid rgba(255, 179, 4, 0.70);
  border-radius: 3px;

  background-color: rgba(255, 179, 4, 0.07);

  font-family: Inter, Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.9px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   15. INSTALLATION TITLE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-title {
  width: 100%;

  margin: 0 0 9px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 23px;
  font-weight: 600;
  line-height: 1.24;

  color: #0C504E;
}


/* =========================================================
   16. INSTALLATION DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-desc {
  width: 100%;
  min-height: 70px;

  margin: 0 0 16px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.62;

  color: #5F7378;
}


/* =========================================================
   17. INSTALLATION DETAIL BLOCKS
   Additional confirmed selection information
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-detail-block {
  width: 100%;

  margin: 0 0 14px;
  padding: 13px 14px;

  border: 1px solid rgba(12, 80, 78, 0.11);
  border-left: 3px solid #008C88;
  border-radius: 0 4px 4px 0;

  background-color: rgba(255, 255, 255, 0.66);
}


/* Detail block title */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-detail-title {
  width: 100%;

  margin: 0 0 8px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0.7px;
  text-transform: uppercase;

  color: #0C504E;
}


/* Detail list */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-detail-list {
  width: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  gap: 7px;

  list-style: none;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-detail-list li {
  position: relative;

  margin: 0;
  padding: 0 0 0 19px;

  font-family: Inter, Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.5;

  color: #41545B;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-detail-list li::before {
  content: "";

  position: absolute;
  top: 6px;
  left: 0;

  width: 7px;
  height: 7px;

  border-radius: 50%;

  background-color: #008C88;
}


/* =========================================================
   PROJECT FIT STRIP
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-project-fit {
  width: 100%;

  margin: 0 0 14px;
  padding: 11px 13px;

  display: grid;
  grid-template-columns: auto minmax(0, 1fr);

  gap: 9px;
  align-items: start;

  border-radius: 4px;

  background-color: rgba(12, 80, 78, 0.07);
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-project-fit-label {
  margin: 0;
  padding: 2px 7px;

  border: 1px solid rgba(255, 179, 4, 0.58);
  border-radius: 3px;

  background-color: rgba(255, 179, 4, 0.09);

  font-family: Inter, Arial, sans-serif;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0.7px;
  text-transform: uppercase;

  color: #0C504E;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-project-fit-text {
  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.5;

  color: #41545B;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-specs {
  width: 100%;

  margin: auto 0 0;
  padding: 14px 0 0;

  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 8px;

  border-top: 1px solid rgba(12, 80, 78, 0.11);
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-spec {
  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 9px 6px;

  border: 1px solid rgba(0, 140, 136, 0.15);
  border-radius: 4px;

  background-color: rgba(255, 255, 255, 0.72);

  text-align: center;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-spec-value {
  display: block;

  margin: 0 0 3px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;

  color: #008C88;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-spec-label {
  display: block;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.35;

  color: #5F7378;
}


/* =========================================================
   18. INPUT PANEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-panel {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 27px 24px 24px;

  border-radius: 8px;

  background:
    linear-gradient(
      145deg,
      #0C504E 0%,
      #073B3A 100%
    );

  overflow: hidden;

  box-shadow:
    0 12px 30px rgba(12, 80, 78, 0.16);
}


/* Grid pattern */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-panel::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 0;

  opacity: 0.09;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    );

  background-size: 36px 36px;

  pointer-events: none;
}


/* Background glow */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-panel::after {
  content: "";

  position: absolute;
  right: -75px;
  bottom: -75px;
  z-index: 0;

  width: 260px;
  height: 260px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(255, 179, 4, 0.17) 0%,
      rgba(255, 179, 4, 0.05) 45%,
      rgba(255, 179, 4, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-panel > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   19. INPUT PANEL LABEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 13px;
  padding: 6px 10px;

  border: 1px solid rgba(255, 179, 4, 0.74);
  border-radius: 4px;

  background-color: rgba(255, 179, 4, 0.07);

  font-family: Inter, Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1.1px;
  text-transform: uppercase;

  color: #FFB304;
}


/* =========================================================
   20. INPUT PANEL TITLE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-title {
  width: 100%;

  margin: 0 0 10px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 27px;
  font-weight: 600;
  line-height: 1.22;

  color: #FFFFFF;
}


/* =========================================================
   21. INPUT PANEL DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-desc {
  width: 100%;

  margin: 0 0 20px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.65;

  color: rgba(255, 255, 255, 0.78);
}


/* =========================================================
   22. INPUT ITEMS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-list {
  width: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  gap: 11px;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-item {
  width: 100%;

  margin: 0;
  padding: 12px 12px;

  display: grid;
  grid-template-columns: 43px minmax(0, 1fr);

  gap: 11px;
  align-items: center;

  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 5px;

  background-color: rgba(255, 255, 255, 0.055);
}


/* Input code */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-code {
  width: 43px;
  height: 43px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255, 179, 4, 0.48);
  border-radius: 4px;

  background-color: rgba(5, 48, 47, 0.66);

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;

  color: #FFB304;
}


/* Input copy */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-copy {
  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-name {
  width: 100%;

  margin: 0 0 3px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-text {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.52;

  color: rgba(255, 255, 255, 0.72);
}


/* =========================================================
   23. INPUT NOTE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-note {
  width: 100%;

  margin: 18px 0 0;
  padding: 14px 0 0;

  border-top: 1px solid rgba(255, 179, 4, 0.33);
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-note p {
  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.58;

  color: rgba(255, 255, 255, 0.77);
}

.elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-note strong {
  font-weight: 700;

  color: #FFB304;
}


/* =========================================================
   24. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-12a8577 {
    padding: 40px 30px 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-layout {
    grid-template-columns: 1fr;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-panel {
    padding: 26px 24px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 12px;
  }

}


/* =========================================================
   25. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-12a8577 {
    padding: 36px 20px 28px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-title {
    font-size: 28px;
    line-height: 1.25;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-description {
    font-size: 15px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-grid {
    grid-template-columns: 1fr;

    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-media {
    min-height: 220px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-desc {
    min-height: 0;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-panel {
    padding: 24px 20px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-title {
    font-size: 25px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-input-list {
    display: flex;
    flex-direction: column;
  }

}


/* =========================================================
   26. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-12a8577 {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-eyebrow {
    padding: 6px 12px;

    font-size: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-specs {
    grid-template-columns: 1fr;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-spec {
    padding: 8px 10px;

    text-align: left;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-spec-value,
  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-spec-label {
    display: inline;
  }

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-spec-label::before {
    content: " — ";
  }

}


/* =========================================================
   27. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card,
  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-install-card::before,
  .elementor-9701 .elementor-element.elementor-element-12a8577 .dv-zigbee-relays-06-image img {
    transition: none;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-f9a3697 *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 07 — TUYA INTEGRATION & APPLICATIONS
   ========================================================= */


/* =========================================================
   01. SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 40px 40px 30px;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #F4FAF9;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697,
.elementor-9701 .elementor-element.elementor-element-f9a3697 * {
  box-sizing: border-box;
}


/* =========================================================
   02. INNER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-inner {
  position: relative;

  width: 100%;
  max-width: 1200px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
}


/* =========================================================
   03. STANDARD SECTION HEADING
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-header {
  width: 100%;
  max-width: 900px;

  margin: 0 auto 20px;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}


/* =========================================================
   04. EYEBROW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-eyebrow {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   05. H2
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-title {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.22;

  color: #008C88;

  text-wrap: balance;
}


/* =========================================================
   06. STANDARD GOLD DIVIDER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-divider {
  width: 86px;
  height: 6px;

  margin: 10px auto 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-divider-line {
  display: block;

  width: 35px;
  min-width: 35px;
  height: 2px;

  background-color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-divider-dot {
  display: block;

  width: 6px;
  min-width: 6px;
  height: 6px;

  border-radius: 50%;

  background-color: #FFB304;
}


/* =========================================================
   07. HEADING DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-description {
  width: 100%;
  max-width: 900px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;

  color: #5F7378;
}


/* =========================================================
   08. INTEGRATION PANEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration {
  position: relative;

  width: 100%;

  margin: 0 0 20px;
  padding: 26px 28px;

  display: grid;
  grid-template-columns:
    minmax(280px, 0.82fr)
    minmax(0, 1.18fr);

  gap: 24px;
  align-items: center;

  border-radius: 8px;

  background:
    linear-gradient(
      135deg,
      #0C504E 0%,
      #073D3B 100%
    );

  overflow: hidden;

  box-shadow:
    0 12px 30px rgba(12, 80, 78, 0.16);
}


/* technical grid background */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 0;

  opacity: 0.08;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    );

  background-size: 38px 38px;

  pointer-events: none;
}


/* decorative glow */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration::after {
  content: "";

  position: absolute;
  top: -110px;
  right: -80px;
  z-index: 0;

  width: 330px;
  height: 330px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0, 140, 136, 0.58) 0%,
      rgba(0, 140, 136, 0.17) 45%,
      rgba(0, 140, 136, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   09. INTEGRATION INTRO
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration-copy {
  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 12px;
  padding: 6px 10px;

  border: 1px solid rgba(255, 179, 4, 0.76);
  border-radius: 4px;

  background-color: rgba(255, 179, 4, 0.07);

  font-family: Inter, Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1.1px;
  text-transform: uppercase;

  color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration-title {
  width: 100%;

  margin: 0 0 9px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 27px;
  font-weight: 600;
  line-height: 1.22;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration-desc {
  width: 100%;

  margin: 0 0 14px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.65;

  color: rgba(255, 255, 255, 0.80);
}


/* version note */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-version-note {
  width: 100%;

  margin: 0;
  padding: 12px 13px;

  border-left: 3px solid #FFB304;

  background-color: rgba(255, 255, 255, 0.06);

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.55;

  color: rgba(255, 255, 255, 0.78);
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-version-note strong {
  font-weight: 700;

  color: #FFB304;
}


/* =========================================================
   10. COMMUNICATION ROUTES
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-routes {
  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 14px;
}


/* =========================================================
   11. ROUTE CARD
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-route {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 18px 16px;

  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 6px;

  background-color: rgba(255, 255, 255, 0.065);
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-route-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 10px;
  padding: 5px 8px;

  border: 1px solid rgba(255, 179, 4, 0.60);
  border-radius: 3px;

  background-color: rgba(255, 179, 4, 0.07);

  font-family: Inter, Arial, sans-serif;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.8px;
  text-transform: uppercase;

  color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-route-title {
  width: 100%;

  margin: 0 0 12px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.28;

  color: #FFFFFF;
}


/* =========================================================
   12. ROUTE FLOW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-route-flow {
  width: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  gap: 7px;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-route-step {
  position: relative;

  width: 100%;

  margin: 0;
  padding: 8px 10px 8px 30px;

  border-radius: 4px;

  background-color: rgba(5, 48, 47, 0.58);

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;

  color: rgba(255, 255, 255, 0.88);
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-route-step::before {
  content: "";

  position: absolute;
  top: 50%;
  left: 12px;

  width: 7px;
  height: 7px;

  border-radius: 50%;

  background-color: #FFB304;

  transform: translateY(-50%);
}


/* =========================================================
   13. APPLICATION GRID
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-grid {
  width: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: 16px;
  align-items: stretch;
}


/* Elementor child reset */

.elementor-9701 .elementor-element.elementor-element-f9a3697
  .dv-zigbee-relays-07-app-grid
  > .elementor-element {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}


/* =========================================================
   14. APPLICATION CARD
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card {
  position: relative;

  width: 100%;
  min-width: 0;
  height: 100%;

  margin: 0;
  padding: 0;

  display: flex;
  flex-direction: column;

  border: 1px solid rgba(12, 80, 78, 0.13);
  border-radius: 8px;

  background-color: #FFFFFF;

  overflow: hidden;

  box-shadow:
    0 8px 23px rgba(12, 80, 78, 0.07);

  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}


/* hover gold line */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card::before {
  content: "";

  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 5;

  width: 100%;
  height: 4px;

  background-color: #FFB304;

  transform: scaleX(0);
  transform-origin: left center;

  transition: transform 0.28s ease;

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card:hover,
.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card:focus-within {
  transform: translateY(-5px);

  border-color: rgba(255, 179, 4, 0.46);

  box-shadow:
    0 16px 34px rgba(12, 80, 78, 0.13);
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card:hover::before,
.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card:focus-within::before {
  transform: scaleX(1);
}


/* =========================================================
   15. APPLICATION IMAGE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-media {
  position: relative;

  width: 100%;
  height: 190px;

  margin: 0;
  padding: 0;

  background-color: #EAF4F2;

  overflow: hidden;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-image {
  width: 100%;
  height: 100%;

  margin: 0;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697
  .dv-zigbee-relays-07-app-image
  .elementor-widget-container {
  width: 100%;
  height: 100%;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-image img {
  display: block;

  width: 100%;
  height: 190px;

  object-fit: cover;
  object-position: center center;

  transition: transform 0.42s ease;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697
  .dv-zigbee-relays-07-app-card:hover
  .dv-zigbee-relays-07-app-image img {
  transform: scale(1.045);
}


/* image gradient */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-media::after {
  content: "";

  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;

  height: 54%;

  background:
    linear-gradient(
      180deg,
      rgba(12, 80, 78, 0) 0%,
      rgba(12, 80, 78, 0.52) 100%
    );

  pointer-events: none;
}


/* =========================================================
   16. APPLICATION CONTENT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-content {
  position: relative;

  width: 100%;
  height: 100%;

  margin: 0;
  padding: 19px 18px 18px;

  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;

  background-color: #FFFFFF;
}


/* corner decoration */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-content::after {
  content: "";

  position: absolute;
  right: -38px;
  bottom: -38px;

  width: 110px;
  height: 110px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0, 140, 136, 0.08) 0%,
      rgba(0, 140, 136, 0.02) 48%,
      rgba(0, 140, 136, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-content > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   17. APPLICATION LABEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 9px;
  padding: 5px 8px;

  border: 1px solid rgba(255, 179, 4, 0.66);
  border-radius: 3px;

  background-color: rgba(255, 179, 4, 0.07);

  font-family: Inter, Arial, sans-serif;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.7px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   18. APPLICATION TITLE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-title {
  width: 100%;
  min-height: 54px;

  margin: 0 0 8px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;

  color: #0C504E;
}


/* =========================================================
   19. APPLICATION DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-desc {
  width: 100%;

  margin: 0 0 14px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.58;

  color: #5F7378;
}


/* =========================================================
   20. APPLICATION MODEL NOTE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-model {
  width: 100%;

  margin: auto 0 0;
  padding: 11px 0 0;

  border-top: 1px solid rgba(12, 80, 78, 0.10);

  font-family: Inter, Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.45;

  color: #008C88;
}


/* =========================================================
   21. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-f9a3697 {
    padding: 40px 30px 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration {
    grid-template-columns: 1fr;

    gap: 20px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-media,
  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-image img {
    height: 220px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-title {
    min-height: 0;
  }

}


/* =========================================================
   22. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-f9a3697 {
    padding: 36px 20px 28px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-title {
    font-size: 28px;
    line-height: 1.25;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-description {
    font-size: 15px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration {
    padding: 24px 20px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration-title {
    font-size: 25px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-routes {
    grid-template-columns: 1fr;

    gap: 12px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-grid {
    grid-template-columns: 1fr;

    gap: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-media,
  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-image img {
    height: 220px;
  }

}


/* =========================================================
   23. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-f9a3697 {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-eyebrow {
    padding: 6px 12px;

    font-size: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-integration {
    padding-right: 18px;
    padding-left: 18px;
  }

}


/* =========================================================
   24. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card,
  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-card::before,
  .elementor-9701 .elementor-element.elementor-element-f9a3697 .dv-zigbee-relays-07-app-image img {
    transition: none;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0daff59 *//* =========================================================
   ZIGBEE RELAYS & CONTROL MODULES
   SECTION 08 — OEM/ODM & PROJECT SUPPORT
   ========================================================= */


/* =========================================================
   01. SECTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 {
  position: relative;

  width: 100%;
  margin: 0;
  padding: 40px 40px 0px;

  box-sizing: border-box;
  overflow: hidden;

  background-color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-0daff59,
.elementor-9701 .elementor-element.elementor-element-0daff59 * {
  box-sizing: border-box;
}


/* =========================================================
   02. INNER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-inner {
  position: relative;

  width: 100%;
  max-width: 1200px;

  margin: 0 auto;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
}


/* =========================================================
   03. STANDARD SECTION HEADING
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-header {
  width: 100%;
  max-width: 900px;

  margin: 0 auto 20px;
  padding: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}


/* =========================================================
   04. EYEBROW
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-eyebrow {
  width: max-content;
  max-width: 100%;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: #FFFFFF;

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #0C504E;
}


/* =========================================================
   05. H2
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-title {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.22;

  color: #008C88;

  text-wrap: balance;
}


/* =========================================================
   06. STANDARD GOLD DIVIDER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-divider {
  width: 86px;
  height: 6px;

  margin: 10px auto 15px;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-divider-line {
  display: block;

  width: 35px;
  min-width: 35px;
  height: 2px;

  background-color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-divider-dot {
  display: block;

  width: 6px;
  min-width: 6px;
  height: 6px;

  border-radius: 50%;

  background-color: #FFB304;
}


/* =========================================================
   07. HEADING DESCRIPTION
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-description {
  width: 100%;
  max-width: 900px;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;

  color: #5F7378;
}


/* =========================================================
   08. SUPPORT LAYOUT
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-layout {
  position: relative;

  width: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns:
    minmax(0, 0.88fr)
    minmax(0, 1.12fr);

  align-items: stretch;

  border: 1px solid rgba(12, 80, 78, 0.14);
  border-radius: 8px;

  background-color: #0C504E;

  overflow: hidden;

  box-shadow:
    0 14px 36px rgba(12, 80, 78, 0.15);
}


/* top gold line */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-layout::before {
  content: "";

  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 8;

  width: 100%;
  height: 4px;

  background-color: #FFB304;

  pointer-events: none;
}


/* Elementor child reset */

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-layout
  > .elementor-element {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  margin: 0 !important;
}


/* =========================================================
   09. LEFT MEDIA PANEL
   Background image is placed on this container
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media {
  position: relative;
  isolation: isolate;

  width: 100%;
  min-width: 0;
  min-height: 480px;

  margin: 0;
  padding: 34px 30px;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;

  background-color: #0C504E;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;

  overflow: hidden;
}


/* dark image overlay */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 0;

  background:
    linear-gradient(
      180deg,
      rgba(5, 48, 47, 0.10) 0%,
      rgba(5, 48, 47, 0.28) 42%,
      rgba(5, 48, 47, 0.94) 100%
    );

  pointer-events: none;
}


/* soft gold glow */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media::after {
  content: "";

  position: absolute;
  right: -90px;
  bottom: -100px;
  z-index: 0;

  width: 310px;
  height: 310px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(255, 179, 4, 0.18) 0%,
      rgba(255, 179, 4, 0.05) 45%,
      rgba(255, 179, 4, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   10. MEDIA COPY
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media-copy {
  width: 100%;
  max-width: 440px;

  margin: 0;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 12px;
  padding: 6px 10px;

  border: 1px solid rgba(255, 179, 4, 0.78);
  border-radius: 4px;

  background-color: rgba(5, 48, 47, 0.56);

  font-family: Inter, Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1.1px;
  text-transform: uppercase;

  color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media-title {
  width: 100%;

  margin: 0 0 10px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 31px;
  font-weight: 600;
  line-height: 1.2;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media-text {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.65;

  color: rgba(255, 255, 255, 0.84);
}


/* =========================================================
   11. RIGHT CONTENT PANEL
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content {
  position: relative;

  width: 100%;
  min-width: 0;
  min-height: 480px;

  margin: 0;
  padding: 34px 32px 32px;

  display: flex;
  flex-direction: column;
  align-items: flex-start;

  background:
    linear-gradient(
      145deg,
      #0C504E 0%,
      #073C3A 100%
    );

  overflow: hidden;
}


/* technical grid */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 0;

  opacity: 0.08;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.18) 1px,
      transparent 1px
    );

  background-size: 38px 38px;

  pointer-events: none;
}


/* teal glow */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content::after {
  content: "";

  position: absolute;
  top: -110px;
  right: -100px;
  z-index: 0;

  width: 330px;
  height: 330px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0, 140, 136, 0.55) 0%,
      rgba(0, 140, 136, 0.16) 45%,
      rgba(0, 140, 136, 0) 72%
    );

  pointer-events: none;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content > * {
  position: relative;
  z-index: 2;
}


/* =========================================================
   12. CONTENT INTRO
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content-label {
  width: max-content;
  max-width: 100%;

  margin: 0 0 11px;
  padding: 6px 10px;

  border: 1px solid rgba(255, 179, 4, 0.74);
  border-radius: 4px;

  background-color: rgba(255, 179, 4, 0.07);

  font-family: Inter, Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 1.1px;
  text-transform: uppercase;

  color: #FFB304;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content-title {
  width: 100%;
  max-width: 590px;

  margin: 0 0 9px;
  padding: 0;

  font-family: Georgia, "Times New Roman", serif;
  font-size: 29px;
  font-weight: 600;
  line-height: 1.22;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content-desc {
  width: 100%;
  max-width: 620px;

  margin: 0 0 20px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.65;

  color: rgba(255, 255, 255, 0.80);
}


/* =========================================================
   13. SUPPORT ITEM GRID
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-grid {
  width: 100%;

  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 12px;
}


/* =========================================================
   14. SUPPORT ITEM
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-item {
  position: relative;

  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 14px 13px;

  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);

  gap: 11px;
  align-items: start;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 5px;

  background-color: rgba(255, 255, 255, 0.055);

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    background-color 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-item:hover {
  transform: translateY(-3px);

  border-color: rgba(255, 179, 4, 0.48);

  background-color: rgba(255, 255, 255, 0.085);
}


/* =========================================================
   15. ITEM NUMBER
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-number {
  width: 42px;
  height: 42px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255, 179, 4, 0.56);
  border-radius: 4px;

  background-color: rgba(5, 48, 47, 0.66);

  font-family: Inter, Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;

  color: #FFB304;
}


/* =========================================================
   16. ITEM COPY
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-copy {
  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 0;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-title {
  width: 100%;

  margin: 0 0 4px;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;

  color: #FFFFFF;
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-text {
  width: 100%;

  margin: 0;
  padding: 0;

  font-family: Inter, Arial, sans-serif;
  font-size: 12.3px;
  font-weight: 400;
  line-height: 1.52;

  color: rgba(255, 255, 255, 0.72);
}


/* =========================================================
   17. SUPPORT NOTE
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-note {
  width: 100%;

  margin: 17px 0 0;
  padding: 13px 14px;

  border-left: 3px solid #FFB304;
  border-radius: 0 4px 4px 0;

  background-color: rgba(255, 255, 255, 0.06);

  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.55;

  color: rgba(255, 255, 255, 0.78);
}

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-note strong {
  font-weight: 700;

  color: #FFB304;
}


/* =========================================================
   18. ACTIONS
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-actions {
  width: 100%;

  margin: auto 0 0;
  padding: 22px 0 0;

  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;

  gap: 12px;
}


/* Elementor button reset */

.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-primary,
.elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-secondary {
  width: auto;

  margin: 0;
  padding: 0;
}


/* =========================================================
   19. PRIMARY BUTTON
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-primary
  .elementor-button {
  min-height: 48px;

  padding: 13px 22px;

  border: 1px solid #008C88;
  border-radius: 4px;

  background-color: #008C88;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;

  color: #FFFFFF;

  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-primary
  .elementor-button:hover,
.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-primary
  .elementor-button:focus-visible {
  border-color: #FFB304;
  background-color: #FFB304;

  color: #FFFFFF;

  transform: translateY(-2px);

  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.18);
}


/* =========================================================
   20. SECONDARY WHATSAPP BUTTON
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button {
  min-height: 48px;

  padding: 12px 22px;

  border: 1px solid #FFB304;
  border-radius: 4px;

  background-color: transparent;

  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;

  color: #FFFFFF;

  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:hover,
.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:focus-visible {
  border-color: #008C88;
  background-color: #008C88;

  color: #FFFFFF;

  transform: translateY(-2px);

  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.18);
}


/* WhatsApp official icon */

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 22px !important;
  line-height: 1 !important;

  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button-icon i {
  font-size: 22px !important;
  line-height: 1 !important;

  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button-icon svg {
  display: block;

  width: 22px !important;
  height: 22px !important;

  color: #25D366 !important;
  fill: #25D366 !important;
}


/* keep icon green on hover */

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:hover
  .elementor-button-icon,
.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:focus-visible
  .elementor-button-icon,
.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:hover
  .elementor-button-icon i,
.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:focus-visible
  .elementor-button-icon i {
  color: #25D366 !important;
}

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:hover
  .elementor-button-icon svg,
.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-secondary
  .elementor-button:focus-visible
  .elementor-button-icon svg {
  color: #25D366 !important;
  fill: #25D366 !important;
}


/* =========================================================
   21. ACCESSIBILITY
   ========================================================= */

.elementor-9701 .elementor-element.elementor-element-0daff59
  .dv-zigbee-relays-08-actions
  .elementor-button:focus-visible {
  outline: 3px solid rgba(255, 179, 4, 0.42);
  outline-offset: 3px;
}


/* =========================================================
   22. TABLET
   ========================================================= */

@media (max-width: 1024px) {

  .elementor-9701 .elementor-element.elementor-element-0daff59 {
    padding: 40px 30px 30px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-layout {
    grid-template-columns: 1fr;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media {
    min-height: 360px;

    padding: 30px 28px;

    background-position: center center !important;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media-copy {
    max-width: 560px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content {
    min-height: 0;

    padding: 30px 28px;
  }

}


/* =========================================================
   23. MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .elementor-9701 .elementor-element.elementor-element-0daff59 {
    padding: 36px 20px 28px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-title {
    font-size: 28px;
    line-height: 1.25;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-description {
    font-size: 15px;
    line-height: 1.65;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media {
    min-height: 300px;

    padding: 25px 20px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content {
    padding: 25px 20px 24px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content-title {
    font-size: 26px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-grid {
    grid-template-columns: 1fr;

    gap: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-actions {
    flex-direction: column;
    align-items: stretch;

    gap: 10px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-primary,
  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-secondary {
    width: 100%;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59
    .dv-zigbee-relays-08-primary
    .elementor-button,
  .elementor-9701 .elementor-element.elementor-element-0daff59
    .dv-zigbee-relays-08-secondary
    .elementor-button {
    width: 100%;

    justify-content: center;
  }

}


/* =========================================================
   24. SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .elementor-9701 .elementor-element.elementor-element-0daff59 {
    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-eyebrow {
    padding: 6px 12px;

    font-size: 11px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-title {
    font-size: 27px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-media {
    min-height: 280px;

    padding-right: 18px;
    padding-left: 18px;
  }

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-content {
    padding-right: 18px;
    padding-left: 18px;
  }

}


/* =========================================================
   25. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .elementor-9701 .elementor-element.elementor-element-0daff59 .dv-zigbee-relays-08-support-item,
  .elementor-9701 .elementor-element.elementor-element-0daff59
    .dv-zigbee-relays-08-primary
    .elementor-button,
  .elementor-9701 .elementor-element.elementor-element-0daff59
    .dv-zigbee-relays-08-secondary
    .elementor-button {
    transition: none;
  }

}/* End custom CSS */