/* 全ページ共通CTA：ページ固有CSSの後に読み込みます。 */
:root {
  --cta-brown: #9f7865;
  --cta-brown-hover: #b18f7e;
}
/* 既存のページ固有指定より優先し、通常色も統一 */
html body .header .header__cta,
html body .floating-cta,
html body .letter-product__button {
  background-color: var(--cta-brown);
  color: #fff;
  transition: background-color 0.25s ease, opacity 0.3s ease, translate 0.3s ease;
}
@media (hover: hover) {
  html body .header .header__cta:hover,
  html body .floating-cta:hover,
  html body .letter-product__button:hover {
    background-color: var(--cta-brown-hover);
    color: #fff;
  }
}
html body .header .header__cta:focus-visible,
html body .floating-cta:focus-visible,
html body .letter-product__button:focus-visible {
  background-color: var(--cta-brown-hover);
  color: #fff;
}
@media (prefers-reduced-motion: reduce) {
  html body .header .header__cta,
  html body .floating-cta,
  html body .letter-product__button { transition: none; }
}