/* ========================================================================== Brand Override — Orange & Dark Charcoal theme Loaded last in so it wins the cascade over Astra/Elementor inline CSS. ========================================================================== */ :root { --brand-orange: #f5951e; --brand-orange-dark: #e07b00; --brand-orange-soft: #ffb347; --brand-charcoal: #1c222e; --brand-charcoal-2: #262d3b; --brand-ink: #1e293b; --brand-muted: #334155; --brand-surface: #f6f7f9; } /* --- Remap Astra global palette --- */ :root { --ast-global-color-0: var(--brand-orange) !important; --ast-global-color-1: var(--brand-orange-dark) !important; --ast-global-color-2: var(--brand-ink) !important; --ast-global-color-3: var(--brand-muted) !important; --ast-global-color-5: var(--brand-surface) !important; } /* --- Remap Elementor global palette --- */ :root { --e-global-color-astglobalcolor0: var(--brand-orange) !important; --e-global-color-astglobalcolor1: var(--brand-orange-dark) !important; --e-global-color-astglobalcolor2: var(--brand-ink) !important; --e-global-color-astglobalcolor3: var(--brand-muted) !important; } /* --- Links --- */ a { color: var(--brand-orange); } a:hover, a:focus { color: var(--brand-orange-dark); } /* --- Header: dark charcoal bar --- */ .ast-primary-header-bar, .main-header-bar, .site-header .ast-primary-header-bar { background-color: var(--brand-charcoal) !important; border-bottom: 3px solid var(--brand-orange) !important; } .main-header-bar .site-title, .main-header-bar .site-title a, .ast-site-identity .site-title a { color: #ffffff !important; } /* --- Primary navigation on dark header --- */ .ast-builder-menu-1 .menu-item > .menu-link, .main-header-menu .menu-item > .menu-link, .main-header-menu .menu-link { color: #f1f3f7 !important; font-weight: 600 !important; letter-spacing: .2px; } .ast-builder-menu-1 .menu-item:hover > .menu-link, .main-header-menu .menu-item:hover > .menu-link, .main-header-menu .menu-item.current-menu-item > .menu-link { color: var(--brand-orange) !important; background: transparent !important; } /* mobile menu toggle */ .ast-mobile-menu-trigger-minimal, .main-header-menu-toggle { color: var(--brand-orange) !important; } /* --- Buttons: solid orange with pill shape --- */ .ast-button, .button, button, input[type="button"], input[type="submit"], input[type="reset"], .wp-block-button__link, .elementor-button, .e-search-submit, .wp-block-search__button { background-color: var(--brand-orange) !important; border-color: var(--brand-orange) !important; color: #ffffff !important; border-radius: 8px !important; transition: background-color .2s ease, transform .15s ease, box-shadow .2s ease !important; } .ast-button:hover, .button:hover, button:hover, input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover, .wp-block-button__link:hover, .elementor-button:hover, .e-search-submit:hover, .wp-block-search__button:hover { background-color: var(--brand-orange-dark) !important; border-color: var(--brand-orange-dark) !important; color: #ffffff !important; box-shadow: 0 8px 20px -8px rgba(224,123,0,.7) !important; transform: translateY(-1px); } /* --- Override hardcoded Elementor accents (yellow / red / purple) --- */ .elementor-element.elementor-element-b35c287 .e-search-submit { background-color: var(--brand-orange) !important; } /* yellow diagonal dividers -> orange */ .elementor-element.elementor-element-bb430ad, .elementor-element.elementor-element-19e4dcc { --divider-color: var(--brand-orange) !important; } .elementor-element.elementor-element-bb430ad > .elementor-widget-container, .elementor-element.elementor-element-19e4dcc > .elementor-widget-container { box-shadow: -12px 30px 50px 5px rgba(224,123,0,.35) !important; } /* red post titles -> ink, with orange hover */ .elementor-element.elementor-element-ecb10fa .elementor-post__title, .elementor-element.elementor-element-ecb10fa .elementor-post__title a { color: var(--brand-ink) !important; } .elementor-element.elementor-element-ecb10fa .elementor-post__title a:hover { color: var(--brand-orange) !important; } /* purple slide fallback -> charcoal */ .swiper-slide-bg { background-color: var(--brand-charcoal) !important; } /* soft grey feature band -> keep light, add subtle warmth */ .elementor-element.elementor-element-6cfe9c8:not(.elementor-motion-effects-element-type-background) { background-color: #fbf7f0 !important; } /* --- Post / product cards --- */ .elementor-post { background: #ffffff; border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px -18px rgba(28,34,46,.4); transition: transform .2s ease, box-shadow .2s ease; } .elementor-post:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -18px rgba(28,34,46,.55); } .elementor-post__text { padding: 18px 20px; } /* --- Swiper nav arrows --- */ .elementor-swiper-button { color: var(--brand-orange) !important; } /* --- Footer accents --- */ .site-footer a:hover { color: var(--brand-orange) !important; } /* --- Selection --- */ ::selection { background-color: var(--brand-orange); color: #fff; }