/* Specialty links follow the appointment button's palette. */
.carpa-care {
  --area-fill: var(--care-accent);
  --area-fill-ink: #fff;
}
.carpa-care:is([data-palette='p1'], [data-palette='p3'], [data-palette='p4b'], [data-palette='p4c'], [data-palette='p4d'], [data-palette='p4e'], [data-palette='p4f'], [data-palette='p4g'], [data-palette='p4h']) {
  --area-fill: #d9c29a;
  --area-fill-ink: #12305c;
}
.carpa-care[data-palette='p1'] { --area-fill: #e3cb94; }
.carpa-care[data-palette='p3'] { --area-fill: #c9a45c; }
.carpa-care[data-palette='p4g'] { --area-fill: #e5cea3; }
.carpa-care[data-palette='p4h'] { --area-fill: #ddbd7c; }
.carpa-care__areas a {
  background-image: linear-gradient(var(--area-fill), var(--area-fill));
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 0% 100%;
  transition: background-size 340ms cubic-bezier(.22, .61, .36, 1), color 220ms ease;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) and (pointer: fine) {
  .carpa-care__areas a:hover {
    background-size: 100% 100%;
    color: var(--area-fill-ink);
  }
}
.carpa-care__areas a:focus-visible,
.carpa-care__areas a:active {
  background-size: 100% 100%;
  color: var(--area-fill-ink);
}
@media (prefers-reduced-motion: reduce) {
  .carpa-care__areas a { transition: none; }
}

/* A left-to-right fill shared by the preview's primary actions. */
.carpa-hero .carpa-hero__submit,
.carpa-hero .carpa-hero__nav .carpa-hero__nav-cta,
.carpa-care a.carpa-care__cta,
.carpa-home a.carpa-home__button {
  --button-fill: #12305c;
  background-image: linear-gradient(var(--button-fill), var(--button-fill));
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 0% 100%;
  transition: background-size 340ms cubic-bezier(.22, .61, .36, 1), transform 220ms ease, box-shadow 220ms ease;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.carpa-hero .carpa-hero__submit { --button-fill: #fff; }
.carpa-hero[data-palette='p1'] .carpa-hero__submit,
.carpa-hero[data-palette='p3'] .carpa-hero__submit,
.carpa-hero[data-palette='p3'] .carpa-hero__nav .carpa-hero__nav-cta,
.carpa-hero[data-palette='p4b'] .carpa-hero__submit,
.carpa-hero:is([data-palette='p4c'], [data-palette='p4d'], [data-palette='p4e'], [data-palette='p4f'], [data-palette='p4g'], [data-palette='p4h']) .carpa-hero__submit { --button-fill: #fbf8f2; }
.carpa-hero[data-palette='p2'] .carpa-hero__submit { --button-fill: #12305c; }
.carpa-hero[data-palette='p4'] .carpa-hero__submit { --button-fill: #d9c29a; }
.carpa-care[data-palette='p3'] a.carpa-care__cta { --button-fill: #1f4e8c; }

.carpa-hero .carpa-hero__submit span[aria-hidden],
.carpa-care .carpa-care__cta span[aria-hidden],
.carpa-home .carpa-home__button span[aria-hidden] {
  display: inline-block;
  transition: transform 260ms cubic-bezier(.22, .61, .36, 1);
}

@media (hover: hover) and (pointer: fine) {
  .carpa-hero .carpa-hero__submit:hover,
  .carpa-hero .carpa-hero__nav .carpa-hero__nav-cta:hover,
  .carpa-care a.carpa-care__cta:hover,
  .carpa-home a.carpa-home__button:hover {
    background-size: 100% 100%;
    filter: none;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px #12305c18;
    text-decoration: none;
  }
  .carpa-hero .carpa-hero__submit:hover span[aria-hidden],
  .carpa-care .carpa-care__cta:hover span[aria-hidden],
  .carpa-home .carpa-home__button:hover span[aria-hidden] { transform: translate(3px, -3px); }
}

.carpa-hero .carpa-hero__submit:focus-visible,
.carpa-hero .carpa-hero__nav .carpa-hero__nav-cta:focus-visible,
.carpa-care a.carpa-care__cta:focus-visible,
.carpa-home a.carpa-home__button:focus-visible,
.carpa-hero .carpa-hero__submit:active,
.carpa-hero .carpa-hero__nav .carpa-hero__nav-cta:active,
.carpa-care a.carpa-care__cta:active,
.carpa-home a.carpa-home__button:active {
  background-size: 100% 100%;
  filter: none;
  text-decoration: none;
}
.carpa-hero .carpa-hero__submit:active,
.carpa-hero .carpa-hero__nav .carpa-hero__nav-cta:active,
.carpa-care a.carpa-care__cta:active,
.carpa-home a.carpa-home__button:active { transform: translateY(0) scale(.99); }

@media (prefers-reduced-motion: reduce) {
  .carpa-hero .carpa-hero__submit,
  .carpa-hero .carpa-hero__nav .carpa-hero__nav-cta,
  .carpa-care a.carpa-care__cta,
  .carpa-home a.carpa-home__button,
  .carpa-hero .carpa-hero__submit span[aria-hidden],
  .carpa-care .carpa-care__cta span[aria-hidden],
  .carpa-home .carpa-home__button span[aria-hidden] {
    transition: none;
    transform: none !important;
  }
}
