loses its bottom padding and the text sits flush on the panel edge. Padding the wrapper puts it out of that rule's reach entirely — no !important arms race. */ .gg-home .gg-othernote { margin: 22px 0 0 !important; padding: 15px 18px; border-left: 2px solid rgba(168,85,247,.5); background: rgba(168,85,247,.07); border-radius: 0 12px 12px 0; } .gg-home .gg-othernote p { margin: 0; padding: 0; font-size: .92rem; line-height: 1.65; color: var(--gg-body-2); } /* --- WhatsApp widget avatar ----------------------------------------------- The brand logo is a SQUARE neon sign on a near-black ground, so the old treatment (white circle, image inset to 84% and letterboxed by object-fit: contain) framed it in a white ring and shrank the wordmark until it was unreadable at 40px. A circle cannot help here either: the neon frame's corners sit outside any inscribed circle, so they would always be clipped. Squaring off the tile with a soft radius lets the whole sign show, fills it edge to edge, and drops the white ground the logo never needed. */ .gg-wa__avatar { width: 44px; height: 44px; border-radius: 12px; background: #0B0C14; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); } .gg-wa__avatar img { width: 100%; height: 100%; object-fit: cover; } /* ========================================================================== CLIENT ROUND (2026-08-25): Meet the Team bios broke when new copy was added The new bios are multi-paragraph. The bio is a shortcode ATTRIBUTE, and wpautop runs one priority BEFORE do_shortcode, so it turned the blank lines between paragraphs into `
` while they were still inside the attribute — closing `
` after paragraph one and leaving the rest loose in the card, unstyled and outside the clamp. gg_team_member_bio_ paragraphs() in functions.php now rebuilds the bio as a `.description` DIV of real paragraphs; these rules give those paragraphs their rhythm. Salient's own `.row .col .team-member p.description` (borders + 15px margins) no longer matches a DIV, so the box starts clean and needs no overrides. ========================================================================== */ .gg-home .gg-teamcard .team-member .description p { margin: 0 0 .85em; padding: 0; font-size: inherit; line-height: inherit; color: inherit; } .gg-home .gg-teamcard .team-member .description p:last-child { margin-bottom: 0; } /* ========================================================================== CLIENT ROUND (2026-08-27) 1. WhatsApp CTA in the Contact hero — WhatsApp green with a green glow 2. Audiences section — Corporate / Private / Public as three equal cards ========================================================================== */ /* --- 1. WhatsApp button --------------------------------------------------- Keyed to its own class (like gg-btn--kids) rather than to the wa.me href, so the skin is opt-in per button: the other 18 WhatsApp links on the site stay as they are until the class is added to them. White on #25D366 measures 1.98:1 and is unreadable, so the label goes dark green (7.3:1). The "glow" is the same elevated-shadow language the purple primary already uses, pushed a little further and tinted green. */ .gg-home .nectar-button.gg-btn--wa { background: var(--gg-wa) !important; box-shadow: 0 0 22px -2px rgba(37,211,102,.55), 0 14px 34px -12px rgba(37,211,102,.95) !important; } .gg-home .nectar-button.gg-btn--wa, .gg-home .nectar-button.gg-btn--wa span { color: #06301A !important; } .gg-home .nectar-button.gg-btn--wa:hover { transform: translateY(-2px); box-shadow: 0 0 30px 0 rgba(37,211,102,.7), 0 20px 44px -10px var(--gg-wa) !important; } /* --- 2. three audience cards ---------------------------------------------- The row was two 440px-basis cards plus a full-width strip underneath. Three cards at that basis (3x440 + 2x24 = 1368) overflow the 1240 container and wrap 2+1, so the basis comes down; they still collapse to 2-up and 1-up on the way down. */ .gg-home .gg-aud__grid .row_col_wrap_12_inner > .wpb_column { flex: 1 1 300px; min-width: 280px; } /* Public card: continues the blue -> purple progression into magenta rather than inventing a colour from outside the palette. */ .gg-home .gg-card--pub { background: linear-gradient(155deg, #2A1030 0%, #45184A 100%); border: 1px solid rgba(232,121,249,.32); } .gg-home .gg-card--pub:hover { transform: translateY(-6px); box-shadow: 0 34px 70px -30px rgba(232,121,249,.5); } .gg-home .gg-card--pub .img-with-aniamtion-wrap::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(42,16,48,.05) 35%, #2A1030 100%); } .gg-home .gg-card--pub .gg-card__badge p { color: #F3B9FB; border: 1px solid rgba(232,121,249,.4); } .gg-home .gg-card--pub .gg-card__text p { color: #E2C6E8; margin: 0; } .gg-home .nectar-button.gg-link--pink, .gg-home .nectar-button.gg-link--pink span { color: var(--gg-pink) !important; } .gg-home .nectar-button.gg-link--pink:hover span { color: #fff !important; } /* Three cards wrap to 2-up then 1-up on the site's existing breakpoints. The max-width matters: without it flex-grow stretches a lone wrapped card to the full row, so the third box would sit double-width under the other two. */ @media only screen and (max-width: 999px) { .gg-home .gg-aud__grid .row_col_wrap_12_inner > .wpb_column { flex: 1 1 calc(50% - 12px); max-width: calc(50% - 12px); } } @media only screen and (max-width: 690px) { .gg-home .gg-aud__grid .row_col_wrap_12_inner > .wpb_column { flex: 1 1 100%; max-width: 100%; } } /* --- 3. Contact hero: the enquiry-form note moved up under the buttons ----- Contact page only. The note itself already carries the tinted panel + left rule it uses further down the page; over the hero photograph that tint is too faint to read, so it gets a dark backing here and nothing else changes. Salient paints a row background wrapper on every inner row and the two other hero rows already hide theirs — this one needs the same or a black band shows behind the note. */ .gg-home .gg-phero__contact .row-bg-wrap { display: none !important; } .gg-home .gg-phero__contact { margin: 22px auto 0 !important; max-width: 720px; } .gg-home .gg-phero__contact .gg-othernote { margin: 0 !important; padding: 14px 18px; text-align: left; background: rgba(10,10,16,.62); border-left: 2px solid rgba(168,85,247,.65); border-radius: 0 14px 14px 0; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); } @media only screen and (max-width: 690px) { .gg-home .gg-phero__contact .gg-othernote { padding: 12px 14px; } }