:root { --menu-font-family: inherit; --menu-font-size: var(--text-m, 16px); --menu-font-weight: 500; --menu-line-height: 1.5; --menu-text-transform: none; --menu-letter-spacing: 0; --menu-color: var(--light); --menu-hover-color: var(--yellow); --menu-active-color: var(--yellow); --dropdown-bg: var(--light); --dropdown-border: none; --dropdown-border-radius: 4px; --dropdown-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); --dropdown-padding: 8px 0; --dropdown-min-width: 200px; --dropdown-offset: 8px; --dropdown-separator: none; --dropdown-arrow-size: .5em; --dropdown-arrow-color: var(--menu-color); --dropdown-arrow-hover-color: var(--menu-hover-color); --dropdown-font-family: var(--menu-font-family); --dropdown-font-size: var(--menu-font-size); --dropdown-font-weight: var(--menu-font-weight); --dropdown-line-height: var(--menu-line-height); --dropdown-text-transform: var(--menu-text-transform); --dropdown-letter-spacing: var(--menu-letter-spacing); --dropdown-color: var(--light); --dropdown-hover-color: var(--light-30); --dropdown-hover-bg: var(--primary-10); --dropdown-active-color: var(--light); --dropdown-active-bg: var(--primary-10); --dropdown-item-padding: 8px 20px; --mobile-toggle-color: var(--dark); --mobile-menu-font-family: var(--menu-font-family); --mobile-menu-font-size: var(--menu-font-size); --mobile-menu-font-weight: var(--menu-font-weight); --mobile-menu-line-height: var(--menu-line-height); --mobile-menu-text-transform: var(--menu-text-transform); --mobile-menu-letter-spacing: var(--menu-letter-spacing); --mobile-menu-color: var(--light); --mobile-menu-hover-color: var(--light-70); --mobile-menu-active-color: var(--light-70); --mobile-dropdown-toggle-color: var(--light); --mobile-dropdown-color: var(--light-70); --mobile-dropdown-hover-color: var(--light-30); --mobile-dropdown-active-color: var(--light-30); --mobile-dropdown-font-family: var(--mobile-menu-font-family); --mobile-dropdown-font-size: var(--mobile-menu-font-size); --mobile-dropdown-font-weight: var(--mobile-menu-font-weight); --mobile-dropdown-line-height: var(--mobile-menu-line-height); --mobile-dropdown-text-transform: var(--mobile-menu-text-transform); --mobile-dropdown-letter-spacing: var(--mobile-menu-letter-spacing); } .bricks-color-text { color: var(--text); } .bricks-color-accent { color: var(--accent); } .bricks-color-orange { color: var(--orange); } .bricks-color-yellow { color: var(--yellow); } .bricks-color-teal { color: var(--teal); }  :where(.bricks-nav-menu > .bricks-menu-item > a), :where(.bricks-nav-menu > .bricks-menu-item > .brx-submenu-toggle > a), :where(.brx-nav-nested-items > .menu-item > .brxe-text-link), :where(.brx-nav-nested-items > .menu-item > .brx-submenu-toggle > .brxe-text-link), :where(.brx-nav-nested-items > .brxe-dropdown > .brx-submenu-toggle > span) { font-family: var(--menu-font-family); font-size: var(--menu-font-size); font-weight: var(--menu-font-weight); line-height: var(--menu-line-height); text-transform: var(--menu-text-transform); letter-spacing: var(--menu-letter-spacing); color: var(--menu-color); text-decoration: none; transition: color 0.2s ease; } :where(.bricks-nav-menu > .bricks-menu-item > a:hover), :where(.bricks-nav-menu > .bricks-menu-item > .brx-submenu-toggle > a:hover), :where(.brx-nav-nested-items > .menu-item > .brxe-text-link:hover), :where(.brx-nav-nested-items > .menu-item > .brx-submenu-toggle > .brxe-text-link:hover), :where(.brx-nav-nested-items > .brxe-dropdown:hover > .brx-submenu-toggle > span) { color: var(--menu-hover-color); } :where(.bricks-nav-menu > .bricks-menu-item.current-menu-item > a), :where(.bricks-nav-menu > .bricks-menu-item.current-menu-item > .brx-submenu-toggle > a), :where(.brx-nav-nested-items > .menu-item.current-menu-item > .brxe-text-link), :where(.brx-nav-nested-items > .menu-item.current-menu-item > .brx-submenu-toggle > .brxe-text-link), :where(.brx-nav-nested-items > .brxe-dropdown.current-menu-item > .brx-submenu-toggle > span) { color: var(--menu-active-color); }  :where(.bricks-nav-menu .brx-submenu-toggle .menu-item-icon), :where(.brxe-nav-nested .brx-submenu-toggle svg) { width: var(--dropdown-arrow-size); height: var(--dropdown-arrow-size); color: var(--dropdown-arrow-color); transition: color 0.2s ease; } :where(.bricks-nav-menu .bricks-menu-item:hover .brx-submenu-toggle .menu-item-icon), :where(.brxe-nav-nested .brxe-dropdown:hover .brx-submenu-toggle svg) { color: var(--dropdown-arrow-hover-color); }  :where(.bricks-nav-menu .sub-menu), :where(.brxe-nav-nested .brx-dropdown-content) { background-color: var(--dropdown-bg); border: var(--dropdown-border); border-radius: var(--dropdown-border-radius); box-shadow: var(--dropdown-box-shadow); padding: var(--dropdown-padding); min-width: var(--dropdown-min-width); margin-top: var(--dropdown-offset); }  :where(.bricks-nav-menu .sub-menu > .bricks-menu-item > a), :where(.brx-dropdown-content .menu-item > .brxe-text-link) { font-family: var(--dropdown-font-family); font-size: var(--dropdown-font-size); font-weight: var(--dropdown-font-weight); line-height: var(--dropdown-line-height); text-transform: var(--dropdown-text-transform); letter-spacing: var(--dropdown-letter-spacing); color: var(--dropdown-color); padding: var(--dropdown-item-padding); text-decoration: none; transition: color 0.2s ease, background-color 0.2s ease; } :where(.bricks-nav-menu .sub-menu > .bricks-menu-item > a:hover), :where(.brx-dropdown-content .menu-item > .brxe-text-link:hover) { color: var(--dropdown-hover-color); background-color: var(--dropdown-hover-bg); } :where(.bricks-nav-menu .sub-menu > .bricks-menu-item.current-menu-item > a), :where(.brx-dropdown-content .menu-item.current-menu-item > .brxe-text-link) { color: var(--dropdown-active-color); background-color: var(--dropdown-active-bg); } :where(.bricks-nav-menu .sub-menu > .bricks-menu-item + .bricks-menu-item), :where(.brx-dropdown-content .menu-item + .menu-item) { border-top: var(--dropdown-separator); }  :where(.bricks-mobile-menu-toggle), :where(.brxe-nav-nested > .brxe-toggle) { color: var(--mobile-toggle-color); }  :where(.bricks-mobile-menu > .bricks-menu-item > a), :where(.bricks-mobile-menu > .bricks-menu-item > .brx-submenu-toggle > a) { font-family: var(--mobile-menu-font-family); font-size: var(--mobile-menu-font-size); font-weight: var(--mobile-menu-font-weight); line-height: var(--mobile-menu-line-height); text-transform: var(--mobile-menu-text-transform); letter-spacing: var(--mobile-menu-letter-spacing); color: var(--mobile-menu-color); text-decoration: none; transition: color 0.2s ease; } :where(.bricks-mobile-menu > .bricks-menu-item > a:hover), :where(.bricks-mobile-menu > .bricks-menu-item > .brx-submenu-toggle > a:hover) { color: var(--mobile-menu-hover-color); } :where(.bricks-mobile-menu > .bricks-menu-item.current-menu-item > a), :where(.bricks-mobile-menu > .bricks-menu-item.current-menu-item > .brx-submenu-toggle > a) { color: var(--mobile-menu-active-color); }  :where(.bricks-mobile-menu .brx-submenu-toggle .menu-item-icon) { color: var(--mobile-dropdown-toggle-color); transition: transform 0.2s ease; } :where(.bricks-mobile-menu .brx-submenu-toggle button[aria-expanded="true"] .menu-item-icon) { transform: scaleY(-1); }  :where(.bricks-mobile-menu .sub-menu > .bricks-menu-item > a) { font-family: var(--mobile-dropdown-font-family); font-size: var(--mobile-dropdown-font-size); font-weight: var(--mobile-dropdown-font-weight); line-height: var(--mobile-dropdown-line-height); text-transform: var(--mobile-dropdown-text-transform); letter-spacing: var(--mobile-dropdown-letter-spacing); color: var(--mobile-dropdown-color); text-decoration: none; transition: color 0.2s ease; } :where(.bricks-mobile-menu .sub-menu > .bricks-menu-item > a:hover) { color: var(--mobile-dropdown-hover-color); } :where(.bricks-mobile-menu .sub-menu > .bricks-menu-item.current-menu-item > a) { color: var(--mobile-dropdown-active-color); }  @media (max-width: 767px) { :where(.brx-nav-nested-items > .menu-item > .brxe-text-link), :where(.brx-nav-nested-items > .menu-item > .brx-submenu-toggle > .brxe-text-link), :where(.brx-nav-nested-items > .brxe-dropdown > .brx-submenu-toggle > span) { font-family: var(--mobile-menu-font-family); font-size: var(--mobile-menu-font-size); font-weight: var(--mobile-menu-font-weight); line-height: var(--mobile-menu-line-height); text-transform: var(--mobile-menu-text-transform); letter-spacing: var(--mobile-menu-letter-spacing); color: var(--mobile-menu-color); } :where(.brx-nav-nested-items > .menu-item > .brxe-text-link:hover), :where(.brx-nav-nested-items > .menu-item > .brx-submenu-toggle > .brxe-text-link:hover), :where(.brx-nav-nested-items > .brxe-dropdown:hover > .brx-submenu-toggle > span) { color: var(--mobile-menu-hover-color); } :where(.brx-nav-nested-items > .menu-item.current-menu-item > .brxe-text-link), :where(.brx-nav-nested-items > .menu-item.current-menu-item > .brx-submenu-toggle > .brxe-text-link), :where(.brx-nav-nested-items > .brxe-dropdown.current-menu-item > .brx-submenu-toggle > span) { color: var(--mobile-menu-active-color); } :where(.brxe-nav-nested .brx-submenu-toggle svg) { color: var(--mobile-dropdown-toggle-color); transition: transform 0.2s ease; } :where(.brxe-nav-nested .brx-submenu-toggle button[aria-expanded="true"] svg) { transform: scaleY(-1); } :where(.brx-dropdown-content .menu-item > .brxe-text-link) { font-family: var(--mobile-dropdown-font-family); font-size: var(--mobile-dropdown-font-size); font-weight: var(--mobile-dropdown-font-weight); line-height: var(--mobile-dropdown-line-height); text-transform: var(--mobile-dropdown-text-transform); letter-spacing: var(--mobile-dropdown-letter-spacing); color: var(--mobile-dropdown-color); } :where(.brx-dropdown-content .menu-item > .brxe-text-link:hover) { color: var(--mobile-dropdown-hover-color); } :where(.brx-dropdown-content .menu-item.current-menu-item > .brxe-text-link) { color: var(--mobile-dropdown-active-color); } }  .bricks-mobile-menu-toggle { color: var(--mobile-toggle-color); }  .bricks-mobile-menu > .bricks-menu-item > a, .bricks-mobile-menu > .bricks-menu-item > .brx-submenu-toggle > a { font-family: var(--mobile-menu-font-family); font-size: var(--mobile-menu-font-size); font-weight: var(--mobile-menu-font-weight); line-height: var(--mobile-menu-line-height); text-transform: var(--mobile-menu-text-transform); letter-spacing: var(--mobile-menu-letter-spacing); color: var(--mobile-menu-color); text-decoration: none; transition: color 0.2s ease; } .bricks-mobile-menu > .bricks-menu-item > a:hover, .bricks-mobile-menu > .bricks-menu-item > .brx-submenu-toggle > a:hover { color: var(--mobile-menu-hover-color); } .bricks-mobile-menu > .bricks-menu-item.current-menu-item > a, .bricks-mobile-menu > .bricks-menu-item.current-menu-item > .brx-submenu-toggle > a { color: var(--mobile-menu-active-color); }  .bricks-mobile-menu .brx-submenu-toggle .menu-item-icon { color: var(--mobile-dropdown-toggle-color); transition: transform 0.2s ease; } .bricks-mobile-menu .brx-submenu-toggle button[aria-expanded="true"] .menu-item-icon { transform: scaleY(-1); }  .bricks-mobile-menu .sub-menu > .bricks-menu-item > a { font-family: var(--mobile-dropdown-font-family); font-size: var(--mobile-dropdown-font-size); font-weight: var(--mobile-dropdown-font-weight); line-height: var(--mobile-dropdown-line-height); text-transform: var(--mobile-dropdown-text-transform); letter-spacing: var(--mobile-dropdown-letter-spacing); color: var(--mobile-dropdown-color); text-decoration: none; transition: color 0.2s ease; } .bricks-mobile-menu .sub-menu > .bricks-menu-item > a:hover { color: var(--mobile-dropdown-hover-color); } .bricks-mobile-menu .sub-menu > .bricks-menu-item.current-menu-item > a { color: var(--mobile-dropdown-active-color); }  .brx-sticky:not(.on-scroll) + main { margin-top: var(--header-height); }  :where(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button) { &.bricks-background-orange, &.bricks-color-orange { --sfx-btn-color: var(--btn-orange-bg, var(--orange, #ea591b)); --sfx-btn-color-fg: var(--btn-orange-fg, var(--orange-fg, #fff)); } &.bricks-background-yellow, &.bricks-color-yellow { --sfx-btn-color: var(--btn-yellow-bg, var(--yellow, #fbbb10)); --sfx-btn-color-fg: var(--btn-yellow-fg, var(--yellow-fg, #111)); } &.bricks-background-teal, &.bricks-color-teal { --sfx-btn-color: var(--btn-teal-bg, var(--teal, #0d9488)); --sfx-btn-color-fg: var(--btn-teal-fg, var(--teal-fg, #fff)); } }  :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button).outline.bricks-color-orange, :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button).outline.bricks-color-yellow, :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button).outline.bricks-color-teal { color: var(--sfx-btn-color); border-color: var(--sfx-btn-color); } :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button).outline.bricks-color-orange:hover, :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button).outline.bricks-color-yellow:hover, :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button).outline.bricks-color-teal:hover { color: var(--sfx-btn-color-fg); border-color: var(--sfx-btn-color); } :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button)[class*="bricks-background-"]:not(.bricks-background-text) { border-color: var(--sfx-btn-color); } :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button)[class*="bricks-background-"]:not(.bricks-background-text):hover { border-color: color-mix(in oklab, var(--sfx-btn-color) 85%, var(--sfx-btn-mix, black)); } :is(.brxe-button.bricks-button, .brxe-button.btn, button.bricks-button)[class*="bricks-background-"]:not(.bricks-background-text):active { border-color: color-mix(in oklab, var(--sfx-btn-color) 75%, var(--sfx-btn-mix, black)); }