/* Editable brand tokens — change these to update site colors */ :root{ --brand-primary: #6B3FA0; /* main accent – royal violet */ --brand-primary-600: #4C2C79; /* darker accent (hover/focus) */ --brand-on-primary: #FFFFFF; /* text on primary */ --brand-surface: #111; /* light page background */ --brand-surface-2: #1d1d1d; /* lilac-tinted panels/cards */ --brand-text: #ffffff; /* deep slate body text */ /* Global button text color tokens */ --button-text-color: var(--brand-on-primary); --button-text-color-hover: var(--brand-on-primary); /* Map brand tokens to Duda variables used across the theme */ --color_1: var(--brand-primary); --color_2: var(--brand-primary-600); --color_3: var(--brand-surface); --color_4: var(--brand-surface-2); --color_5: #000000; /* kinetic lime – CTA/micro-accent */ --color_6: var(--brand-text); --color_7: #d9dcea; /* cool gray-lilac borders/dividers */ --color_8: #FFB547; /* amber highlight/badges */ } /* Enforce GLOBAL site palette (harsh): use homepage/root tokens everywhere */ #dm :root, #dm .dmBody, #dm .dmBody *:not(svg){ --color_1: var(--brand-primary) !important; --color_2: var(--brand-primary-600) !important; --color_3: var(--brand-surface) !important; --color_4: var(--brand-surface-2) !important; --color_5: #000000 !important; --color_6: var(--brand-text) !important; --color_7: #d9dcea !important; --color_8: #FFB547 !important; /* Button text variable aliases */ --btn-text-color: var(--color_6) !important; --btn-hover-text-color: var(--color_6) !important; --button-text-color: var(--color_6) !important; --button-text-color-hover: var(--color_6) !important; } /* Ensure common accent applications follow the primary color */ #dm a, #dm .dmButtonLink .text, #dm .dmWidget.flexButton .text, #dm .dmNavigation .navItemText, #dm .dmFooter a { color: var(--color_6) !important; } #dm .dmButtonLink.arrow.primary, #dm .button_2, #dm [data-element-type="dButtonLinkId"].primary { background-color: var(--color_1) !important; color: var(--button-text-color) !important; } #dm .dmButtonLink.arrow.primary:hover, #dm .button_2:hover, #dm [data-element-type="dButtonLinkId"].primary:hover { background-color: var(--color_2) !important; } /* Universal button text color selectors (all devices) */ #dm .dmButtonLink, #dm .dmButtonLink .text, #dm [data-element-type="dButtonLinkId"], #dm [data-element-type="dButtonLinkId"] .text, #dm .flexButton, #dm .flexButton .text, #dm .button_2, #dm .button_2 .text, #dm .dmCallButton, #dm .dmCallButton .text { color: var(--button-text-color) !important; fill: var(--button-text-color) !important; } #dm .dmButtonLink:hover, #dm .dmButtonLink:hover .text, #dm [data-element-type="dButtonLinkId"]:hover, #dm [data-element-type="dButtonLinkId"]:hover .text, #dm .flexButton:hover, #dm .flexButton:hover .text, #dm .button_2:hover, #dm .button_2:hover .text, #dm .dmCallButton:hover, #dm .dmCallButton:hover .text { color: var(--button-text-color-hover) !important; fill: var(--button-text-color-hover) !important; } /* Ensure icons inside buttons inherit the text color */ #dm .dmButtonLink [class*="icon-"], #dm .dmButtonLink .icon, #dm .dmButtonLink svg, #dm .flexButton [class*="icon-"], #dm .flexButton .icon, #dm .flexButton svg, #dm .button_2 [class*="icon-"], #dm .button_2 .icon, #dm .button_2 svg { color: currentColor !important; fill: currentColor !important; } /* Stronger hero outline (readability) */ :root{ --hero-stroke-color: rgba(255,255,255,0.98); --hero-stroke-width: 1.8px; } .hero__brand-outline{ text-shadow: 0 1px 0 var(--hero-stroke-color), 0 -1px 0 var(--hero-stroke-color), 1px 0 0 var(--hero-stroke-color), -1px 0 0 var(--hero-stroke-color), 1px 1px 0 var(--hero-stroke-color), -1px 1px 0 var(--hero-stroke-color), 1px -1px 0 var(--hero-stroke-color), -1px -1px 0 var(--hero-stroke-color), 0 0 1px var(--hero-stroke-color), 0 0 2px var(--hero-stroke-color) !important; -webkit-text-stroke: var(--hero-stroke-width) var(--hero-stroke-color) !important; paint-order: stroke fill; } @media (prefers-contrast: more){ :root { --hero-stroke-width: 2px; } } /* Site-wide component mappings (edit tokens above to change outputs) */ /* Headers, links, nav */ #dm .dmHeader, #dm .desktopTopNav .dmNavigation, #dm .dmNavigation a { background-color: var(--color_3) !important; color: var(--color_6) !important; } #dm .dmNavigation .navItemText { color: var(--color_6) !important; } #dm .dmNavigation li a.currentPage .navItemText { color: var(--color_6) !important; } #dm a { color: var(--color_1) !important; } #dm a:hover { color: var(--color_2) !important; } /* Prevent desktop nav from wrapping (keep a single row) */ @media (min-width: 1025px){ #dm .desktopTopNav .dmNavigation, #dm .desktopTopNav .dmNavigation > ul, #dm .desktopTopNav .dmNavigation > .unifiednav__container, #dm .dmHeader .unifiednav__container { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; white-space: nowrap !important; overflow: visible !important; min-width: 0 !important; flex: 1 1 auto !important; gap: 12px; } /* Add breathing room between nav and the header CTA button */ #dm .dmHeader .unifiednav__container { margin-right: 18px !important; } #dm .dmHeader .dmButtonLink.dmOnlyButton { margin-left: 18px !important; } #dm .dmHeader .dmButtonLink { margin-left: 12px !important; } #dm .desktopTopNav .dmNavigation .unifiednav__item-wrap, #dm .desktopTopNav .dmNavigation .unifiednav__item, #dm .desktopTopNav .dmNavigation .unifiednav__item .nav-item-text { white-space: nowrap !important; min-width: 0 !important; } /* Slightly reduce horizontal padding so items fit without wrapping */ #dm .desktopTopNav .dmNavigation .unifiednav__item { padding-inline: 8px !important; min-width: 0 !important; } /* Keep separators inline */ #dm .desktopTopNav .dmNavigation .unifiednav__separator { display: inline-block !important; white-space: nowrap !important; } } /* Desktop dropdown sub-nav: left-align items and use full-width dividers */ #dm .dmBody:not(.dm-home-page) .desktopTopNav .dmNavigation, #dm .dmBody:not(.dm-home-page) .desktopTopNav .dmNavigation > ul, #dm .dmBody:not(.dm-home-page) .desktopTopNav .dmNavigation > .unifiednav__container, #dm .dmBody:not(.dm-home-page) .dmHeader .unifiednav__container { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; white-space: nowrap !important; overflow: visible !important; min-width: 0 !important; gap: 12px; } #dm .dmBody:not(.dm-home-page) .desktopTopNav .dmNavigation .unifiednav__item-wrap, #dm .dmBody:not(.dm-home-page) .desktopTopNav .dmNavigation .unifiednav__item, #dm .dmBody:not(.dm-home-page) .desktopTopNav .dmNavigation .unifiednav__item .nav-item-text { white-space: nowrap !important; min-width: 0 !important; } #dm .dmBody:not(.dm-home-page) .desktopTopNav .dmNavigation .unifiednav__item { padding-inline: 8px !important; min-width: 0 !important; } #dm .dmBody:not(.dm-home-page) .dmHeader .unifiednav__container { margin-right: 18px !important; } #dm .dmBody:not(.dm-home-page) .dmHeader .dmButtonLink.dmOnlyButton { margin-left: 18px !important; } #dm .dmBody:not(.dm-home-page) .dmHeader .dmButtonLink { margin-left: 12px !important; } @media (min-width: 1025px){ #dm .unifiednav__container.unifiednav__container_sub-nav { text-align: left !important; display: block !important; } #dm .unifiednav__container_sub-nav .unifiednav__item-wrap { display: block !important; text-align: left !important; border-bottom: 2px solid var(--color_1) !important; margin: 0 !important; } #dm .unifiednav__container_sub-nav .unifiednav__item { display: block !important; text-align: left !important; width: 100% !important; padding: 10px 18px !important; } #dm .unifiednav__container_sub-nav .unifiednav__item .nav-item-text { display: block !important; text-align: left !important; } /* remove short centered underline if present */ #dm .unifiednav__container_sub-nav .unifiednav__item::after, #dm .unifiednav__container_sub-nav .unifiednav__item .nav-item-text::after, #dm .unifiednav__container_sub-nav .unifiednav__item .nav-item-text::before { content: none !important; } /* full-width divider between items */ #dm .unifiednav__container_sub-nav .unifiednav__item-wrap:last-child { border-bottom: 0 !important; } } /* Strengthen non‑home selectors to catch all header nav containers */ @media (min-width: 1025px){ #dm .dmBody:not(.dm-home-page) nav.unifiednav .unifiednav__container { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; white-space: nowrap !important; overflow: visible !important; min-width: 0 !important; gap: 12px; } #dm .dmBody:not(.dm-home-page) nav.unifiednav .unifiednav__item-wrap, #dm .dmBody:not(.dm-home-page) nav.unifiednav .unifiednav__item, #dm .dmBody:not(.dm-home-page) nav.unifiednav .unifiednav__item .nav-item-text { white-space: nowrap !important; min-width: 0 !important; } } /* Buttons */ #dm .dmButtonLink.arrow.primary, #dm .button_2, #dm [data-element-type="dButtonLinkId"].primary { background-color: var(--color_1) !important; color: var(--color_5) !important; border-color: var(--color_1) !important; } #dm .dmButtonLink.arrow.primary:hover, #dm .button_2:hover, #dm [data-element-type="dButtonLinkId"].primary:hover { background-color: var(--color_2) !important; border-color: var(--color_2) !important; } /* Headings & accents */ #dm h1, #dm h2, #dm h3, #dm h4, #dm h5, #dm h6 { color: var(--color_6) !important; } #dm .accent, #dm .font-accent, #dm .highlight { color: var(--color_1) !important; } /* Cards / surfaces */ #dm .dmRespRow, #dm .dmRespCol, #dm .u_HomeServices { background-color: transparent; } #dm .card, #dm .tile, #dm .panel { background-color: var(--color_3) !important; color: var(--color_6) !important; border-color: var(--color_4) !important; } /* Forms */ #dm input, #dm textarea, #dm select { border-color: var(--color_4) !important; background-color: #ffffff !important; color: #111 !important; } #dm input:focus, #dm textarea:focus, #dm select:focus { outline: none; border-color: var(--color_1) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--color_1) 25%, transparent) !important; } #dm .dmformsubmit input[type=submit] { background-color: var(--color_3) !important; color: var(--button-text-color) !important; } #dm .dmformsubmit input[type=submit]:hover { background-color: var(--color_2) !important; } /* Footer */ #dm .dmFooter { background-color: var(--color_3) !important; color: var(--color_6) !important; } #dm .dmFooter a { color: var(--color_1) !important; } #dm .dmFooter a:hover { color: var(--color_2) !important; } /* Utility */ #dm .text-primary { color: var(--color_1) !important; } #dm .bg-primary { background-color: var(--color_1) !important; color: var(--button-text-color) !important; } #dm .border-primary { border-color: var(--color_1) !important; } /* Accordions: force black borders sitewide (hash classes vary; use stable data-* attrs) */ #dm [data-grab="accordion-container"] { border-color: #000 !important; border-top-color: #000 !important; border-right-color: #000 !important; border-bottom-color: #000 !important; border-left-color: #000 !important; } #dm [data-auto="runtime-accordion-widget"] [data-grab="accordion-item-title-wrapper"] { border-color: #000 !important; border-top-color: #000 !important; border-right-color: #000 !important; border-bottom-color: #000 !important; border-left-color: #000 !important; }