/* Header v2 shiny buttons.
   Direct CSS port of the provided ShinyButton component.
   Header/container backgrounds are controlled in Header v2 itself. */

@property --aurify-gradient-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@property --aurify-gradient-angle-offset {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@property --aurify-gradient-percent {
  syntax: "<percentage>";
  initial-value: 5%;
  inherits: false;
}

@property --aurify-gradient-shine {
  syntax: "<color>";
  initial-value: white;
  inherits: false;
}

#site-header :is(.uagb-block-24c1e947, .uagb-block-6dd3409a) > .wp-block-html {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

#site-header .aurify-shiny-button {
  --gleam-fill: linear-gradient(#050505, #050505);
  --gleam-inset: #1a1818;
  --gleam-label: #ffffff;
  --gleam-accent: #ff5f00;
  --gleam-accent-soft: #ff9253;
  --animation: aurify-gradient-angle linear infinite;
  --duration: 8s;
  --shadow-size: 2px;
  --transition: .8s cubic-bezier(0.25, 1, 0.5, 1);

  isolation: isolate;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  outline-offset: 4px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;

  /* Header-sized equivalent of the component's 1.25rem 2.5rem padding. */
  padding: 10px 12px;
  min-height: 42px;

  font-size: 14px;
  line-height: 1.2;
  font-weight: 500;
  text-decoration: none !important;

  border: 1px solid transparent;
  border-radius: 15px;
  color: var(--gleam-label) !important;

  background:
    var(--gleam-fill) padding-box,
    conic-gradient(
      from calc(var(--aurify-gradient-angle) - var(--aurify-gradient-angle-offset)),
      transparent,
      var(--gleam-accent) var(--aurify-gradient-percent),
      var(--aurify-gradient-shine) calc(var(--aurify-gradient-percent) * 2),
      var(--gleam-accent) calc(var(--aurify-gradient-percent) * 3),
      transparent calc(var(--aurify-gradient-percent) * 4)
    ) border-box;

  box-shadow: inset 0 0 0 1px var(--gleam-inset);

  transition:
    translate .14s cubic-bezier(.87, 0, .13, 1),
    scale .14s cubic-bezier(.87, 0, .13, 1),
    --aurify-gradient-angle-offset var(--transition),
    --aurify-gradient-percent var(--transition),
    --aurify-gradient-shine var(--transition);
}


/* Original Header v2 accent palettes — dark base stays intact */
#site-header .uagb-block-24c1e947 .aurify-shiny-button {
  --gleam-fill: linear-gradient(
    135deg,
    rgb(36, 89, 122) 0%,
    rgb(128, 201, 216) 51%,
    rgb(36, 89, 122) 97%
  );
  --gleam-accent: #91edff;
  --gleam-accent-soft: #d7f8ff;
  --gleam-inset: rgba(255,255,255,.18);
}

#site-header .uagb-block-6dd3409a .aurify-shiny-button {
  --gleam-fill: linear-gradient(
    135deg,
    rgb(85, 21, 44) 0%,
    rgb(255, 63, 127) 51%,
    rgb(85, 21, 44) 100%
  );
  --gleam-accent: #ff3f7f;
  --gleam-accent-soft: #ff9fbd;
  --gleam-inset: rgba(255,255,255,.18);
}

#site-header .aurify-shiny-button::before,
#site-header .aurify-shiny-button::after,
#site-header .aurify-shiny-button span::before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 50%;
  translate: -50% -50%;
  z-index: -1;
}

#site-header .aurify-shiny-button:active {
  translate: 0 1px;
  scale: .97;
}

/* Speckle layer */
#site-header .aurify-shiny-button::before {
  --size: calc(100% - var(--shadow-size) * 3);
  --position: 2px;
  --space: calc(var(--position) * 2);

  width: var(--size);
  height: var(--size);

  background: radial-gradient(
    circle at var(--position) var(--position),
    white calc(var(--position) / 4),
    transparent 0
  ) padding-box;

  background-size: var(--space) var(--space);
  background-repeat: space;

  -webkit-mask-image: conic-gradient(
    from calc(var(--aurify-gradient-angle) + 45deg),
    black,
    transparent 10% 90%,
    black
  );
  mask-image: conic-gradient(
    from calc(var(--aurify-gradient-angle) + 45deg),
    black,
    transparent 10% 90%,
    black
  );

  border-radius: inherit;
  opacity: .4;
  z-index: -1;
}

