/* Shared contact and submit buttons, scoped to the independent brief page. */
:is(.header-actions, .submit-row, dialog) .g-contact-btn {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  height: 48px;
  padding: 0 58px 0 20px;
  overflow: hidden;
  border: 1px solid rgba(148, 155, 164, .55);
  border-radius: 999px;
  background: transparent;
  color: #141515;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: none;
  transition: color .25s cubic-bezier(.23, 1, .32, 1), transform .25s ease-out;
}

:is(.header-actions, .submit-row, dialog) .g-contact-btn-fill {
  position: absolute;
  right: 5px;
  top: 5px;
  z-index: 1;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: #000;
  pointer-events: none;
  transform-origin: 50% 50%;
  will-change: transform, background-color;
}

:is(.header-actions, .submit-row, dialog) .g-contact-btn-text {
  position: relative;
  z-index: 2;
  transition: color .25s cubic-bezier(.23, 1, .32, 1);
}

:is(.header-actions, .submit-row, dialog) .g-contact-btn-icon {
  position: absolute;
  z-index: 3;
  right: 5px;
  top: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin-left: 1em;
  border-radius: 999px;
  background: transparent;
  color: #fff;
  will-change: transform, color;
}

:is(.header-actions, .submit-row, dialog) .g-contact-btn-icon svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
  stroke: none;
}

:is(.header-actions, .submit-row, dialog) .g-contact-btn:active { transform: scale(.98); }
:is(.header-actions, .submit-row, dialog) .g-contact-btn:active .g-contact-btn-icon { transform: scale(.94); }

@media (hover: hover) and (pointer: fine) {
  :is(.header-actions, .submit-row, dialog) .g-contact-btn:hover { border-color: #e0f94c; color: #000; }
  :is(.header-actions, .submit-row, dialog) .g-contact-btn:hover .g-contact-btn-text { color: #000; }
}

/* Match the main site's compact desktop button dimensions. */
@media (max-width: 1600px) {
  .header-actions .g-contact-btn { height: 46px; padding-left: 18px; padding-right: 56px; font-size: 13px; }
  .header-actions .g-contact-btn-fill,
  .header-actions .g-contact-btn-icon { width: 36px; height: 36px; }
}

/* Preserve the brief page's existing phone header layout. */
@media (max-width: 540px) {
  .header-actions .g-contact-btn { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  :is(.header-actions, .submit-row, dialog) .g-contact-btn,
  :is(.header-actions, .submit-row, dialog) .g-contact-btn-text { transition: none; }
}

/* The review CTA fills the form column and keeps its black resting state. */
:is(.submit-row, dialog) .g-contact-btn {
  justify-content: center;
  width: 100%;
  height: 54px;
  padding: 0 58px;
  border-color: #000;
  background: #000;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}
:is(.submit-row, dialog) .g-contact-btn-fill,
:is(.submit-row, dialog) .g-contact-btn-icon { width: 42px; height: 42px; }
:is(.submit-row, dialog) .g-contact-btn-fill { background: var(--lime); }
:is(.submit-row, dialog) .g-contact-btn-icon { color: #000; }

@media (hover: hover) and (pointer: fine) {
  :is(.submit-row, dialog) .g-contact-btn:hover { border-color: var(--lime); }
  :is(.submit-row, dialog) .g-contact-btn:not([data-jvds-contact-gsap="1"]):hover { background: var(--lime); }
}
@media (max-width: 540px) {
  :is(.submit-row, dialog) .g-contact-btn { height: 57px; }
  :is(.submit-row, dialog) .g-contact-btn-fill,
  :is(.submit-row, dialog) .g-contact-btn-icon { width: 45px; height: 45px; }
}

/* Dialog actions reuse the form CTA, including its hover fill and arrow. */
dialog .g-contact-btn-text{white-space:normal;overflow-wrap:anywhere;line-height:1.4}
dialog .g-contact-btn[aria-busy="true"]{height:auto;min-height:54px;padding-block:16px}

/* Center inside the bordered shell; rotation must keep the same center. */
.header-actions .g-contact-btn[data-jvds-motion="arounda"] .g-contact-btn-icon,
.header-actions .g-contact-btn[data-jvds-motion="arounda"] .g-contact-btn-fill {
  top: 0;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
}