@import url(https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Montserrat:wght@400;500;600;700&display=swap);.ecml-hero-section{--ecml-hero-height:70vh;--ecml-hero-min-height:500px;--ecml-hero-primary-color:#ff0c3a;--ecml-hero-primary-hover:#e0002e;--ecml-hero-dark-brand:#011f30;--ecml-hero-overlay-color:rgba(1, 31, 48, 0.7);--ecml-hero-overlay-hover:rgba(1, 31, 48, 0.55);--ecml-hero-text-color:#ffffff;--ecml-hero-tab-bg:rgba(0, 56, 87, 0.7);--ecml-hero-tab-active-bg:rgba(0, 56, 87, 0.9);--ecml-hero-progress-bar-bg:rgba(255, 255, 255, 0.3);--ecml-hero-progress-bar-fill:var(--ecml-hero-primary-color);--ecml-hero-font-display:'Bebas Neue', sans-serif;--ecml-hero-font-body:'Montserrat', sans-serif;--ecml-hero-slide-duration:6000;--ecml-hero-transition-speed:0.5s;--ecml-hero-mobile-breakpoint:900px}.ecml-hero-section *,.ecml-hero-section *::before,.ecml-hero-section *::after{box-sizing:border-box;margin:0;padding:0}.ecml-hero-section{font-family:var(--ecml-hero-font-body);line-height:1.5;-webkit-font-smoothing:antialiased}.ecml-hero-section{position:relative;width:100%;max-width:100vw;min-height:var(--ecml-hero-min-height);overflow-x:clip}.ecml-hero-columns{display:flex;width:100%;min-height:max(var(--ecml-hero-height), var(--ecml-hero-min-height))}.ecml-hero-column{position:relative;flex:1;display:flex;flex-direction:column;overflow:hidden;cursor:pointer;transition:flex var(--ecml-hero-transition-speed) cubic-bezier(.4,0,.2,1)}.ecml-hero-column__bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 0.8s cubic-bezier(.4,0,.2,1);transform:scale(1.15)}.ecml-hero-column:hover .ecml-hero-column__bg{transform:scale(1)}.ecml-hero-column__overlay{position:absolute;inset:0;background:var(--ecml-hero-overlay-color);transition:background var(--ecml-hero-transition-speed) ease}.ecml-hero-column:hover .ecml-hero-column__overlay{background:var(--ecml-hero-overlay-hover)}.ecml-hero-column__content{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;flex:1;padding:4.5rem 2.5rem 3rem;color:var(--ecml-hero-text-color)}.ecml-hero-column__subtitle{font-family:var(--ecml-hero-font-body)!important;font-size:0.85rem!important;font-weight:600!important;letter-spacing:.15em;text-transform:uppercase;color:var(--ecml-hero-text-color)!important;opacity:.85;margin-bottom:.5rem}.ecml-hero-column__title{font-family:var(--ecml-hero-font-display)!important;font-size:clamp(2.5rem, 4vw, 3.5rem)!important;font-weight:400!important;letter-spacing:.02em;line-height:1.1!important;color:var(--ecml-hero-text-color)!important;margin-bottom:1rem}.ecml-hero-column__description{font-size:.95rem;line-height:1.6;opacity:.9;max-width:320px;margin-bottom:1.25rem}.ecml-hero-column__expanded{max-height:0;opacity:0;overflow:hidden;transition:max-height 0.5s cubic-bezier(.4,0,.2,1),opacity 0.4s ease 0.1s}.ecml-hero-column:hover .ecml-hero-column__expanded{max-height:300px;opacity:1}.ecml-hero-column__blurb{font-size:.9rem;line-height:1.6;opacity:.85;margin-bottom:1.25rem;max-width:300px}.ecml-hero-column__features{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;list-style:none}.ecml-hero-column__feature{display:flex;align-items:center;gap:.75rem;font-size:.9rem}.ecml-hero-column__feature-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:rgb(255 255 255 / .15);border-radius:8px;flex-shrink:0}.ecml-hero-column__feature-icon svg{width:18px;height:18px;stroke:var(--ecml-hero-primary-color);stroke-width:2;fill:none}.ecml-hero-column__cta{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 1.75rem;background:var(--ecml-hero-primary-color);color:var(--ecml-hero-text-color);font-family:var(--ecml-hero-font-body);font-size:.9rem;font-weight:600;text-decoration:none;border:none;border-radius:4px;cursor:pointer;transition:background 0.3s ease,transform 0.2s ease;width:fit-content}.ecml-hero-column__cta:hover{background:var(--ecml-hero-primary-hover);transform:translateY(-2px);color:var(--ecml-hero-text-color)}.ecml-hero-column__cta svg{width:18px;height:18px;transition:transform 0.3s ease}.ecml-hero-column__cta:hover svg{transform:translateX(4px)}.ecml-hero-column__cta-group{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.ecml-hero-column__tool-cta{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 1.5rem;background:var(--ecml-hero-primary-color);color:var(--ecml-hero-text-color);font-family:var(--ecml-hero-font-body);font-size:.85rem;font-weight:700;text-decoration:none;border:2px solid var(--ecml-hero-text-color);border-radius:4px;cursor:pointer;transition:all 0.3s ease;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 4px 15px rgb(255 12 58 / .4);animation:ecmlToolPulse 2s ease-in-out infinite}.ecml-hero-column__tool-cta:hover{background:var(--ecml-hero-primary-hover);transform:translateY(-3px) scale(1.02);box-shadow:0 6px 20px rgb(255 12 58 / .5);color:var(--ecml-hero-text-color)}.ecml-hero-column__tool-cta svg{width:18px;height:18px;flex-shrink:0}@keyframes ecmlToolPulse{0%,100%{box-shadow:0 4px 15px rgb(255 12 58 / .4)}50%{box-shadow:0 4px 25px rgb(255 12 58 / .6)}}.ecml-hero-column__promo{display:flex;align-items:center;gap:.75rem;margin-top:1.25rem;padding:.875rem 1.25rem;background:linear-gradient(135deg,rgb(255 12 58 / .2) 0%,rgb(255 12 58 / .1) 100%);border:1px solid rgb(255 12 58 / .4);border-left:4px solid var(--ecml-hero-primary-color);border-radius:4px;backdrop-filter:blur(5px);animation:ecmlPromoSlideIn 0.5s ease-out}.ecml-hero-column__promo-badge{display:inline-block;padding:.25rem .6rem;background:var(--ecml-hero-primary-color);color:var(--ecml-hero-text-color);font-family:var(--ecml-hero-font-body);font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border-radius:3px;flex-shrink:0}.ecml-hero-column__promo-text{font-family:var(--ecml-hero-font-body);font-size:.875rem;font-weight:600;color:var(--ecml-hero-text-color)}@keyframes ecmlPromoSlideIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.ecml-hero-column__promo-banner{position:absolute;top:0;left:0;right:0;z-index:5;padding:1rem 1.5rem;background:linear-gradient(135deg,rgb(255 12 58 / .95) 0%,rgb(200 0 40 / .9) 100%);border-bottom:3px solid rgb(255 255 255 / .3);text-align:center;animation:ecmlPromoBannerPulse 3s ease-in-out infinite}.ecml-hero-column__promo-header{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:.5rem;flex-wrap:wrap}.ecml-hero-column__promo-banner .ecml-hero-column__promo-badge{background:var(--ecml-hero-text-color);color:var(--ecml-hero-primary-color);padding:.2rem .5rem;font-size:.6rem;animation:ecmlBadgePulse 1.5s ease-in-out infinite}.ecml-hero-column__promo-title{font-family:var(--ecml-hero-font-display);font-size:1.25rem;font-weight:400;color:var(--ecml-hero-text-color);letter-spacing:.05em;text-transform:uppercase}.ecml-hero-column__promo-offer{font-family:var(--ecml-hero-font-body);font-size:1.1rem;font-weight:700;color:var(--ecml-hero-text-color);margin-bottom:.25rem;text-shadow:0 1px 2px rgb(0 0 0 / .2)}.ecml-hero-column__promo-details{font-family:var(--ecml-hero-font-body);font-size:.75rem;font-weight:500;color:rgb(255 255 255 / .85);font-style:italic}@keyframes ecmlPromoBannerPulse{0%,100%{background:linear-gradient(135deg,rgb(255 12 58 / .95) 0%,rgb(200 0 40 / .9) 100%)}50%{background:linear-gradient(135deg,rgb(255 30 70 / .98) 0%,rgb(220 10 50 / .95) 100%)}}@keyframes ecmlBadgePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.ecml-hero-column--roofing .ecml-hero-column__content,.ecml-hero-column--fencing .ecml-hero-column__content{padding-top:7rem;transition:padding-top var(--ecml-hero-transition-speed) ease}.ecml-hero-column--roofing:hover .ecml-hero-column__promo-banner,.ecml-hero-column--fencing:hover .ecml-hero-column__promo-banner{padding:.5rem 1.5rem}.ecml-hero-column--roofing:hover .ecml-hero-column__promo-header,.ecml-hero-column--fencing:hover .ecml-hero-column__promo-header{margin-bottom:.25rem;gap:.5rem}.ecml-hero-column--roofing:hover .ecml-hero-column__promo-title,.ecml-hero-column--fencing:hover .ecml-hero-column__promo-title{font-size:1rem}.ecml-hero-column--roofing:hover .ecml-hero-column__promo-offer,.ecml-hero-column--fencing:hover .ecml-hero-column__promo-offer{font-size:.9rem;margin-bottom:.15rem}.ecml-hero-column--roofing:hover .ecml-hero-column__promo-details,.ecml-hero-column--fencing:hover .ecml-hero-column__promo-details{font-size:.65rem}.ecml-hero-column--roofing:hover .ecml-hero-column__content,.ecml-hero-column--fencing:hover .ecml-hero-column__content{padding-top:5rem}.ecml-hero-column__promo-banner{transition:padding var(--ecml-hero-transition-speed) ease}.ecml-hero-column__promo-header{transition:margin var(--ecml-hero-transition-speed) ease,gap var(--ecml-hero-transition-speed) ease}.ecml-hero-column__promo-title,.ecml-hero-column__promo-offer,.ecml-hero-column__promo-details{transition:font-size var(--ecml-hero-transition-speed) ease,margin var(--ecml-hero-transition-speed) ease}.ecml-hero-columns:hover .ecml-hero-column{flex:.85}.ecml-hero-columns:hover .ecml-hero-column:hover{flex:1.3}.ecml-hero-column:not(:last-child)::after{content:'';position:absolute;right:0;top:10%;height:80%;width:1px;background:rgb(255 255 255 / .2);z-index:3}.ecml-hero-tabs{display:none;position:absolute;bottom:0;left:0;right:0;z-index:10;background:rgb(0 0 0 / .3);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.ecml-hero-tabs__progress{height:3px;background:var(--ecml-hero-progress-bar-bg);position:relative;overflow:hidden}.ecml-hero-tabs__progress-bar{position:absolute;left:0;top:0;height:100%;width:0;background:var(--ecml-hero-progress-bar-fill);transition:width 0.1s linear}.ecml-hero-tabs__progress-bar.animating{animation:ecmlHeroProgressFill 6s linear forwards}@keyframes ecmlHeroProgressFill{from{width:0}to{width:100%}}.ecml-hero-tabs__buttons{display:flex}.ecml-hero-tab{flex:1;padding:1rem;background:var(--ecml-hero-tab-bg);border:none;color:var(--ecml-hero-text-color);font-family:var(--ecml-hero-font-body);font-size:.85rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:background 0.3s ease;position:relative}.ecml-hero-tab:not(:last-child)::after{content:'';position:absolute;right:0;top:20%;height:60%;width:1px;background:rgb(255 255 255 / .2)}.ecml-hero-tab.active{background:var(--ecml-hero-tab-active-bg)}.ecml-hero-tab:hover{background:var(--ecml-hero-tab-active-bg)}@media (max-width:900px){.ecml-hero-section{height:auto;min-height:auto;max-height:none}.ecml-hero-columns{position:relative;width:100%}.ecml-hero-column{position:absolute;inset:0;width:100%;flex:none!important;opacity:0;visibility:hidden;transition:opacity 0.6s ease,visibility 0.6s ease}.ecml-hero-column.active{opacity:1;visibility:visible;position:relative;width:100%}.ecml-hero-column__bg{transform:scale(1.05)}.ecml-hero-column__content{padding:1.5rem 1.25rem;padding-bottom:5rem;min-height:auto;display:flex;flex-direction:column;justify-content:flex-start}.ecml-hero-column__title{font-size:2rem!important;margin-bottom:.75rem}.ecml-hero-column__description{font-size:.875rem;margin-bottom:1rem}.ecml-hero-column__expanded{max-height:none;opacity:1;overflow:visible}.ecml-hero-column__blurb{font-size:.85rem;margin-bottom:1rem}.ecml-hero-column__features{margin-bottom:1.25rem;gap:.5rem}.ecml-hero-column__feature{font-size:.8rem}.ecml-hero-column__feature-icon{width:28px;height:28px}.ecml-hero-column__feature-icon svg{width:14px;height:14px}.ecml-hero-column__cta-group{flex-direction:column;align-items:stretch;gap:.625rem;width:100%}.ecml-hero-column__cta,.ecml-hero-column__tool-cta{width:100%;justify-content:center;padding:.75rem 1.25rem;font-size:.85rem;text-align:center}.ecml-hero-column__tool-cta{animation:none}.ecml-hero-column__promo{margin-top:1rem;padding:.75rem 1rem;flex-wrap:wrap}.ecml-hero-column__promo-text{font-size:.8rem}.ecml-hero-column__promo-banner{position:relative;padding:.875rem 1rem;animation:none}.ecml-hero-column__promo-title{font-size:1rem}.ecml-hero-column__promo-offer{font-size:.95rem}.ecml-hero-column__promo-details{font-size:.7rem}.ecml-hero-column--fencing .ecml-hero-column__content{padding-top:1.5rem}.ecml-hero-tabs{display:block}.ecml-hero-column:hover .ecml-hero-column__bg{transform:scale(1.05)}.ecml-hero-column:hover .ecml-hero-column__overlay{background:var(--ecml-hero-overlay-color)}.ecml-hero-columns:hover .ecml-hero-column{flex:none!important}}@media (max-width:480px){.ecml-hero-column__content{padding:1.25rem 1rem;padding-bottom:4.5rem}.ecml-hero-column__title{font-size:1.75rem!important}.ecml-hero-column__subtitle{font-size:0.75rem!important}.ecml-hero-column__description,.ecml-hero-column__blurb{font-size:.8rem}.ecml-hero-column__cta,.ecml-hero-column__tool-cta{padding:.65rem 1rem;font-size:.8rem}.ecml-hero-tab{padding:.75rem .5rem;font-size:.75rem}}@media (min-width:901px) and (max-width:1200px){.ecml-hero-section{--ecml-hero-min-height:550px}.ecml-hero-column__content{padding:2rem 1.5rem}.ecml-hero-column__expanded{max-height:350px}.ecml-hero-column__cta-group{flex-direction:column;align-items:flex-start;gap:.5rem}.ecml-hero-column__cta,.ecml-hero-column__tool-cta{font-size:.8rem;padding:.75rem 1.25rem}}@media (min-width:1400px){.ecml-hero-column__content{padding:3.5rem 3rem}}.ecml-hero-column--roofing .ecml-hero-column__bg{background-image:url(https://www.clicksteel.com.au/wp-content/uploads/2025/12/echs_roofing.jpg)}.ecml-hero-column--fencing .ecml-hero-column__bg{background-image:url(https://www.clicksteel.com.au/wp-content/uploads/2025/12/echs_fencing.jpg)}.ecml-hero-column--patios .ecml-hero-column__bg{background-image:url(https://www.clicksteel.com.au/wp-content/uploads/2025/12/echs_patio.jpg)}.ecml-hero-column__bg{will-change:transform}.ecml-hero-column{will-change:flex}