.elementor-29 .elementor-element.elementor-element-db98971{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;border-style:solid;--border-style:solid;border-width:0px 0px 1px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:#354C66;--border-color:#354C66;box-shadow:0px 0px 10px 0px rgba(110.5, 110.5, 110.5, 0.5);--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:10px;--padding-bottom:10px;--padding-left:0px;--padding-right:0px;}.elementor-29 .elementor-element.elementor-element-db98971:not(.elementor-motion-effects-element-type-background), .elementor-29 .elementor-element.elementor-element-db98971 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#152436;}.elementor-29 .elementor-element.elementor-element-60b78ff{--display:flex;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-29 .elementor-element.elementor-element-59e3ab5{--display:flex;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Poppins;font-weight:var( --e-global-typography-text-font-weight );}.elementor-29 .elementor-element.elementor-element-2725bdc{text-align:start;}.elementor-29 .elementor-element.elementor-element-651d765{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Poppins;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before, .elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before, .elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Poppins;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-menu-toggle{margin:0 auto;}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu .elementor-item{font-family:"Poppins", Poppins;font-weight:500;}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--main .elementor-item{color:#FFFFFF;fill:#FFFFFF;}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:var( --e-global-color-6efcb60 );}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--dropdown a:hover, .elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--dropdown a:focus, .elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--dropdown a.elementor-item-active, .elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--dropdown a.highlighted, .elementor-29 .elementor-element.elementor-element-6a39311 .elementor-menu-toggle:hover, .elementor-29 .elementor-element.elementor-element-6a39311 .elementor-menu-toggle:focus{color:var( --e-global-color-6efcb60 );}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--dropdown a.elementor-item-active{color:var( --e-global-color-accent );}.elementor-29 .elementor-element.elementor-element-6a39311 div.elementor-menu-toggle{color:var( --e-global-color-6efcb60 );}.elementor-29 .elementor-element.elementor-element-6a39311 div.elementor-menu-toggle svg{fill:var( --e-global-color-6efcb60 );}.elementor-29 .elementor-element.elementor-element-1b6671c{--display:flex;--justify-content:center;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Poppins;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-29 .elementor-element.elementor-element-58af46c .elementor-button{background-color:var( --e-global-color-accent );font-family:"Poppins", Poppins;font-weight:500;fill:var( --e-global-color-146b82f );color:var( --e-global-color-146b82f );border-radius:5px 5px 5px 5px;}.elementor-29 .elementor-element.elementor-element-58af46c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-29 .elementor-element.elementor-element-60b78ff{--width:15%;}.elementor-29 .elementor-element.elementor-element-59e3ab5{--width:35%;}.elementor-29 .elementor-element.elementor-element-651d765{--width:70%;}.elementor-29 .elementor-element.elementor-element-1b6671c{--width:15%;}}@media(max-width:1024px) and (min-width:768px){.elementor-29 .elementor-element.elementor-element-60b78ff{--width:20%;}.elementor-29 .elementor-element.elementor-element-59e3ab5{--width:50%;}.elementor-29 .elementor-element.elementor-element-651d765{--width:60%;}.elementor-29 .elementor-element.elementor-element-1b6671c{--width:20%;}}@media(max-width:1366px){.elementor-29 .elementor-element.elementor-element-db98971{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:15px;--padding-bottom:15px;--padding-left:20px;--padding-right:20px;}.elementor-29 .elementor-element.elementor-element-6a39311{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu .elementor-item{font-size:14px;}}@media(max-width:1024px){.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu .elementor-item{font-size:14px;}.elementor-29 .elementor-element.elementor-element-6a39311 .elementor-nav-menu--main .elementor-item{padding-left:10px;padding-right:10px;}.elementor-29 .elementor-element.elementor-element-58af46c .elementor-button{padding:10px 10px 10px 10px;}}@media(max-width:767px){.elementor-29 .elementor-element.elementor-element-db98971{--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-29 .elementor-element.elementor-element-60b78ff{--width:50%;}.elementor-29 .elementor-element.elementor-element-59e3ab5{--width:30%;}.elementor-29 .elementor-element.elementor-element-651d765{--width:45%;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}}/* Start custom CSS for image, class: .elementor-element-2725bdc *//* ===================================================== TOOL HOUSE BD 4-CORNER DIAGONAL LIGHT SWEEP PERFECTLY EQUAL TIMING ===================================================== */ .elementor-29 .elementor-element.elementor-element-2725bdc { position: relative; display: inline-block; overflow: hidden; isolation: isolate; } /* ===================================================== LOGO — COMPLETELY STATIC ===================================================== */ .elementor-29 .elementor-element.elementor-element-2725bdc img { display: block; position: relative; z-index: 2; /* Logo itself NEVER moves */ transform: none !important; } /* ===================================================== MAIN LIGHT BEAM ===================================================== */ .elementor-29 .elementor-element.elementor-element-2725bdc::after { content: ""; position: absolute; /* * Long enough to cover the complete logo * from corner to corner */ width: 180%; height: 4px; /* * Start from center */ top: 50%; left: 50%; margin-left: -90%; margin-top: -2px; z-index: 10; pointer-events: none; /* * Strong blue → white → orange energy line */ background: linear-gradient( 90deg, transparent 0%, transparent 30%, rgba(0, 140, 255, 0.20) 39%, #008cff 44%, #ffffff 48%, #ffffff 52%, #ff8c00 56%, rgba(255, 140, 0, 0.20) 61%, transparent 70%, transparent 100% ); /* * STRONG GLOW */ box-shadow: 0 0 4px rgba(255,255,255,1), 0 0 8px rgba(255,255,255,0.95), 0 0 14px rgba(0,140,255,1), 0 0 24px rgba(0,140,255,0.95), 0 0 38px rgba(255,140,0,0.90), 0 0 55px rgba(255,140,0,0.60); filter: blur(0.25px); /* * IMPORTANT: * One animation controls everything. */ animation: THB_4_Corner_Sweep 8s linear infinite; } /* ===================================================== SOFT OUTER GLOW ===================================================== */ .elementor-29 .elementor-element.elementor-element-2725bdc::before { content: ""; position: absolute; width: 180%; height: 26px; top: 50%; left: 50%; margin-left: -90%; margin-top: -13px; z-index: 9; pointer-events: none; background: linear-gradient( 90deg, transparent 25%, rgba(0,140,255,0.30) 42%, rgba(255,255,255,0.40) 50%, rgba(255,140,0,0.30) 58%, transparent 75% ); filter: blur(10px); animation: THB_4_Corner_Sweep 8s linear infinite; } /* ===================================================== 4 CORNER ANIMATION ===================================================== 0% → 25% = TOP-LEFT → BOTTOM-RIGHT 25% → 50% = TOP-RIGHT → BOTTOM-LEFT 50% → 75% = BOTTOM-RIGHT → TOP-LEFT 75% → 100%= BOTTOM-LEFT → TOP-RIGHT EXACTLY 2 SECONDS EACH ===================================================== */ @keyframes THB_4_Corner_Sweep { /* ================================================= 1️⃣ TOP-LEFT → BOTTOM-RIGHT ↖️ → ↘️ ================================================= */ 0% { transform: translate(-135%, -135%) rotate(45deg); opacity: 0; } 3% { opacity: 1; } 22% { opacity: 1; } 25% { transform: translate(135%, 135%) rotate(45deg); opacity: 0; } /* ================================================= 2️⃣ TOP-RIGHT → BOTTOM-LEFT ↗️ → ↙️ ================================================= */ 25.01% { transform: translate(135%, -135%) rotate(-45deg); opacity: 0; } 28% { opacity: 1; } 47% { opacity: 1; } 50% { transform: translate(-135%, 135%) rotate(-45deg); opacity: 0; } /* ================================================= 3️⃣ BOTTOM-RIGHT → TOP-LEFT ↘️ → ↖️ ================================================= */ 50.01% { transform: translate(135%, 135%) rotate(45deg); opacity: 0; } 53% { opacity: 1; } 72% { opacity: 1; } 75% { transform: translate(-135%, -135%) rotate(45deg); opacity: 0; } /* ================================================= 4️⃣ BOTTOM-LEFT → TOP-RIGHT ↙️ → ↗️ ================================================= */ 75.01% { transform: translate(-135%, 135%) rotate(-45deg); opacity: 0; } 78% { opacity: 1; } 97% { opacity: 1; } 100% { transform: translate(135%, -135%) rotate(-45deg); opacity: 0; } } /* ===================================================== REDUCED MOTION ===================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-29 .elementor-element.elementor-element-2725bdc::before, .elementor-29 .elementor-element.elementor-element-2725bdc::after { animation: none !important; opacity: 0 !important; } }/* End custom CSS */ /* Start custom CSS for nav-menu, class: .elementor-element-6a39311 *//* ===================================================== TOOL HOUSE BD — RIGHT MOBILE MENU Brand Color + Active Menu ===================================================== */ @media (max-width: 767px) { /* ================================ MOBILE MENU ================================ */ .elementor-nav-menu--dropdown { position: fixed !important; top: 0 !important; left: auto !important; right: 0 !important; width: 82vw !important; max-width: 360px !important; height: 100vh !important; margin: 0 !important; padding: 105px 20px 110px !important; background: #ffffff !important; overflow-y: auto !important; transform: translateX(100%) !important; transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1) !important; z-index: 99999 !important; } /* ================================ OPEN MENU ================================ */ .elementor-menu-toggle.elementor-active + .elementor-nav-menu--dropdown { transform: translateX(0) !important; } /* ================================ BUSINESS NAME ================================ */ .elementor-nav-menu--dropdown::before { content: "Tool House BD"; position: absolute; top: 32px; left: 30px; font-size: 21px; font-weight: 700; letter-spacing: -0.3px; background: linear-gradient( 90deg, #0038B8 0%, #0038B8 31%, #FD8C0B 42%, #FD8C0B 68%, #0038B8 80%, #0038B8 100% ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; z-index: 20; white-space: nowrap; } /* ================================ ORANGE ACCENT ================================ */ .elementor-nav-menu--dropdown::after { content: ""; position: absolute; top: 62px; left: 30px; width: 42px; height: 3px; background: #FD8C0B; border-radius: 10px; z-index: 20; } /* ================================ MENU ITEMS ================================ */ .elementor-nav-menu--dropdown .elementor-item { display: block !important; padding: 14px 10px !important; font-size: 16px !important; font-weight: 500 !important; color: #000000 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.08); border-radius: 0 !important; transition: color 0.25s ease, background 0.25s ease, padding-left 0.25s ease; } /* ================================ ACTIVE MENU ORANGE BACKGROUND + BLACK TEXT ================================ */ .elementor-nav-menu--dropdown .current-menu-item > .elementor-item, .elementor-nav-menu--dropdown .current-menu-ancestor > .elementor-item, .elementor-nav-menu--dropdown .current_page_item > .elementor-item, .elementor-nav-menu--dropdown .current_page_ancestor > .elementor-item { background: #FD8C0B !important; color: #000000 !important; padding-left: 16px !important; border-bottom-color: #FD8C0B !important; } /* ================================ ACTIVE — KEEP BLACK ON HOVER ================================ */ .elementor-nav-menu--dropdown .current-menu-item > .elementor-item:hover, .elementor-nav-menu--dropdown .current-menu-ancestor > .elementor-item:hover, .elementor-nav-menu--dropdown .current_page_item > .elementor-item:hover, .elementor-nav-menu--dropdown .current_page_ancestor > .elementor-item:hover { background: #FD8C0B !important; color: #000000 !important; } /* ================================ NORMAL HOVER ================================ */ .elementor-nav-menu--dropdown .elementor-item:hover { color: #FD8C0B !important; background: rgba(253, 140, 11, 0.06) !important; padding-left: 16px !important; } /* ================================ SUB MENU ================================ */ .elementor-nav-menu--dropdown .sub-menu { padding-left: 15px !important; background: transparent !important; } /* ================================ SOCIAL ICON AREA ================================ */ .elementor-nav-menu--dropdown { --social-bottom: 28px; } /* ================================ TOGGLE BUTTON ================================ */ .elementor-menu-toggle { position: relative; z-index: 100000 !important; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-58af46c */.elementor-29 .elementor-element.elementor-element-58af46c .elementor-button { --thb-orange: #FD8C0B; --thb-light: #FFB347; --thb-dark: #D96F00; cursor: pointer; min-width: 0px; min-height: 0px; padding: 0.9em 1.4em; font-size: 1rem; font-weight: 500; color: #000000 !important; border: none; border-radius: 8px; background-image: linear-gradient( 325deg, var(--thb-dark) 0%, var(--thb-orange) 35%, var(--thb-light) 55%, var(--thb-orange) 72%, var(--thb-dark) 100% ); background-size: 280% auto; background-position: left center; box-shadow: none !important; transition: background-position 0.8s ease, transform 0.3s ease; } /* Hover */ .elementor-29 .elementor-element.elementor-element-58af46c .elementor-button:hover { color: #000000 !important; background-position: right center; box-shadow: none !important; transform: translateY(-1px); } /* Active */ .elementor-29 .elementor-element.elementor-element-58af46c .elementor-button:active { color: #000000 !important; transform: translateY(1px); box-shadow: none !important; } /* Focus */ .elementor-29 .elementor-element.elementor-element-58af46c .elementor-button:focus, .elementor-29 .elementor-element.elementor-element-58af46c .elementor-button:focus-visible { color: #000000 !important; outline: none; box-shadow: none !important; } /* Reduced motion */ @media (prefers-reduced-motion: reduce) { .elementor-29 .elementor-element.elementor-element-58af46c .elementor-button { transition: none; } }/* End custom CSS */