/* Consultation actions: neutral tonal feedback, no hover elevation or shadow.
   Scope includes the featured ID to override its existing theme-specific rules. */
.plan-card {
  --plan-action-rest: var(--vi-surface);
  --plan-action-ink: var(--vi-ink);
  --plan-action-hover: #ededf0;
  --plan-action-hover-ink: var(--vi-ink);
  --plan-action-pressed: #e4e4e8;
}
/* R89: the card lifts as a whole; consultation buttons retain their own feedback. */
:root[data-release] .plan-card {
  --plan-card-hover-shadow: 0 10px 24px -8px rgb(29 29 31 / 12%);
  box-shadow: none;
  transform: none;
  transition: transform 240ms cubic-bezier(.2,.8,.2,1), box-shadow 240ms ease, border-color 200ms ease;
}
:root[data-release][data-theme="dark"] .plan-card {
  --plan-card-hover-shadow: 0 10px 24px -8px rgb(0 0 0 / 32%);
}
@media (hover: hover) and (pointer: fine) {
  :root[data-release] .plan-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--plan-card-hover-shadow);
  }
}
:root[data-release] .plan-card:has(:focus-visible) {
  transform: translateY(-4px);
  box-shadow: var(--plan-card-hover-shadow);
}
@media (prefers-reduced-motion: reduce) {
  :root[data-release] .plan-card,
  :root[data-release] .plan-card:hover,
  :root[data-release] .plan-card:has(:focus-visible) {
    transform: none;
    transition: none;
  }
}
@media (forced-colors: active) {
  :root[data-release] .plan-card,
  :root[data-release] .plan-card:hover,
  :root[data-release] .plan-card:has(:focus-visible) { box-shadow: none; }
}
:root[data-theme="dark"] .plan-card {
  --plan-action-rest: var(--theme-black);
  --plan-action-hover: color-mix(in srgb, var(--theme-black) 50%, var(--theme-gray));
  --plan-action-hover-ink: var(--vi-ink);
  --plan-action-pressed: color-mix(in srgb, var(--theme-black) 75%, var(--theme-gray));
}
#plan-product {
  --plan-action-rest: #fff;
  --plan-action-ink: #050609;
  --plan-action-hover: #e9e9ec;
  --plan-action-hover-ink: var(--vi-accent-hover);
  --plan-action-pressed: #e5e5e9;
}
:root[data-release] :is(.plan-card, #plan-product) .plan-action {
  border: 0;
  outline: none;
  background: var(--plan-action-rest);
  color: var(--plan-action-ink);
  box-shadow: none;
  transform: none;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 160ms ease, transform 160ms cubic-bezier(.2,.8,.2,1);
}
/* R88: make white featured-button feedback visible on the blue card in both themes. */
:root[data-release] #plan-product .plan-action {
  transition: background-color 160ms ease, color 160ms ease, transform 160ms cubic-bezier(.2,.8,.2,1);
}
/* Consultation selection remains in the contact summary, not a persistent ring. */
:root[data-release] :is(.plan-card, #plan-product) .plan-action.is-selected {
  outline: none;
}
@media (hover: hover) and (pointer: fine) {
  :root[data-release] :is(.plan-card, #plan-product) .plan-action:hover {
    background: var(--plan-action-hover);
    color: var(--plan-action-hover-ink);
    box-shadow: none;
    transform: none;
  }
}
:root[data-release] :is(.plan-card, #plan-product) .plan-action:active {
  background: var(--plan-action-pressed);
  color: var(--plan-action-hover-ink);
  box-shadow: none;
  transform: scale(.985);
  transition-duration: 80ms;
}
/* A pointer click never leaves this ring; Tab navigation remains visible. */
:root[data-release] :is(.plan-card, #plan-product) .plan-action:focus-visible {
  outline: 2px solid var(--vi-link);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  :root[data-release] :is(.plan-card, #plan-product) :is(.plan-action, .plan-action:hover, .plan-action:active) {
    transition: none;
    transform: none;
  }
}
@media (forced-colors: active) {
  :root[data-release] :is(.plan-card, #plan-product) .plan-action {
    border: 1px solid ButtonText;
    background: ButtonFace;
    color: ButtonText;
    box-shadow: none;
  }
  :root[data-release] :is(.plan-card, #plan-product) .plan-action:focus-visible {
    outline-color: Highlight;
  }
}