/* Site polish (Oct 2026 review): loaded last on every page. */

/* 1. Hero: headline reads as one sentence, quieter background */

/* 2. One primary button colour: lilac on dark, plum on light */
.connected-site .site-header .nav-cta { background: #60435b !important; color: #f6f0f4 !important; }
.connected-site .site-header.is-dark .nav-cta { background: #d1bdca !important; color: #2e242b !important; }
.connected-home .contact-form button[type="submit"] { background: #d1bdca !important; color: #2e242b !important; }
.connected-home .contact-form button[type="submit"]:hover { background: #e2d3dd !important; }

/* 3. Solid header on phones and tablets so text never shows through */
@media (max-width: 820px) {
  .site-header { background: #f4eee6 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  .site-header.is-dark { background: #19171a !important; }
}

/* 4. Fewer giant background words: keep only the page-intro ones */
.home-background-word, .about-background-word, .blog-wordmark, .lab-word,
.research-wordmarks, .closing-wordmark { display: none !important; }

/* 5. Even card spacing on phones */
@media (max-width: 640px) {
  .home-problem article { min-height: 0 !important; }
  .home-problem article p { margin-top: 10px !important; }
}

/* 6. Floating WhatsApp button */
.wa-float { position: fixed; right: 20px; bottom: 20px; z-index: 60; display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px 12px 14px; border-radius: 999px; background: #25d366; color: #0b2e1a; font: 700 .85rem var(--sans, system-ui); text-decoration: none; box-shadow: 0 10px 28px rgba(0, 0, 0, .22); transition: transform .2s, box-shadow .2s; }
.wa-float:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0, 0, 0, .28); }
.wa-float svg { width: 22px; height: 22px; fill: currentColor; }
@media (max-width: 640px) { .wa-float span { display: none; } .wa-float { padding: 13px; right: 16px; bottom: 16px; } }
.case-open .wa-float, body:has(dialog[open]) .wa-float { display: none; }
.form-whatsapp { display: inline-flex; align-items: center; gap: 6px; color: inherit; font-weight: 700; }

/* ===== Inverted colours for the moon/sun switch (generated from the rules above — keep at end of file) ===== */
html[data-theme="inverted"] .connected-home .contact-form button[type="submit"] { background: #d1bdca !important; color: #2e242b !important; }
html[data-theme="inverted"] .connected-home .contact-form button[type="submit"]:hover { background: #1f161d !important; }
html[data-theme="inverted"] .form-whatsapp { color: inherit; }
