.sb-wel-card {
--sb-wel-cream:   #fdfaf2;
--sb-wel-border:  #e9dfc6;
--sb-wel-green:   #14532d;
--sb-wel-cta:     #1a6b45;
--sb-wel-cta-hov: #13573a;
--sb-wel-gold:    #a8873d;
--sb-wel-ink:     #24211b;
--sb-wel-muted:   #5f5a4e;
--sb-wel-quiet:   #948c7c;
--sb-wel-badge:   #eef0e2;
--sb-wel-leaf:    #aebd94; --sb-wel-serif: "Playfair Display", "Roboto Slab", Georgia, "Times New Roman", serif;
--sb-wel-sans:  "Lato", "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
} .sb-wel-overlay {
position: fixed !important;
inset: 0 !important;
z-index: 999990 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 16px !important;
margin: 0 !important;
box-sizing: border-box !important;
background: rgba(24, 20, 12, 0) !important;
opacity: 0 !important;
visibility: hidden !important;
transition: opacity .3s ease, background-color .3s ease, visibility .3s !important;
}
.sb-wel-overlay.sb-wel-open {
opacity: 1 !important;
visibility: visible !important;
background: rgba(24, 20, 12, .48) !important;
} .sb-wel-card {
position: relative !important;
box-sizing: border-box !important;
width: 100% !important;
max-width: 520px !important;
max-height: calc(100vh - 32px) !important;
overflow-x: hidden !important;
overflow-y: auto !important;
margin: 0 !important;
padding: 0 !important;
background: var(--sb-wel-cream) !important;
border: 1px solid var(--sb-wel-border) !important;
border-radius: 22px !important;
box-shadow: 0 24px 60px rgba(30, 24, 10, .28) !important;
text-align: center !important;
transform: translateY(18px) scale(.97) !important;
transition: transform .34s cubic-bezier(.2, .9, .3, 1.05) !important;
-webkit-overflow-scrolling: touch;
}
.sb-wel-overlay.sb-wel-open .sb-wel-card {
transform: translateY(0) scale(1) !important;
}
.sb-wel-inner {
position: relative !important;
z-index: 1 !important;
padding: 44px 40px 30px !important;
} .sb-wel-leaf {
position: absolute !important;
z-index: 0 !important;
display: block !important;
width: 172px !important;
height: 172px !important;
color: var(--sb-wel-leaf) !important;
pointer-events: none !important;
line-height: 0 !important;
}
.sb-wel-leaf svg {
display: block !important;
width: 100% !important;
height: 100% !important;
}
.sb-wel-leaf-tl {
top: 0 !important;
left: 0 !important;
} .sb-wel-leaf-br {
right: 0 !important;
bottom: 0 !important;
transform: rotate(180deg) !important;
} .sb-wel-close {
position: absolute !important;
z-index: 3 !important;
top: 16px !important;
right: 16px !important;
width: 38px !important;
height: 38px !important;
min-width: 0 !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
border-radius: 50% !important;
background: transparent !important;
color: var(--sb-wel-ink) !important;
font: 300 30px/38px var(--sb-wel-sans) !important;
text-align: center !important;
text-transform: none !important;
letter-spacing: 0 !important;
box-shadow: none !important;
cursor: pointer !important;
opacity: .7 !important;
transition: opacity .15s ease, background-color .15s ease !important;
}
.sb-wel-close:hover,
.sb-wel-close:focus {
opacity: 1 !important;
background: rgba(36, 33, 27, .06) !important;
outline: none !important;
}
.sb-wel-close:focus-visible {
box-shadow: 0 0 0 2px var(--sb-wel-cta) !important;
} .sb-wel-badge {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 96px !important;
height: 96px !important;
margin: 0 auto 22px !important;
padding: 0 !important;
border-radius: 50% !important;
background: var(--sb-wel-badge) !important;
color: var(--sb-wel-green) !important;
}
.sb-wel-badge svg {
display: block !important;
width: 46px !important;
height: 46px !important;
}
.sb-wel-badge img {
display: block !important;
max-width: 62% !important;
max-height: 62% !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
object-fit: contain !important;
} .sb-wel-eyebrow {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 14px !important;
margin: 0 0 16px !important;
padding: 0 !important;
color: var(--sb-wel-gold) !important;
font: 700 14px/1.3 var(--sb-wel-sans) !important;
letter-spacing: .3em !important;
text-transform: uppercase !important;
}
.sb-wel-eyebrow::before,
.sb-wel-eyebrow::after {
content: "" !important;
display: block !important;
flex: 0 0 30px !important;
height: 1px !important;
background: currentColor !important;
opacity: .8 !important;
} .sb-wel-amount {
display: block !important;
margin: 0 !important;
padding: 0 !important;
color: var(--sb-wel-green) !important;
font-family: var(--sb-wel-serif) !important;
font-size: clamp(52px, calc((100vw - 32px) * .205), 106px) !important;
font-weight: 900 !important;
font-variant-numeric: lining-nums !important;
font-feature-settings: "lnum" 1 !important;
line-height: .95 !important;
letter-spacing: -.015em !important;
text-transform: none !important;
white-space: nowrap !important;
}
.sb-wel-card h2.sb-wel-heading {
margin: 4px 0 18px !important;
padding: 0 !important;
border: 0 !important;
color: var(--sb-wel-ink) !important;
font-family: var(--sb-wel-sans) !important;
font-size: clamp(26px, calc((100vw - 32px) * .078), 40px) !important;
font-weight: 900 !important;
line-height: 1.15 !important;
letter-spacing: -.005em !important;
text-transform: none !important;
} .sb-wel-card.sb-wel-no-amount h2.sb-wel-heading {
margin-top: 0 !important;
color: var(--sb-wel-green) !important;
font-size: clamp(28px, 6.4vw, 38px) !important;
}
.sb-wel-text {
margin: 0 auto 26px !important;
padding: 0 !important;
max-width: 400px !important;
color: var(--sb-wel-muted) !important;
font: 400 18px/1.55 var(--sb-wel-sans) !important;
} .sb-wel-cta {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 12px !important;
box-sizing: border-box !important;
width: 100% !important;
min-height: 60px !important;
padding: 16px 24px !important;
margin: 0 0 14px !important;
border: 0 !important;
border-radius: 12px !important;
background: var(--sb-wel-cta) !important;
color: #fff !important;
font: 700 20px/1.2 var(--sb-wel-sans) !important;
letter-spacing: .005em !important;
text-align: center !important;
text-transform: none !important;
text-decoration: none !important;
box-shadow: 0 6px 16px rgba(20, 83, 45, .22) !important;
cursor: pointer !important;
transition: background-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
.sb-wel-cta svg {
flex: 0 0 auto !important;
width: 20px !important;
height: 20px !important;
transition: transform .18s ease !important;
}
.sb-wel-cta:hover,
.sb-wel-cta:focus {
background: var(--sb-wel-cta-hov) !important;
color: #fff !important;
outline: none !important;
}
.sb-wel-cta:hover svg {
transform: translateX(3px) !important;
}
.sb-wel-cta:active {
transform: translateY(1px) !important;
box-shadow: 0 3px 8px rgba(20, 83, 45, .2) !important;
}
.sb-wel-cta:focus-visible {
box-shadow: 0 0 0 3px rgba(26, 107, 69, .35), 0 6px 16px rgba(20, 83, 45, .22) !important;
}
.sb-wel-decline {
display: inline-block !important;
padding: 6px 8px !important;
margin: 0 !important;
border: 0 !important;
background: none !important;
color: var(--sb-wel-ink) !important;
font: 400 17px/1.4 var(--sb-wel-sans) !important;
text-transform: none !important;
letter-spacing: 0 !important;
text-decoration: underline !important;
text-underline-offset: 3px !important;
text-decoration-thickness: 1px !important;
box-shadow: none !important;
cursor: pointer !important;
opacity: .8 !important;
}
.sb-wel-decline:hover,
.sb-wel-decline:focus {
opacity: 1 !important;
outline: none !important;
}
.sb-wel-foot {
margin: 12px 0 0 !important;
padding: 0 !important;
color: var(--sb-wel-quiet) !important;
font: 400 15px/1.4 var(--sb-wel-sans) !important;
} @media (max-width: 480px) {
.sb-wel-inner {
padding: 38px 22px 24px !important;
}
.sb-wel-leaf {
width: 120px !important;
height: 120px !important;
}
.sb-wel-badge {
width: 78px !important;
height: 78px !important;
margin-bottom: 18px !important;
}
.sb-wel-badge svg {
width: 38px !important;
height: 38px !important;
}
.sb-wel-eyebrow {
font-size: 12px !important;
letter-spacing: .26em !important;
gap: 10px !important;
}
.sb-wel-eyebrow::before,
.sb-wel-eyebrow::after {
flex-basis: 20px !important;
}
.sb-wel-text {
font-size: 15.5px !important;
margin-bottom: 22px !important;
}
.sb-wel-decline {
font-size: 15.5px !important;
}
.sb-wel-foot {
font-size: 13.5px !important;
}
.sb-wel-cta {
min-height: 54px !important;
font-size: 17px !important;
}
} @media (max-height: 640px) {
.sb-wel-inner {
padding-top: 30px !important;
padding-bottom: 20px !important;
}
.sb-wel-badge {
width: 64px !important;
height: 64px !important;
margin-bottom: 12px !important;
}
.sb-wel-badge svg {
width: 32px !important;
height: 32px !important;
}
} @media (prefers-reduced-motion: reduce) {
.sb-wel-overlay,
.sb-wel-card,
.sb-wel-cta,
.sb-wel-cta svg {
transition: opacity .01s linear !important;
}
.sb-wel-card,
.sb-wel-overlay.sb-wel-open .sb-wel-card,
.sb-wel-cta:hover svg {
transform: none !important;
}
}