/* Shared site color roles.
   Layout, spacing and responsive rules remain in their existing files. */

/* General page surfaces and text. */

body {
  background: var(--pc-surface, #faf8f5);
  color: var(--pc-text, #363636);
}

.pc-content h1,
.pc-content h2,
.pc-content h3,
.pc-content h4 {
  color: var(--pc-heading, #242424);
}

.pc-summit-content figcaption {
  color: var(--pc-text-muted, #666666);
}

/* Match focus indicators to the element's readable text color. */

:focus-visible {
  outline-color: currentColor;
}

.pc-skip-link {
  background: var(--pc-surface, #faf8f5);
  color: var(--pc-text, #363636);
}

/* Header: main surface with normal text colors. */

.pc-header {
  background: var(--pc-surface, #faf8f5);
  color: var(--pc-text, #363636);
}

.pc-wordmark > span {
  color: var(--pc-primary, #c91d35);
}

/* Navigation retains its readable text color on hover.
   Underlining communicates hover and the active page. */

/* Navigation underline: animated without moving the text. */
.pc-menu a {
  position: relative;
  text-decoration: none;
}

.pc-menu a::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0.35rem;
  block-size: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  pointer-events: none;
}

.pc-menu a:hover,
.pc-menu a:focus-visible,
.pc-menu .current-menu-item > a,
.pc-menu a[aria-current="page"] {
  color: inherit;
  text-decoration: none;
}

.pc-menu a:hover::after,
.pc-menu a:focus-visible::after,
.pc-menu .current-menu-item > a::after,
.pc-menu a[aria-current="page"]::after {
  transform: scaleX(1);
}

@media (prefers-reduced-motion: no-preference) {
  .pc-menu a::after {
    transition: transform 180ms ease-out;
  }
}

.pc-menu .sub-menu {
  background: var(--pc-surface, #faf8f5);
  color: var(--pc-text, #363636);
}

/* Shared CTA buttons.
   Primary background and automatically calculated label color. */

/* Button colours remain controlled by the Customizer. */
.pc-button {
  border-color: var(--pc-primary, #c91d35);
  background: var(--pc-primary, #c91d35);
  color: var(--pc-on-primary, #fff);
  transition: none;
}

.pc-button:hover,
.pc-button:focus-visible,
.pc-button:active {
  border-color: var(--pc-secondary, #242424);
  background: var(--pc-secondary, #242424);
  color: var(--pc-on-secondary, #fff);
}

/* Two-colour focus ring works on light and dark surroundings. */
.pc-button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 5px #151515;
}

.pc-button__arrow {
  display: inline-block;
  flex-shrink: 0;
}

@media (prefers-reduced-motion: no-preference) {
  .pc-button {
    transition:
      background-color 180ms ease-out,
      border-color 180ms ease-out,
      color 180ms ease-out;
  }

  .pc-button__arrow {
    transition: transform 180ms ease-out;
  }

  .pc-button:focus-visible .pc-button__arrow {
    transform: translateX(3px);
  }
}

/* Hover movement is reserved for devices with a precise pointer. */
@media (hover: hover) and (pointer: fine)
  and (prefers-reduced-motion: no-preference) {
  .pc-button:hover .pc-button__arrow {
    transform: translateX(3px);
  }
}

/* Mobile menu control. */

.pc-menu-toggle {
  border-color: var(--pc-text, #363636);
  background: var(--pc-surface, #faf8f5);
  color: var(--pc-text, #363636);
}

/* Footer text is calculated against its own background,
   independently of the main page text color. */

.pc-footer {
  background: var(--pc-dark, #151515);
  color: var(--pc-on-dark, #fff);
}


.pc-footer a:focus-visible {
  outline-color: var(--pc-on-dark, #fff);
}

/* Mobile drawer and its open header use the main surface. */

@media (max-width: 58rem) {
  .pc-header.pc-menu-is-open {
    background: var(--pc-surface, #faf8f5);
    color: var(--pc-text, #363636);
  }

  .pc-navigation.pc-navigation--enhanced {
    background: var(--pc-surface, #faf8f5);
    color: var(--pc-text, #363636);
  }

  .pc-menu .sub-menu {
    background: transparent;
  }
}

/* Keep text links recognisable before interaction. */
.pc-announcement__secondary {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25em;
  text-decoration-color: currentColor;
  text-decoration-color: color-mix(
    in srgb,
    currentColor 55%,
    transparent
  );
}

.pc-announcement__secondary:hover,
.pc-announcement__secondary:focus-visible {
  text-decoration-color: currentColor;
  text-decoration-thickness: 2px;
}

@media (prefers-reduced-motion: no-preference) {
  .pc-announcement__secondary {
    transition: text-decoration-color 150ms ease-out;
  }
}