/* Loaded last: shared link feedback, with no change to size or text position. */
body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit) {
  --action-ink: var(--blue-dark);
  --action-rule: var(--blue);
  --action-rest: #93b5c7;
  --action-wash: #008bcb0d;
  --action-focus: var(--blue-dark);
  position: relative;
  isolation: isolate;
  border-bottom-color: var(--action-rest);
  background: transparent;
  box-shadow: none;
  text-decoration: none;
  transition: color .24s ease, border-color .24s ease;
}
body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit)::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 5px -7px 5px -7px;
  background: linear-gradient(100deg, transparent, var(--action-wash) 30%, var(--action-wash));
  opacity: 0;
  transform: scaleX(.12);
  transform-origin: left center;
  transition: transform .46s cubic-bezier(.2,.7,.2,1), opacity .28s ease;
  pointer-events: none;
}
body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit)::after {
  content: '';
  position: absolute;
  inset: auto 0 -1px;
  height: 1px;
  background: var(--action-rule);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .4s cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
}
body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit):not(:disabled):focus-visible {
  color: var(--action-ink);
  border-bottom-color: transparent;
  outline-color: var(--action-focus);
  box-shadow: none;
}
body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit):not(:disabled):focus-visible::before {
  opacity: 1;
  transform: scaleX(1);
}
body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit):not(:disabled):focus-visible::after {
  transform: scaleX(1);
  transform-origin: left center;
}

/* The dark duo section keeps white text, rules and keyboard focus. */
body .home-duo-band :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit) {
  --action-ink: #ffffff;
  --action-rule: #ffffff;
  --action-rest: #9fc9dc;
  --action-wash: #ffffff12;
  --action-focus: #ffffff;
  color: white;
}

/* Navigation already owns ::after; only refine that existing line. */
.site-header nav > a:not(.contact-action) {
  background-image: linear-gradient(100deg, transparent, #008bcb0b);
  background-position: left center;
  background-size: 0% calc(100% - 12px);
  background-repeat: no-repeat;
  transition: color .22s ease, background-size .4s cubic-bezier(.2,.7,.2,1);
}
.site-header nav > a:not(.contact-action)::after { height: 1px; transition: right .32s cubic-bezier(.2,.7,.2,1); }
.site-header nav > a:not(.contact-action):focus-visible {
  color: var(--blue-dark);
  background-size: 100% calc(100% - 12px);
}
.site-header nav > a:not(.contact-action):focus-visible::after { right: 0; }

/* Small navigation and contact links retain their existing display and wrapping. */
body :is(.footer-navigation > a, .footer-bottom a, .quiet-link, .phone-link, .phone-list a, .team-preview-phone > a, .drawer-channels a, .contact-details > div > a, a[href^='tel:'], a[href^='mailto:']):not(:is(.text-link, .button-secondary, .button-primary, .contact-action)) {
  background-image: linear-gradient(100deg, transparent, #008bcb0b);
  background-position: left center;
  background-size: 0% 100%;
  background-repeat: no-repeat;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  transition: color .22s ease, text-decoration-color .22s ease, background-size .4s cubic-bezier(.2,.7,.2,1);
}
body :is(.footer-navigation > a, .footer-bottom a, .quiet-link, .phone-link, .phone-list a, .team-preview-phone > a, .drawer-channels a, .contact-details > div > a, a[href^='tel:'], a[href^='mailto:']):not(:is(.text-link, .button-secondary, .button-primary, .contact-action)):focus-visible {
  color: var(--blue-dark);
  background-size: 100% 100%;
  text-decoration-line: underline;
  text-decoration-color: var(--blue);
}

/* Keep the requested send icon and circle; the text gets the same soft sweep. */
.contact-form > .contact-submit { box-shadow: none; }
.contact-form > .contact-submit > span {
  background: linear-gradient(100deg, transparent, #008bcb0d) left center / 0% 100% no-repeat;
  transition: background-size .4s cubic-bezier(.2,.7,.2,1), border-color .24s;
}
.contact-form > .contact-submit > svg { transition: color .3s ease; }
.contact-form > .contact-submit circle { transition: fill .3s ease, stroke .3s ease; }
.contact-form > .contact-submit:not(:disabled):focus-visible > span { background-size: 100% 100%; border-bottom-color: var(--blue); }
.contact-form > .contact-submit:not(:disabled):focus-visible > svg { color: white; }
.contact-form > .contact-submit:not(:disabled):focus-visible circle { fill: var(--blue-dark); }
.contact-form > .contact-submit:disabled:hover > svg { color: inherit; }
.contact-form > .contact-submit:disabled:hover circle { fill: transparent; }

/* Hover is reserved for devices that can actually hover. */
@media (hover: hover) and (pointer: fine) {
  body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit):not(:disabled):hover {
    color: var(--action-ink);
    border-bottom-color: transparent;
    box-shadow: none;
  }
  body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit):not(:disabled):hover::before { opacity: 1; transform: scaleX(1); }
  body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit):not(:disabled):hover::after { transform: scaleX(1); transform-origin: left center; }
  .site-header nav > a:not(.contact-action):hover { color: var(--blue-dark); background-size: 100% calc(100% - 12px); }
  body :is(.footer-navigation > a, .footer-bottom a, .quiet-link, .phone-link, .phone-list a, .team-preview-phone > a, .drawer-channels a, .contact-details > div > a, a[href^='tel:'], a[href^='mailto:']):not(:is(.text-link, .button-secondary, .button-primary, .contact-action)):hover {
    color: var(--blue-dark);
    background-size: 100% 100%;
    text-decoration-line: underline;
    text-decoration-color: var(--blue);
  }
  .contact-form > .contact-submit:not(:disabled):hover > span { background-size: 100% 100%; border-bottom-color: var(--blue); }
}
@media (hover: none), (pointer: coarse) {
  body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit):not(:disabled):hover:not(:focus-visible) { color: var(--action-ink); border-bottom-color: var(--action-rest); box-shadow: none; }
  .site-header nav > a:not(.contact-action):not([aria-current]):not(.is-current):hover:not(:focus-visible)::after { right: 100%; }
  .contact-form > .contact-submit:not(:focus-visible):hover > svg { color: inherit; }
  .contact-form > .contact-submit:not(:focus-visible):hover circle { fill: transparent; }
}
@media (prefers-reduced-motion: reduce) {
  body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit),
  body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit)::before,
  body :is(.text-link, .button-secondary, .button-primary, .contact-action):not(.contact-submit)::after,
  .site-header nav > a:not(.contact-action),
  .site-header nav > a:not(.contact-action)::after,
  body :is(.footer-navigation > a, .footer-bottom a, .quiet-link, .phone-link, .phone-list a, .team-preview-phone > a, .drawer-channels a, .contact-details > div > a, a[href^='tel:'], a[href^='mailto:']),
  .contact-form > .contact-submit > span,
  .contact-form > .contact-submit > svg,
  .contact-form > .contact-submit circle { transition: none; }
}
