/* Shared buttons for every product landing page.
   Use: btn btn-demo | btn btn-discount | btn btn-shop.
   Add btn-sm for compact desktop/header buttons.
   Page-specific placement belongs in the product stylesheet. */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  min-height: 52px;
  padding: 14px 23px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.4;
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .18s;
}
.btn.btn { font-family: Arial, Helvetica, sans-serif; font-size: 18px; font-weight: 900; }
.btn, .btn:hover, .btn:focus-visible, .btn:active { box-shadow: none; }
.btn:hover { transform: translateY(-2px); }
.btn:focus-visible { outline: 3px solid #037c7c; outline-offset: 5px; }
.btn-sm { min-height: 43px; padding: 10px 19px; }
.btn-demo { background: #77dddb; border-color: #62c9c7; color: #164746; }
.btn-demo-outline { background: #e8faf9; border-color: #62c9c7; color: #2b6e6b; }
.btn-discount { background: #d299dc; border-color: #c17fcb; color: #3a1f40; }
.btn-shop { background: #fe7aa7; border-color: #f0568e; color: #3d0f22; }
.btn-etsy { background: #ffd9ae; border-color: #f8c896; color: #8a5a2a; }
@media (max-width: 1050px) {
  .btn { padding: 13px 17px; }
}
@media (max-width: 760px) {
  .btn { min-height: 50px; padding: 13px 19px; }
}
@media (prefers-reduced-motion: reduce) {
  .btn { transition: none; }
}