/* Former Divi Custom CSS. Loaded before the portal experience styles. */
.et_pb_menu--with-logo .et_pb_menu__menu > nav > ul > li > a { padding-top: 0; padding-bottom: 0; }
.et_pb_menu .et_pb_menu__menu > nav > ul > li { align-items: center; }
#main-header, header#main-header.et-fixed-header { box-shadow: none !important; }
#page-container #top-header { margin: 20px 50px; border-radius: 10px; }
#main-header { margin: 20px 0; }
.myspio-design h1 { font-size: clamp(3rem, 8vw, 9.375rem); line-height: 1.08; overflow-wrap: anywhere; max-width: 100%; }
.myspio-design :is(h2,h3,h4,h5), .myspio-design .et_pb_module :is(h2,h3,h4,h5) {
    font-family: var(--spio-body); font-weight: 600; text-transform: uppercase; line-height: 1.2;
}
.myspio-design h2 { font-size: clamp(1.75rem, 3.4vw, 2.875rem); }
.myspio-design h3 { font-size: clamp(1.5rem, 2.7vw, 2.25rem); }
.myspio-design h4 { font-size: clamp(1.25rem, 2.2vw, 1.875rem); }
.myspio-design h5 { font-size: 1.5rem; }
/* Portal headings retain their own component typography. */
.myspio-design .myspio-app :is(h2,h3,h4,h5) { font-family: var(--spio-display); text-transform: none; }
h1 strong { background: linear-gradient(90deg, #9fd63a, #869dfa); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: bold; }
.ff-message-success { border: none !important; box-shadow: none !important; }
.mobile_menu_bar::before { color: var(--spio-navy) !important; }
form.cart label[for="nyp-1"] { display: block; margin-bottom: 6px; }
.nyp-input { display: block; box-sizing: border-box; width: 100%; max-width: 300px; margin-bottom: 10px; padding: 20px; border: 0; border-bottom: 2px solid #ccd4df; border-radius: 10px; background: var(--spio-cloud); color: var(--spio-navy); font: 400 1.5rem/1.3 var(--spio-body); transition: border-color .2s, background-color .2s; }
.nyp-input:focus { outline: 2px solid var(--spio-blue); outline-offset: 3px; border-bottom-color: var(--spio-navy); background: #fff; }
form.cart .single_add_to_cart_button { display: block; width: 100%; max-width: 300px; margin-top: 10px; }
@media (max-width: 980px) {
    #page-container #top-header { margin: 0 !important; border-radius: 0 0 20px 20px !important; }
    #main-header { margin: 0; }
    #et-info { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
    #et-info :is(#et-info-phone,#et-info-email,.et-info-phone,.et-info-email) { flex: 1; text-align: center; overflow-wrap: anywhere; }
    .two-columns .et_pb_column { width: 50% !important; }
    .three-columns .et_pb_column { width: 33.333% !important; }
    .four-columns .et_pb_column { width: 25% !important; }
    :is(.two-columns,.three-columns,.four-columns) { display: flex; flex-wrap: wrap; }
    :is(.two-columns,.three-columns,.four-columns) .et_pb_column { margin-right: 0; min-width: 0; }
}
@media (forced-colors: active) { h1 strong { background: none; -webkit-text-fill-color: currentColor; } }
