/* BUTTONS — loaded last, no overrides */
button,
.btn,
a.btn,
a.cta,
.btn-white,
.btn-green,
a.btn-white,
a.btn-green,
.nav-cta,
a.nav-cta {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  text-transform: uppercase;
  letter-spacing: 0.15em;
  font-size: 0.75rem;
  font-weight: 500;
  padding: 14px 28px;
  border-radius: 0 !important;
  border: none !important;
  outline: none !important;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  transition: background 0.2s ease;
  font-family: 'DM Sans', system-ui, sans-serif;
  position: relative;
}

button::after,
.btn::after,
a.btn::after,
a.cta::after,
.btn-white::after,
.btn-green::after,
.nav-cta::after {
  content: "";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.4em;
  height: 0.4em;
  background: currentColor;
  align-self: center;
  transition: width 0.2s ease, height 0.2s ease;
}

button:hover::after,
.btn:hover::after,
a.btn:hover::after,
a.cta:hover::after,
.btn-white:hover::after,
.btn-green:hover::after,
a.btn-white:hover::after,
a.btn-green:hover::after,
.nav-cta:hover::after,
a.nav-cta:hover::after {
  width: 0.8em;
  height: 2px;
  animation: btn-line-spin 0.5s ease 0.2s forwards;
}

@keyframes btn-line-spin {
  from { transform: translateY(-50%) rotate(0deg); }
  to { transform: translateY(-50%) rotate(360deg); }
}

/* White variant */
button.btn-white,
.btn-white {
  background: #ffffff;
  color: #1a1a2e;
}
button.btn-white:hover,
.btn-white:hover {
  background: #f0f0f0;
  color: #1a1a2e;
}

/* Green variant */
button.btn-green,
.btn-green {
  background: #a3c1ad;
  color: #1a1a2e;
}
button.btn-green:hover,
.btn-green:hover {
  background: #8fb39a;
  color: #1a1a2e;
}

/* Portal: staff sign-in to the GS Group CRM (crm.gs-group.io), in the footer bar beside the copyright */
.footer-bottom { grid-template-columns: 1fr 1fr 1fr; }
.footer-bottom .footer-portal { justify-self: center; }
a.footer-portal {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 10px 100%, 0 calc(100% - 10px));
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 18px;
  font-family: 'DM Sans', system-ui, sans-serif; font-size: 0.72rem; font-weight: 500;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: #fff; background: rgba(255,255,255,0.1);
  transition: background 0.2s ease, color 0.2s ease;
}
a.footer-portal::before {
  content: ""; width: 0.8em; height: 0.8em; flex: none;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4'%3E%3Crect x='4' y='11' width='16' height='10' rx='1'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4'%3E%3Crect x='4' y='11' width='16' height='10' rx='1'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center / contain no-repeat;
}
a.footer-portal:hover, a.footer-portal:focus-visible { background: #a3c1ad; color: #1a1a2e; }
@media (max-width: 600px) {
  .footer-bottom { grid-template-columns: 1fr; }
}
