.elementor-3669 .elementor-element.elementor-element-912aafc{--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;--overlay-opacity:1;--overlay-mix-blend-mode:overlay;--border-radius:0em 0em 0em 0em;box-shadow:0px 0px 66px 6px rgba(0,0,0,0.5);--margin-top:2vw;--margin-bottom:2vw;--margin-left:0vw;--margin-right:0vw;--padding-top:3vw;--padding-bottom:3vw;--padding-left:3vw;--padding-right:3vw;--z-index:2;}.elementor-3669 .elementor-element.elementor-element-912aafc:not(.elementor-motion-effects-element-type-background), .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(100deg, #950000 11%, #000000 59%);}.elementor-3669 .elementor-element.elementor-element-912aafc::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-background-video-container::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .e-con-inner > .elementor-background-video-container::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-background-slideshow::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .e-con-inner > .elementor-background-slideshow::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-image:url("https://www.bwheatcool.com/wp-content/uploads/2026/04/4179.jpg");--background-overlay:'';background-position:bottom center;background-size:cover;}.elementor-3669 .elementor-element.elementor-element-912aafc::before{filter:brightness( 100% ) contrast( 98% ) saturate( 0% ) blur( 0px ) hue-rotate( 0deg );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3669 .elementor-element.elementor-element-4e011cd{text-align:center;}.elementor-3669 .elementor-element.elementor-element-4e011cd .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:600;-webkit-text-stroke-color:#000;stroke:#000;color:#FFFFFF;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-3669 .elementor-element.elementor-element-fef8d99{color:#FFFFFF;}@media(max-width:1024px){.elementor-3669 .elementor-element.elementor-element-912aafc:not(.elementor-motion-effects-element-type-background), .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(120deg, #950000 -20%, #000000 73%);}.elementor-3669 .elementor-element.elementor-element-912aafc{--margin-top:0vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;--padding-top:4vw;--padding-bottom:4vw;--padding-left:2vw;--padding-right:2vw;}}@media(max-width:767px){.elementor-3669 .elementor-element.elementor-element-912aafc:not(.elementor-motion-effects-element-type-background), .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #950000 0%, #000000 70%);}.elementor-3669 .elementor-element.elementor-element-912aafc::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-background-video-container::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .e-con-inner > .elementor-background-video-container::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-background-slideshow::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .e-con-inner > .elementor-background-slideshow::before, .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-position:center center;}.elementor-3669 .elementor-element.elementor-element-912aafc{--margin-top:0vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;--padding-top:6vw;--padding-bottom:9vw;--padding-left:4vw;--padding-right:4vw;}}/* Start custom CSS for container, class: .elementor-element-912aafc */.elementor-3669 .elementor-element.elementor-element-912aafc { overflow: visible !important; } /* 1. Define the rotation property */ @property --shimmer-angle { syntax: ''; initial-value: 0deg; inherits: false; } /* 2. The Container */ .elementor-3669 .elementor-element.elementor-element-912aafc { position: relative; /* Hide Elementor's default border */ border: none !important; /* OPTIONAL BUT RECOMMENDED: Clip the container itself to match the diagonal cuts. This prevents your container's background color from poking out past the custom border. */ --corner-size: 20px; clip-path: polygon( var(--corner-size) 0, calc(100% - var(--corner-size)) 0, 100% var(--corner-size), 100% calc(100% - var(--corner-size)), calc(100% - var(--corner-size)) 100%, var(--corner-size) 100%, 0 calc(100% - var(--corner-size)), 0 var(--corner-size) ); } /* 3. The Animated Border Layer */ .elementor-3669 .elementor-element.elementor-element-912aafc::before { content: ""; position: absolute; inset: 0; z-index: 999; /* CHANGED FROM 1 TO 999 TO FORCE IT ABOVE INNER CONTENT */ pointer-events: none; /* --- Scalable Variables --- */ --corner-size: 20px; --border-width: 1.5px; /* --- The Red Beam Gradient (from Snippet 1) --- */ background: conic-gradient( from var(--shimmer-angle), #ff00006e 0%, /* Base: Transparent Red */ #ff00006e 70%, /* Base: Stays quiet most of the way */ #ff0000 85%, /* Edge: Bright Red */ #ffe0e0 90%, /* Center: Very pale Red/White (Shine) */ #ff0000 95%, /* Edge: Bright Red */ #ff00006e 100% /* Loop back */ ); /* --- The Diagonal Cut Mask (from Snippet 2) --- We use 'black' here because masks reveal the background where they are opaque, and hide the background where they are 'transparent'. */ -webkit-mask: /* 1. Top-Left Diagonal */ linear-gradient(135deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) top left / var(--corner-size) var(--corner-size) no-repeat, /* 2. Top-Right Diagonal */ linear-gradient(225deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) top right / var(--corner-size) var(--corner-size) no-repeat, /* 3. Bottom-Left Diagonal */ linear-gradient(45deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) bottom left / var(--corner-size) var(--corner-size) no-repeat, /* 4. Bottom-Right Diagonal */ linear-gradient(315deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) bottom right / var(--corner-size) var(--corner-size) no-repeat, /* 5. Top Straight Line */ linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size) * 2) var(--border-width) no-repeat, /* 6. Bottom Straight Line */ linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size) * 2) var(--border-width) no-repeat, /* 7. Left Straight Line */ linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size) * 2) no-repeat, /* 8. Right Straight Line */ linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size) * 2) no-repeat; mask: linear-gradient(135deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) top left / var(--corner-size) var(--corner-size) no-repeat, linear-gradient(225deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) top right / var(--corner-size) var(--corner-size) no-repeat, linear-gradient(45deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) bottom left / var(--corner-size) var(--corner-size) no-repeat, linear-gradient(315deg, transparent calc(50% - var(--border-width) / 2), black calc(50% - var(--border-width) / 2), black calc(50% + var(--border-width) / 2), transparent calc(50% + var(--border-width) / 2)) bottom right / var(--corner-size) var(--corner-size) no-repeat, linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size) * 2) var(--border-width) no-repeat, linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size) * 2) var(--border-width) no-repeat, linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size) * 2) no-repeat, linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size) * 2) no-repeat; /* Animation */ animation: shimmerRotate 3s linear infinite; } /* 4. Animation Keyframes */ @keyframes shimmerRotate { 0% { --shimmer-angle: 0deg; } 100% { --shimmer-angle: 360deg; } } .elementor-3669 .elementor-element.elementor-element-912aafc > .elementor-container { position: relative; z-index: 1; } /* --------------------------------------------------------- DESKTOP & TABLET ONLY (min-width: 768px) Apply the RTL Gradient Mask --------------------------------------------------------- */ @media (min-width: 768px) { .elementor-3669 .elementor-element.elementor-element-912aafc::after { /* The Mask Logic: - 'to right': Gradient moves from Left to Right. - 'transparent 0%': The Left edge is fully transparent (No Blur). - 'transparent 10%': Keeps the very far left completely clear. - 'black 100%': The Right edge is fully opaque (Full Blur). This creates a smooth grading where the Left 50% is mostly clear and the Right 50% is blurred. */ -webkit-mask-image: linear-gradient(to right, transparent 0%, transparent 10%, black 100%); mask-image: linear-gradient(to right, transparent 0%, transparent 05%, black 70%); } }/* End custom CSS */