.elementor-kit-17{--e-global-color-primary:#0776BC;--e-global-color-secondary:#F26624;--e-global-color-text:#7A7A7A;--e-global-color-accent:#EF233C;--e-global-color-269b811:#014068;--e-global-color-6c018e0:#004E49;--e-global-color-6d4b255:#FFB703;--e-global-color-03273c0:#FF9EC2;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;font-family:"Source Sans Pro", Sans-serif;--e-page-transition-entrance-animation:e-page-transition-fade-out;--e-page-transition-exit-animation:e-page-transition-fade-in-left;--e-page-transition-animation-duration:1500ms;}.elementor-kit-17 e-page-transition{background-color:var( --e-global-color-primary );}.elementor-kit-17 h1{font-family:"Montserrat", Sans-serif;font-size:54px;font-weight:700;}.elementor-kit-17 h2{font-family:"Montserrat", Sans-serif;font-size:42px;font-weight:500;}.elementor-kit-17 h3{font-family:"Montserrat", Sans-serif;font-size:32px;}.elementor-kit-17 h4{font-family:"Montserrat", Sans-serif;font-size:24px;}.elementor-kit-17 h5{font-family:"Montserrat", Sans-serif;}.elementor-kit-17 h6{font-family:"Montserrat", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --dark-blue:#014068; --sctn-cta_darkbluebg:#014068; --font-page-body:Source Sans Pro; --page-width-80:80%; --subtle-grey-bg:#F2F4F8; --cr-card-hover-lift:-6px; --yellow:#FFB703; --pg-bdtxt-col:#666666; --pd-stn-top:25px; --pd-stn-bottom:25px; --red-pill:#EF233C; --pill-dblue:#014068; --pg-bodytxt-width:720px; --mg-pafterhead-tp:15px; --mg--clrstn-tpbtm:50px; --pd--clrstn-tpbtm:50px; --mg-cards-tpbtm:35px; --wd-2clm-cards:1000px; --wd-4clm-cards:1400px; --primary-blue:#0776BC; --green:#004E49; } /* Start custom CSS */h1, h2, h3, h4, h5, h6 { margin-top: 1.5em; margin-bottom: 0.1em; } /* Optional: don't add top margin when heading is the first element in a container */ h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0; } .elementor-widget-text-editor h1, .elementor-widget-text-editor h2, .elementor-widget-text-editor h3, .elementor-widget-text-editor h4, .elementor-widget-text-editor h5, .elementor-widget-text-editor h6 { margin-bottom: 0.3em !important; } .elementor-widget-text-editor h1 { margin-top: 1em !important; } .elementor-widget-text-editor h2 { margin-top: 1.2em !important; } .elementor-widget-text-editor h3 { margin-top: 1.3em !important; } .elementor-widget-text-editor h4, .elementor-widget-text-editor h5, .elementor-widget-text-editor h6 { margin-top: 1.5em !important; } /* ========================================================================== CloudRock — Brand Utilities Global reusable classes (prefix: cr-). Edit here once; applies site-wide. Naming: all CloudRock brand utilities use the .cr- prefix. Do not mix with other prefixes. Keep new utilities under this header. ========================================================================== */ /* -------------------------------------------------------------------------- cr-highlight — text highlight: orange block, white text Brand Secondary #F26624. Headings only (white-on-orange clears WCAG AA at heading size, not body). box-decoration-break keeps the block clean when the phrase wraps across lines. Usage (classic Text Editor widget, needs raw HTML — Atomic widgets can't): Let's talk. -------------------------------------------------------------------------- */ .cr-highlight { background-color: #F26624; /* Secondary / brand orange */ color: #FFFFFF; padding: 0 0.15em; box-decoration-break: clone; -webkit-box-decoration-break: clone; } /* ===================================================================== .cr-post-highlight — rev 3 (lighter tint) --------------------------------------------------------------------- WHERE THIS GOES: Elementor → Site Settings → Custom CSS (replaces the rev 2 block). CHANGE FROM REV 2: Tint lightened #FBC08A -> #FDE0C4 (soft peach). Still black text, still AAA (13.8:1). Sits quieter against the #F7F5F2 page ground so it reads as "notice this," not as a button. Two orange jobs stay separate: • Strong #F26624 = ACTION (CTAs, buttons). "Click me." • Light #FDE0C4 = ATTENTION (post skim path). "Notice me." USAGE NOTE: wrap only the pertinent phrase, not the whole sentence. The highlight marks the part a skimmer must catch, not the full line. ===================================================================== */ .cr-post-highlight { background-color: #FDE0C4; /* soft peach tint of brand orange #F26624 */ color: #1A1A1A; /* near-black text — 13.8:1 contrast, AAA */ font-weight: 600; /* weight optional for a11y, kept for skim emphasis */ padding: 0.05em 0.28em; border-radius: 3px; -webkit-box-decoration-break: clone; box-decoration-break: clone; } /* Keep links legible if a highlight ever wraps an anchor */ .cr-post-highlight a, .cr-post-highlight a:visited { color: #014068; /* dark blue — reads on the light tint */ text-decoration: underline; } /* Benefit card hover: small lift + deeper shadow (all three cards) */ .elementor .gc-9d8c985f13171355:hover { transform: translateY(-6px); box-shadow: 0 16px 34px rgba(1, 64, 104, 0.16); } /* Touch devices: no lift */ @media (hover: none) { .elementor .gc-9d8c985f13171355:hover { transform: none; box-shadow: 0 6px 20px rgba(1, 64, 104, 0.08); } }/* End custom CSS */