.elementor-kit-7{--e-global-color-primary:#FF8C00;--e-global-color-secondary:#FFFFFF;--e-global-color-text:#FFFFFF;--e-global-color-accent:#8B8B8B;--e-global-color-background:#000000;--e-global-color-backgroundAccent:#333333;--e-global-color-transparent:#00000000;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-size:30px;--e-global-typography-primary-font-weight:900;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-secondary-font-family:"JetBrains Mono";--e-global-typography-secondary-font-size:20px;--e-global-typography-secondary-font-weight:500;--e-global-typography-secondary-text-transform:uppercase;--e-global-typography-text-font-family:"JetBrains Mono";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-text-transform:uppercase;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-family:"JetBrains Mono";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-line-height:1.5em;--e-global-typography-heading_xl-font-family:"Syne";--e-global-typography-heading_xl-font-size:70px;--e-global-typography-heading_xl-font-weight:700;--e-global-typography-heading_xl-text-transform:uppercase;--e-global-typography-heading_xl-line-height:1.2em;--e-global-typography-heading_xl-letter-spacing:2px;--e-global-typography-heading_l-font-family:"Syne";--e-global-typography-heading_l-font-size:45px;--e-global-typography-heading_l-font-weight:700;--e-global-typography-heading_l-text-transform:uppercase;--e-global-typography-heading_l-line-height:1.2em;--e-global-typography-heading_l-letter-spacing:2px;--e-global-typography-heading_m-font-family:"Syne";--e-global-typography-heading_m-font-size:24px;--e-global-typography-heading_m-font-weight:600;--e-global-typography-heading_m-text-transform:uppercase;--e-global-typography-heading_m-line-height:1.2em;--e-global-typography-heading_s-font-family:"Inter Tight";--e-global-typography-heading_s-font-size:18px;--e-global-typography-heading_s-font-weight:600;--e-global-typography-heading_s-text-transform:uppercase;--e-global-typography-body_s-font-family:"Inter Tight";--e-global-typography-body_s-font-size:18px;--e-global-typography-body_s-font-weight:400;--e-global-typography-body_s-text-transform:uppercase;--e-global-typography-body_s-line-height:1.5em;background-color:var( --e-global-color-background );}.elementor-kit-7 button,.elementor-kit-7 input[type="button"],.elementor-kit-7 input[type="submit"],.elementor-kit-7 .elementor-button{background-color:var( --e-global-color-background );font-family:"Syne", Sans-serif;font-size:24px;font-weight:700;text-transform:uppercase;line-height:1.2em;color:var( --e-global-color-secondary );box-shadow:0px 0px 30px -5px rgba(170.82053222656248, 169.32998002746507, 169.32998002746507, 0.96);padding:15px 040px 015px 040px;}.elementor-kit-7 button:hover,.elementor-kit-7 button:focus,.elementor-kit-7 input[type="button"]:hover,.elementor-kit-7 input[type="button"]:focus,.elementor-kit-7 input[type="submit"]:hover,.elementor-kit-7 input[type="submit"]:focus,.elementor-kit-7 .elementor-button:hover,.elementor-kit-7 .elementor-button:focus{background-color:var( --e-global-color-primary );color:var( --e-global-color-secondary );}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-kit-7 a:hover{text-decoration:none;}.elementor-kit-7 h3{text-decoration:none;}.elementor-kit-7 h6{text-decoration:none;}.elementor-kit-7 label{font-family:var( --e-global-typography-heading_m-font-family ), Sans-serif;font-size:var( --e-global-typography-heading_m-font-size );font-weight:var( --e-global-typography-heading_m-font-weight );text-transform:var( --e-global-typography-heading_m-text-transform );line-height:var( --e-global-typography-heading_m-line-height );}.elementor-kit-7 input:not([type="button"]):not([type="submit"]),.elementor-kit-7 textarea,.elementor-kit-7 .elementor-field-textual{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 );text-transform:var( --e-global-typography-text-text-transform );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-7 input:focus:not([type="button"]):not([type="submit"]),.elementor-kit-7 textarea:focus,.elementor-kit-7 .elementor-field-textual:focus{background-color:var( --e-global-color-accent );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:1rem;}.elementor-element{--widgets-spacing:1rem 1rem;--widgets-spacing-row:1rem;--widgets-spacing-column:1rem;}{}h1.entry-title{display:var(--page-title-display);}body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}.hfe-scroll-to-top-wrap .hfe-scroll-to-top-button{bottom:0px;}.hfe-scroll-to-top-button{left:15px;}.hfe-scroll-to-top-wrap .hfe-scroll-to-top-button i{color:var( --e-global-color-primary );}.hfe-scroll-to-top-wrap .hfe-scroll-to-top-button span{color:var( --e-global-color-primary );}@media(max-width:1024px){.elementor-kit-7{--e-global-typography-primary-font-size:22px;--e-global-typography-secondary-font-size:18px;--e-global-typography-heading_xl-font-size:48px;--e-global-typography-heading_l-font-size:40px;--e-global-typography-heading_m-font-size:32px;--e-global-typography-heading_s-font-size:18px;}.elementor-kit-7 button,.elementor-kit-7 input[type="button"],.elementor-kit-7 input[type="submit"],.elementor-kit-7 .elementor-button{font-size:32px;}.elementor-kit-7 label{font-size:var( --e-global-typography-heading_m-font-size );line-height:var( --e-global-typography-heading_m-line-height );}.elementor-kit-7 input:not([type="button"]):not([type="submit"]),.elementor-kit-7 textarea,.elementor-kit-7 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}}@media(max-width:767px){.elementor-kit-7{--e-global-typography-primary-font-size:18px;--e-global-typography-secondary-font-size:16px;--e-global-typography-heading_xl-font-size:40px;--e-global-typography-heading_l-font-size:32px;--e-global-typography-heading_m-font-size:32px;--e-global-typography-heading_s-font-size:16px;}.elementor-kit-7 button,.elementor-kit-7 input[type="button"],.elementor-kit-7 input[type="submit"],.elementor-kit-7 .elementor-button{font-size:32px;}.elementor-kit-7 label{font-size:var( --e-global-typography-heading_m-font-size );line-height:var( --e-global-typography-heading_m-line-height );}.elementor-kit-7 input:not([type="button"]):not([type="submit"]),.elementor-kit-7 textarea,.elementor-kit-7 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap, body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.edit-mode, body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}}:root { --Hone:Syne; } /* Start custom CSS *//* Kill all underlines globally in Elementor */ .elementor-kit-7 a, .elementor-kit-7 a:hover, .elementor-kit-7 a:focus, .elementor-kit-7 .elementor-button, .elementor-kit-7 .elementor-text-editor a { text-decoration: none !important; border-bottom: none !important; box-shadow: none !important; } /* Specifically targets the 'hover' underline some themes force */ .elementor-kit-7 a:after { display: none !important; } .elementor-kit-7 a:hover { opacity: 0.8; transition: 0.3s ease; } /* Push Uncle Ron product info away from the edges */ .elementor-widget-woocommerce-products .product { padding-left: 15px !important; padding-right: 15px !important; padding-bottom: 20px !important; } /* Ensure the button doesn't touch the bottom edge */ .elementor-button { margin-bottom: 10px !important; } /* Force Pagination to Show and Look Good on Mobile */ .woocommerce-pagination { display: block !important; text-align: center; margin-top: 40px; padding-bottom: 50px; clear: both; } /* Style the Numbers so they are easy to tap */ .woocommerce-pagination ul.page-numbers { display: inline-flex; list-style: none; padding: 0; border: 1px solid #ddd; border-radius: 4px; } .woocommerce-pagination ul.page-numbers li { border-right: 1px solid #ddd; } .woocommerce-pagination ul.page-numbers li:last-child { border-right: none; } .woocommerce-pagination ul.page-numbers li a, .woocommerce-pagination ul.page-numbers li span { padding: 12px 18px; display: block; text-decoration: none; font-weight: bold; color: #333; /* Change this to your brand color */ } /* Highlight the current page */ .woocommerce-pagination ul.page-numbers li span.current { background-color: #ff6600; /* Uncle Ron Orange? */ color: #fff; } /* Fix for Elementor Shop Pagination */ .elementor-pagination { display: block !important; visibility: visible !important; } .elementor-pagination a.page-numbers { pointer-events: auto !important; cursor: pointer !important; } /* Prevents the 'double-tap' issue on mobile */ .woocommerce-pagination .page-numbers li { display: inline-block !important; } /* Make product titles white and easier to read */ .woocommerce ul.products li.product .woocommerce-loop-product__title { color: #ffffff !important; font-size: 1.1rem !important; font-weight: bold; } /* Make price stand out */ .woocommerce ul.products li.product .price { color: #ff8c00 !important; /* Uncle Ron Gold/Yellow? */ } /* Make "Select Options" buttons look cleaner */ .woocommerce ul.products li.product .button { background-color: #ffffff !important; color: #000000 !important; border-radius: 4px; text-transform: uppercase; font-weight: bold; } /* Add a shadow and "Card" feel to each product box */ .woocommerce ul.products li.product { background-color: #1a1a1a !important; /* Slightly lighter than pure black */ padding: 15px !important; border-radius: 12px !important; /* Smooths the corners */ transition: all 0.3s ease-in-out !important; /* Makes the hover smooth */ /* The Shadow: Horizontal, Vertical, Blur, Spread, Color */ box-shadow: 0px 10px 30px rgba(255, 255, 255, 0.05) !important; } /* Hover Effect: Make the box "lift" when someone mouses over it */ .woocommerce ul.products li.product:hover { transform: translateY(-5px); /* Moves the box up slightly */ box-shadow: 0px 15px 40px rgba(255, 255, 255, 0.12) !important; /* Brightens the shadow */ border: 1px solid rgba(255, 255, 255, 0.2); /* Adds a subtle rim light */ } /* Fix for product images inside the shadowed box */ .woocommerce ul.products li.product img { border-radius: 8px !important; margin-bottom: 15px !important; } /* --- MOBILE FIRST STYLES (Phones) --- */ @media (max-width: 767px) { .woocommerce ul.products li.product { background-color: #161616 !important; /* Soft black card */ border-radius: 15px !important; padding: 12px !important; margin-bottom: 20px !important; border: 1px solid #222 !important; /* Subtle outline for definition */ /* Softer glow for mobile screens */ box-shadow: 0px 8px 20px rgba(255, 255, 255, 0.04) !important; /* Make sure 2-column layout looks clean */ width: 48% !important; float: left !important; margin-right: 2% !important; } /* Fix image sizing on mobile cards */ .woocommerce ul.products li.product img { border-radius: 10px !important; margin-bottom: 10px !important; } /* Make the "Select Options" button easier to tap with a thumb */ .woocommerce ul.products li.product .button { padding: 12px 5px !important; font-size: 11px !important; letter-spacing: 1px; width: 100% !important; } } /* --- DESKTOP ADJUSTMENTS (Laptops/PCs) --- */ @media (min-width: 768px) { .woocommerce ul.products li.product:hover { transform: translateY(-8px); /* The "Lift" effect on hover */ box-shadow: 0px 15px 40px rgba(255, 255, 255, 0.1) !important; border-color: rgba(255, 255, 255, 0.2) !important; } } /* --- FORCE EQUAL HEIGHT BOXES --- */ ul.products { display: flex !important; flex-wrap: wrap !important; list-style: none !important; padding: 0 !important; margin: 0 !important; } .woocommerce ul.products li.product { display: flex !important; flex-direction: column !important; height: auto !important; /* Let them grow together */ justify-content: space-between !important; /* Pushes buttons to the bottom */ flex: 1 1 48% !important; /* For Mobile: 2 per row */ margin: 1% !important; box-sizing: border-box !important; } /* On Desktop: 4 per row, still equal height */ @media (min-width: 992px) { .woocommerce ul.products li.product { flex: 1 1 23% !important; margin: 1% !important; } } /* Keep the image at the top and the button at the very bottom */ .woocommerce ul.products li.product .woocommerce-loop-product__title { flex-grow: 1 !important; /* This pushes the price/button down */ margin-bottom: 10px !important; } .woocommerce ul.products li.product .price { margin-bottom: 15px !important; display: block !important; } .woocommerce ul.products li.product .button { margin-top: auto !important; /* The "Magic" that aligns all buttons at the bottom */ width: 100% !important; text-align: center !important; } /* ========================================================= UNCLE RON: DARK MODE BRUTALIST CSS FOR ELEMENTOR ========================================================= */ /* --- 1. THE CONTAINERS & CARDS (DARK MODE) --- */ /* Add 'brutalist-card' to any Elementor Column or Container */ .brutalist-card { background-color: #0A0A0A !important; /* Deep black background */ border: 3px solid #FFFFFF !important; /* Sharp white border */ border-radius: 0px !important; /* Kills all rounded corners */ box-shadow: 6px 6px 0px 0px #E5880E !important; /* Signature Orange shadow */ color: #FFFFFF !important; /* Forces text inside to be white */ transition: transform 0.2s ease, box-shadow 0.2s ease; } /* Hover effect: makes the box lift up when someone hovers */ .brutalist-card:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0px 0px #FFFFFF !important; /* Shadow flashes white */ } /* --- 2. ORANGE ACCENT CONTAINERS --- */ /* Add 'brutalist-card-orange' for standout sections */ .brutalist-card-orange { background-color: #E5880E !important; /* Orange background */ border: 3px solid #FFFFFF !important; /* White border */ border-radius: 0px !important; box-shadow: 6px 6px 0px 0px #000000 !important; /* Black shadow */ color: #000000 !important; /* Black text */ } /* --- 3. WOOCOMMERCE & ELEMENTOR BUTTONS --- */ /* Add 'brutalist-btn' to any button, or it will auto-apply to WooCommerce buttons */ .brutalist-btn, .woocommerce button.button.alt, .woocommerce a.button.alt, .woocommerce input.button.alt { background-color: #E5880E !important; /* Orange button */ color: #000000 !important; /* Black text */ border: 2px solid #FFFFFF !important; /* White border */ border-radius: 0px !important; padding: 15px 30px !important; font-family: 'Inter', sans-serif !important; font-weight: 900 !important; text-transform: uppercase !important; letter-spacing: 2px !important; box-shadow: 4px 4px 0px 0px #FFFFFF !important; /* White shadow */ transition: all 0.2s ease !important; } .brutalist-btn:hover, .woocommerce button.button.alt:hover, .woocommerce a.button.alt:hover, .woocommerce input.button.alt:hover { background-color: #FFFFFF !important; /* Flips to white on hover */ color: #000000 !important; box-shadow: 0px 0px 0px 0px #000000 !important; /* Shadow clicks down */ transform: translate(4px, 4px) !important; /* Button pushes down into the shadow */ } /* --- 4. UTILITY BADGES --- */ /* Add 'brutalist-badge' to small text widgets to create tags */ .brutalist-badge { background-color: #000000 !important; color: #E5880E !important; /* Orange text */ padding: 4px 12px !important; font-family: 'JetBrains Mono', monospace !important; font-size: 12px !important; font-weight: bold !important; text-transform: uppercase !important; letter-spacing: 2px !important; border: 1px solid #E5880E !important; /* Orange border */ display: inline-block !important; }/* End custom CSS */