/* Approved sitewide button treatment, October 19, 2026.
   Two inset shadows define the lit top and shaded lower edge; two outer shadows
   add contact and soft depth. Existing fills, borders, radii and dimensions stay intact. */
html[data-button-style="raised"] :is(
  .btn, .nav-cta, .nav-toggle, .campaign-return-banner__link,
  .campaign-return-banner__dismiss, .endorsement-sig,
  .footer-socials a, .button, .header-cta, .connect-link
) {
  --button-highlight: .32;
  --button-shade: .26;
  --button-contact: .18;
  --button-depth: .24;
  box-shadow:
    inset 0 1px 1px rgb(255 255 255 / var(--button-highlight)),
    inset 0 -2px 3px rgb(0 0 0 / var(--button-shade)),
    0 2px 3px rgb(0 0 0 / var(--button-contact)),
    0 5px 10px -4px rgb(0 0 0 / var(--button-depth));
}

/* Quieter depth for transparent and compact controls. */
html[data-button-style="raised"] :is(
  .btn-ghost, .btn-ghost-light, .nav-toggle, .endorsement-sig,
  .campaign-return-banner__dismiss, .footer-socials a, .button-outline
) {
  --button-highlight: .18;
  --button-shade: .13;
  --button-contact: .10;
  --button-depth: .14;
}

/* Keep the existing hover colors. No new animation or layout dimensions. */
html[data-button-style="raised"] :is(
  .btn, .nav-cta, .nav-toggle, .campaign-return-banner__link,
  .campaign-return-banner__dismiss, .endorsement-sig,
  .footer-socials a, .button, .header-cta, .connect-link
):active:not(:disabled) {
  box-shadow:
    inset 0 1px 1px rgb(255 255 255 / .18),
    inset 0 -1px 2px rgb(0 0 0 / .28),
    0 1px 2px rgb(0 0 0 / .16),
    0 2px 4px -2px rgb(0 0 0 / .20);
  transform: none;
}

html[data-button-style="raised"] :is(
  .btn, .nav-cta, .nav-toggle, .campaign-return-banner__link,
  .campaign-return-banner__dismiss, .endorsement-sig,
  .footer-socials a, .button, .header-cta, .connect-link
):focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 4px;
}

html[data-button-style="raised"] :is(
  .hero, .final-cta, .endorsement, .campaign-return-banner,
  .site-header.is-over-hero:not(.is-scrolled)
) :is(.btn, .nav-cta, .nav-toggle, .campaign-return-banner__link,
  .campaign-return-banner__dismiss, .endorsement-sig):focus-visible {
  outline-color: var(--ivory);
}

@media (max-width: 720px) {
  html[data-button-style="raised"] .primary-nav.is-open a:focus-visible {
    outline-color: var(--green);
  }
}

/* Disabled buttons retain their existing behavior without raised depth. */
html[data-button-style="raised"] :is(
  .btn, .nav-cta, .nav-toggle, .campaign-return-banner__link,
  .campaign-return-banner__dismiss, .endorsement-sig,
  .footer-socials a, .button, .header-cta, .connect-link
):disabled {
  box-shadow: none;
  transform: none;
  opacity: .55;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  html[data-button-style="raised"] :is(
    .btn, .nav-cta, .nav-toggle, .campaign-return-banner__link,
    .campaign-return-banner__dismiss, .endorsement-sig,
    .footer-socials a, .button, .header-cta, .connect-link, .btn .arrow
  ) {
    transition: none !important;
    animation: none !important;
    transform: none;
  }
}

@media (forced-colors: active) {
  html[data-button-style="raised"] :is(
    .btn, .nav-cta, .nav-toggle, .campaign-return-banner__link,
    .campaign-return-banner__dismiss, .endorsement-sig,
    .footer-socials a, .button, .header-cta, .connect-link
  ):focus-visible {
    outline-color: Highlight;
  }
}
