/* Earlier footer layout, restored from the pre-premium site. */
.site-footer { padding:32px 0 19px; background: #143928; color: #d9e1d2; font: 400 13px/1.65 var(--sans); }
.site-footer .footer-invitation { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 38px; padding:8px 0 26px; margin-bottom: 29px; border-bottom: 1px solid #42604b; }
.site-footer .footer-invitation h2 { max-width: 24ch; font-size: 26px; color: var(--paper); }
.site-footer .footer-invitation p { max-width: 43ch; margin-bottom: 16px; }
.site-footer .actions { gap: 10px 19px; }
.site-footer .gold { background: #d3b66c; border-color: #d3b66c; color: #153b29; }
.site-footer .gold:hover { background: #e0c786; color: #153b29; }
.site-footer .text-link { color: var(--paper); text-decoration-color: #95a78d; }
.site-footer .footer-grid { display: grid; grid-template-columns: 1.1fr .8fr 1fr 1.4fr; gap: 26px; }
.site-footer .footer-grid h2 { font: 600 11px/1.5 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--paper); margin-bottom: 10px; }
.site-footer .footer-grid > div > a:not(:has(img)) { display: flex; align-items: center; width: fit-content; min-height: 36px; padding:5px 0; color: inherit; text-decoration: none; }
.site-footer .footer-grid a:hover { text-decoration: underline; text-underline-offset: 4px; }
.site-footer .footer-brand img { clip-path: inset(20% 0 22% 0); width: 152px; height: auto; margin-bottom: 16px; }
.site-footer .footer-brand p { max-width: 30ch; }
.site-footer .footer-address address { font: 400 13px/1.7 var(--sans); margin-top: 10px; }
.site-footer .footer-legal { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px 19px; padding-top: 16px; margin-top: 26px; border-top: 1px solid #42604b; color: #c0ccbb; font-size: 11px; line-height: 1.6; }
.site-footer .footer-legal p { max-width: 80ch; }
.site-footer :focus-visible { outline-color: #d3b66c; }

/* An alpha cutout lets the tablet sit directly on the section's ivory surface. */
.home-page .science-visual img { mix-blend-mode: normal; }

/* A quiet product-color key beneath the existing hero actions. */
.home-page .hero-description { max-width: 52ch; margin-bottom: 19px; font-size: 13px; line-height: 1.8; }
.home-page .hero-color-guide { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 13px; width: fit-content; margin-top: 19px; color: var(--body); font-size: 12px; line-height: 1.6; }
.home-page .hero-color-dots { display: flex; align-items: center; gap: 6px; flex: none; }
.home-page .hero-color-dots i { display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--product); }
.home-page .hero-color-guide:hover .hero-color-caption { text-decoration: underline; text-underline-offset: 4px; }

@media(max-width:1100px) {
  .site-footer .footer-grid { grid-template-columns: 1fr 1fr; gap: 26px 38px; }
}
@media(max-width:800px) {
  .site-footer .footer-invitation { grid-template-columns: 1fr; gap: 16px; }
}
@media(max-width:580px) {
  .site-footer .footer-grid { gap: 22px 19px; }
  .site-footer .footer-grid > :is(.footer-brand, .footer-address) { grid-column: 1 / -1; }
  .site-footer .footer-grid > div > a:not(:has(img)) { min-height: 44px; }
  .site-footer .footer-legal { flex-direction: column; }
  .home-page .hero-color-guide { gap: 8px; margin-top: 16px; }
  .home-page .hero-color-caption { flex-basis: 100%; }
}
@media(max-width:360px) {
  .site-footer .footer-grid { grid-template-columns: 1fr; }
  .home-page .hero-benefits { white-space: normal; }
}
