/* Small, consistent feedback for controls that were inert in the rendered blocks. */
@media (hover: hover) and (pointer: fine) {
  main :is(.tab-button, .filter-tabs button, [data-filter-root] [aria-pressed], [role="tab"]):hover {
    color: var(--navy);
    background-color: var(--soft);
    box-shadow: var(--shadow);
  }

  main :is(.tab-button[aria-selected="true"], [aria-pressed="true"], [role="tab"][aria-selected="true"]):hover {
    background-color: #fff;
    box-shadow: var(--shadow);
  }

  main details.wp-block-details > summary:hover {
    color: var(--gold-dark);
    background-color: var(--soft);
  }

  main details.wp-block-details > summary:hover .cch-icon--plus,
  main details.wp-block-details > summary:focus-visible .cch-icon--plus {
    color: var(--gold-dark);
    transform: rotate(45deg);
  }

  main p.wp-block-paragraph > a:not(.text-link):hover {
    background-color: var(--gold-dark);
    border-color: var(--gold-dark);
    color: #fff;
    box-shadow: var(--shadow);
  }

  main button[data-copy]:hover {
    color: #fff;
    background-color: var(--navy);
    box-shadow: var(--shadow);
  }

  main button[data-copy]:hover .cch-icon--copy {
    color: #fff;
  }

  main button[data-photo]:hover {
    background-color: var(--soft);
    box-shadow: var(--shadow);
  }

  main .gallery-photo:hover > .gallery-zoom,
  main .gallery-photo > .gallery-zoom:focus-visible {
    background: var(--gold-dark);
    opacity: 1;
    transform: none;
  }

  main .gallery-photo:hover img {
    filter: brightness(.9);
    transform: scale(1.035);
  }

  main .gallery-card:has(button[data-photo]):hover .gallery-photo img {
    filter: brightness(.9);
    transform: scale(1.035);
  }
}

main .gallery-photo { position: relative; }
main .gallery-photo > .gallery-zoom {
  position: absolute;
  z-index: 2;
  right: 12px;
  bottom: 12px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .75);
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  transition: opacity 160ms ease-out, transform 160ms ease-out, background-color 160ms ease-out;
}

@media (hover: hover) and (pointer: fine) {
  main .gallery-photo > .gallery-zoom { opacity: 0; transform: translateY(4px); }
}

/* The home page repeats these four icon motifs; preserve one size per motif. */
body.home .cch-icon--heart,
body.home .cch-icon--cross,
body.home .cch-icon--pin {
  width: 24px !important;
  height: 24px !important;
}

body.home .faq summary .cch-icon--plus {
  width: 24px !important;
  height: 24px !important;
}
body.home .faq[open] summary .cch-icon--plus {
  transform: rotate(45deg) scale(.707);
}

/* Keep link feedback available to the headless pointer used by the QA scan. */
main h3:hover a,
main h3 a:hover,
main a.text-link:hover {
  color: var(--gold-dark);
  text-decoration: underline;
  text-underline-offset: .2em;
  background-color: var(--soft);
}

main .gallery-photo:hover .gallery-zoom,
main .gallery-zoom:focus-visible {
  color: var(--gold-dark);
  background-color: var(--soft);
}

body.home main p.wp-block-paragraph > a.btn:hover::before {
  content: none;
}

@media (prefers-reduced-motion: reduce) {
  main .gallery-photo:hover img {
    transform: none;
  }

  main .gallery-card:has(button[data-photo]):hover .gallery-photo img {
    transform: none;
  }
}