/* Crystal-cut glass CTA. Original six-sided geometry and optical facets.
   The mineral silhouette is the graphic identity; no circular badge or stock icon. */
.crystal-button {
  --crystal-cut:polygon(7% 0,93% 0,100% 50%,93% 100%,7% 100%,0 50%);
  display:inline-block;flex-shrink:0;position:relative;
  padding:0;border:0;background:transparent;appearance:none;-webkit-appearance:none;
  width:356px;height:84px;
  transform-origin:center;touch-action:manipulation;
}
.crystal-button__surface {
  position:relative;display:grid;place-items:center;
  width:100%;height:100%;padding:0 34px;
  clip-path:var(--crystal-cut);
  color:#f5f7f2;
  background:rgb(18 54 40 / .18);
  backdrop-filter:blur(14px) saturate(155%);
  -webkit-backdrop-filter:blur(14px) saturate(155%);
  transition:background .5s var(--ease),transform .4s var(--ease);
}
.crystal-button__optics {
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;overflow:visible;
}
.crystal-button__facets {
  transform-origin:center;
  transition:opacity .5s var(--ease);
}
.crystal-button__rim,.crystal-button__inner-rim {
  transition:stroke-opacity .5s var(--ease);
}
.crystal-button__label {
  position:relative;z-index:1;
  font-size:15px;line-height:1.3;font-weight:500;
  letter-spacing:.015em;white-space:nowrap;
  text-shadow:0 1px 10px rgb(0 0 0 / .24);
  transition:letter-spacing .5s var(--ease);
}
.crystal-button:focus-visible {
  outline:none;
}
.crystal-button:focus-visible .crystal-button__surface {
  background:rgb(18 54 40 / .55);
}
.crystal-button:focus-visible .crystal-button__rim {
  stroke-opacity:1;stroke-width:3;
}
.crystal-button:active .crystal-button__surface {transform:scale(.975)}
@media(hover:hover) and (pointer:fine) {
  .crystal-button:hover .crystal-button__surface {background:rgb(31 75 54 / .28)}
  .crystal-button:hover .crystal-button__rim {stroke-opacity:.95}
  .crystal-button:hover .crystal-button__inner-rim {stroke-opacity:.30}
  .crystal-button:hover .crystal-button__facets {opacity:.7}
  .crystal-button:hover .crystal-button__label {letter-spacing:.035em}
}
@media(max-width:1100px) {
  .crystal-button {width:318px;height:78px}
  .crystal-button__label {font-size:14px}
}
@media(max-width:767px) {
  .crystal-button {width:306px;max-width:100%;height:76px}
  .crystal-button__surface {padding:0 26px}
  .crystal-button__label {font-size:14px}
}
@media(max-width:359px) {
  .crystal-button {width:280px;height:72px}
  .crystal-button__label {font-size:13px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .crystal-button__surface {background:#245c46}
}

/* Solid light backgrounds: the same approved geometry, mineral ink and clear facets. */
.crystal-button--solid .crystal-button__surface {
  color:#103d2e;
  background:rgb(36 92 70 / .065);
  backdrop-filter:blur(14px) saturate(125%);
  -webkit-backdrop-filter:blur(14px) saturate(125%);
}
.crystal-button--solid .crystal-button__label {text-shadow:none}
.crystal-button--solid .crystal-button__rim {stroke:#245c46;stroke-opacity:.72}
.crystal-button--solid .crystal-button__inner-rim {stroke:#245c46;stroke-opacity:.16}
.crystal-button--solid .facet-top {fill:#fff;fill-opacity:.92}
.crystal-button--solid .facet-left {fill:#fff;fill-opacity:.70}
.crystal-button--solid .facet-right {fill:#245c46;fill-opacity:.055}
.crystal-button--solid .crystal-button__facets path:last-child {fill:#245c46;fill-opacity:.075}
.crystal-button--solid:focus-visible .crystal-button__surface {background:#dce8dd}
@media(hover:hover) and (pointer:fine) {
  .crystal-button--solid:hover .crystal-button__surface {background:rgb(36 92 70 / .12)}
  .crystal-button--solid:hover .crystal-button__rim {stroke-opacity:.95}
  .crystal-button--solid:hover .crystal-button__inner-rim {stroke-opacity:.30}
  .crystal-button--solid:hover .crystal-button__facets {opacity:1}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .crystal-button--solid .crystal-button__surface {background:#e6eee6}
}