/* Solid graphite push plates, one worn brass edge, and an open glowing arrow.
   Shared by navigation, calls to action, and form submission controls. */
:root {
  --workshop-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23cbb78e' stroke-width='1.6' stroke-linecap='square'%3E%3Cpath d='M5 19 19 5M6 5h13v13'/%3E%3C/svg%3E");
  --workshop-arrow-lit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff0ca' stroke-width='1.8' stroke-linecap='square'%3E%3Cpath d='M5 19 19 5M6 5h13v13'/%3E%3C/svg%3E");
}
.workshop-button.workshop-button {
  --control-ink: #ece3d2;
  --key-size: 42px;
  --key-offset: 8px;
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  width: auto;
  max-width: 100%;
  min-height: 62px;
  padding: 17px 75px 17px 24px;
  border: 1px solid #a88b586b;
  border-radius: 4px;
  color: #ece3d2;
  background: linear-gradient(115deg, #151a1bc9, #24272791), var(--workshop-metal) center / 310px;
  box-shadow: inset 0 1px 0 #eed29b26, inset 0 -2px 3px #0008, 0 6px 14px #0005;
  font: 500 21px/1.15 "Barlow Condensed", sans-serif;
  letter-spacing: .025em;
  text-align: left;
  text-decoration: none;
  text-shadow: 0 2px 1px #000;
  cursor: pointer;
  overflow: visible;
  transform: none;
  transition: transform .16s ease, border-color .2s, box-shadow .2s, color .2s;
  -webkit-tap-highlight-color: transparent;
}
.workshop-button::before {
  content: '';
  position: absolute;
  inset: 0;
  border: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse at 88% 50%, #e7b56620, transparent 70%);
  opacity: 0;
  transition: opacity .2s ease;
  pointer-events: none;
}
.workshop-button:not(input)::after,
.workshop-submit-wrap::after {
  content: '';
  position: absolute;
  right: var(--key-offset, 8px);
  top: 50%;
  width: var(--key-size, 42px);
  height: var(--key-size, 42px);
  transform: translateY(-50%);
  border: 0;
  border-radius: 0;
  background: var(--workshop-arrow) center / 23px no-repeat;
  box-shadow: none;
  filter: drop-shadow(0 1px 1px #0008);
  pointer-events: none;
  transition: filter .2s;
}
.workshop-button.workshop-button:hover,
.workshop-button.workshop-button:focus-visible {
  --control-ink: #fff0d2;
  color: #fff0d2;
  border-color: #d3b079bd;
  background: linear-gradient(115deg, #242622b8, #292c2891), var(--workshop-metal) center / 310px;
  box-shadow: inset 0 1px 0 #ffe1a540, inset 0 -2px 3px #0008, 0 6px 16px #0005, 0 0 20px #dab17024;
  transform: none;
}
.workshop-button:hover::before,
.workshop-button:focus-visible::before {
  opacity: 1;
}
.workshop-button:hover::after,
.workshop-button:focus-visible::after,
.workshop-submit-wrap:hover::after,
.workshop-submit-wrap:focus-within::after {
  background-image: var(--workshop-arrow-lit);
  filter: drop-shadow(0 0 3px #ffdc92) drop-shadow(0 0 9px #e7af4e80);
}
.workshop-button.workshop-button:active {
  transform: translateY(2px);
  box-shadow: inset 0 2px 5px #0009, inset 0 1px 0 #b99b6633, 0 1px 0 #0b0f10, 0 2px 5px #0006;
}
.workshop-button:focus-visible { outline: 2px solid #e4c187; outline-offset: 5px; }
.workshop-button .button-overlay { display: none; }
.workshop-button .nav-button-text-wrapper { display: contents; color: var(--control-ink) !important; }
.workshop-button .nav-button-text-wrapper .nav-button-text:first-child { display: none; }
.workshop-button .nav-button-text,
.workshop-button .nav-button-text.navtwo,
.workshop-button .button-text,
.workshop-button .button-text.is-black {
  position: static;
  color: var(--control-ink) !important; /* Never inherit a legacy animation's black label color. */
  font: inherit;
  letter-spacing: inherit;
  transform: none !important; /* Replaces the old Webflow rolling-label animation. */
}
.workshop-button > span[aria-hidden="true"] { display: none; }
.workshop-button.mainbutton { margin-left: 0; margin-right: 0; }
.nav-component .workshop-button,
.site-header .workshop-button {
  --key-size: 29px;
  --key-offset: 6px;
  min-height: 43px;
  padding: 11px 48px 11px 16px;
  font-size: 17px;
  letter-spacing: .02em;
  margin: 0;
  box-shadow: inset 0 1px 0 #eed29b26, 0 3px 8px #0004;
}
.nav-component .workshop-button::after,
.site-header .workshop-button::after { background-size: 17px, auto; }
.workshop-submit-wrap { position: relative; display: inline-block; max-width: 100%; }
.workshop-submit-wrap:active::after { margin-top: 2px; }
.workshop-button:disabled { cursor: wait; opacity: .65; }
.project-link {
  border: 1px solid #ac8c5566;
  background: linear-gradient(140deg, #161b1be6, #2d3027bb), var(--workshop-metal) center / 280px;
  box-shadow: inset 0 2px 0 #ddc38e44, inset 0 -4px 6px #000b, 0 3px 0 #101314, 0 6px 16px #0007;
}
.project-link:hover { border-color: #ddba7b; box-shadow: inset 0 2px 0 #ddc38e66, inset 0 -4px 6px #000b, 0 3px 0 #101314, 0 0 22px #d4a66230; }
.project-link:hover .project-link-text { color: #fff0cc; text-shadow: 0 0 10px #e0a75566; }
@media (max-width: 760px) {
  .workshop-button.workshop-button { font-size: 19px; padding-left: 20px; min-height: 58px; }
  .nav-component .workshop-button, .site-header .workshop-button { min-height: 42px; font-size: 15px; padding: 10px 46px 10px 13px; }
  .workshop-button.primary-button { margin-left: 0; margin-right: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .workshop-button.workshop-button, .workshop-button::before, .workshop-button::after, .workshop-submit-wrap::after { transition: none; }
  .workshop-button::before, .workshop-button::after, .workshop-submit-wrap::after { animation: none !important; }
  .workshop-button.workshop-button:hover, .workshop-button.workshop-button:active { transform: none; }
}
