/* ========================================================================== Synthex Labs theme for the GemPages template. Palette taken from the 5-Amino-1MQ label: blue -> purple gradient, acid-yellow highlight, white type on the gradient. Load AFTER gem-core.css and after the section styles. ========================================================================== */ :root { --sx-blue: #2B3FE0; --sx-blue-light: #3D4FE8; --sx-indigo: #4A45E4; --sx-purple: #8B3FD0; --sx-purple-dk: #6B2FB0; --sx-yellow: #E8FF3C; --sx-tint-1: #EEF0FF; --sx-tint-2: #D8DCFF; --sx-gradient: linear-gradient(120deg, var(--sx-blue) 0%, var(--sx-indigo) 45%, var(--sx-purple) 100%); --sx-gradient-soft: linear-gradient(120deg, #EDEFFF 0%, #F1ECFF 100%); } /* NOTE on !important: GemPages paints backgrounds with `.gps-.gps.gpsil [style*="--bgi:"]{background-image:var(--bgi)}` — specificity (0,4,0), and the id differs per section, so a plain override cannot out-specify all thirteen of them. This is an override layer; it wins on purpose. */ /* --- hero backdrop: the signature blue -> purple wash -------------------- Four elements share --bgc:#ECEFFF. The two full-width backdrops (logo strip, hero) are direct children of a
; the other two are the "10 million bottles" pill and the money-back bar, nested in a
and carrying dark text — those must stay pale. Hence the child combinator. Verified: no text is painted directly on the two backdrops. */ .gps section > [style*="--bgc:#ECEFFF"] { background-image: linear-gradient(135deg, var(--sx-blue) 0%, var(--sx-indigo) 48%, var(--sx-purple) 100%) !important; } /* --- header wordmark: black artwork, now sitting on the gradient --------- */ .gps img[src*="Lable-02"] { filter: brightness(0) invert(1); } /* --- promo bar: the label's acid-yellow highlight ------------------------ It sits on the hero gradient, so a gradient of its own made it vanish. Yellow is the one accent the label uses on top of the wash. */ .gps [style*="--bgc:#4A45E4"] { background-image: none !important; background-color: var(--sx-yellow) !important; } .gps [style*="--bgc:#4A45E4"] * { color: #121212 !important; } /* --- filled badges (Save 25%, comparison row): white type on indigo ----- */ .gps [style*="--bg:#4A45E4"], .gps [style*="--bg:#4A45E4"] * { color: #fff !important; } /* --- primary buttons: black slab -> label gradient ----------------------- Matched by their fill variable, not by class: `--bg:transparent` buttons are text links (START CHAT, the phone number) and must stay unpainted. This sheet is injected at the end of , because the section