/* Rotating sheen */
#site-header .aurify-shiny-button::after {
  --animation: aurify-shimmer linear infinite;

  width: 100%;
  aspect-ratio: 1;

  background: linear-gradient(
    -50deg,
    transparent,
    var(--gleam-accent),
    transparent
  );

  -webkit-mask-image: radial-gradient(circle at bottom, transparent 40%, black);
  mask-image: radial-gradient(circle at bottom, transparent 40%, black);

  opacity: .6;
}

#site-header .aurify-shiny-button span {
  z-index: 1;
  color: var(--gleam-label) !important;
  white-space: nowrap;
}

/* Hover/focus breathing glow */
#site-header .aurify-shiny-button span::before {
  --size: calc(100% + 1rem);

  width: var(--size);
  height: var(--size);

  box-shadow: inset 0 -1ex 2rem 4px var(--gleam-accent);

  opacity: 0;
  transition: opacity var(--transition);
  animation: calc(var(--duration) * 1.5) aurify-breathe linear infinite;
}

#site-header .aurify-shiny-button,
#site-header .aurify-shiny-button::before,
#site-header .aurify-shiny-button::after {
  animation:
    var(--animation) var(--duration),
    var(--animation) calc(var(--duration) / .4) reverse paused;
  animation-composition: add;
}

#site-header .aurify-shiny-button:is(:hover, :focus-visible),
#site-header .aurify-shiny-button:is(:hover, :focus-visible)::before,
#site-header .aurify-shiny-button:is(:hover, :focus-visible)::after {
  animation-play-state: running;
}

#site-header .aurify-shiny-button:is(:hover, :focus-visible) span::before {
  opacity: 1;
}

@keyframes aurify-gradient-angle {
  to {
    --aurify-gradient-angle: 360deg;
  }
}

@keyframes aurify-shimmer {
  to {
    rotate: 360deg;
  }
}

@keyframes aurify-breathe {
  from,
  to {
    scale: 1;
  }

  50% {
    scale: 1.2;
  }
}

@media (prefers-reduced-motion: reduce) {
  #site-header .aurify-shiny-button,
  #site-header .aurify-shiny-button::before,
  #site-header .aurify-shiny-button::after,
  #site-header .aurify-shiny-button span::before {
    animation: none !important;
  }

  #site-header .aurify-shiny-button:is(:hover, :focus-visible),
  #site-header .aurify-shiny-button:is(:hover, :focus-visible)::before,
  #site-header .aurify-shiny-button:is(:hover, :focus-visible)::after {
    animation-play-state: paused !important;
  }

  #site-header .aurify-shiny-button:is(:hover, :focus-visible) span::before {
    opacity: 0;
  }

  #site-header .aurify-shiny-button {
    transition: none;
  }
}


/* Stronger hover color reveal */
#site-header .aurify-shiny-button:is(:hover, :focus-visible) {
  --aurify-gradient-percent: 26%;
  --aurify-gradient-angle-offset: 95deg;
  --aurify-gradient-shine: var(--gleam-accent-soft);

  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--gleam-accent) 28%, transparent),
    inset 0 0 18px color-mix(in srgb, var(--gleam-accent) 18%, transparent),
    0 0 20px color-mix(in srgb, var(--gleam-accent) 22%, transparent);
}

#site-header .aurify-shiny-button:is(:hover, :focus-visible)::after {
  opacity: .92;
}

#site-header .aurify-shiny-button:is(:hover, :focus-visible)::before {
  opacity: .62;
}

#site-header .aurify-shiny-button:is(:hover, :focus-visible) span::before {
  opacity: 1;
  box-shadow:
    inset 0 -1ex 2.4rem 6px var(--gleam-accent);
}