/* Shared action styles. Keep page layout separate from button appearance. */
:root {
  --action-ink: #003660;
  --action-surface: #f1eeea;
  --action-border: #587184;
  --action-hover: #dae6e6;
  --action-focus: #23696e;
}
:root[data-theme="dark"] {
  --action-ink: #f1eeea;
  --action-surface: #0c2233;
  --action-border: #91a4ae;
  --action-hover: #193b50;
  --action-focus: #9bdbd4;
}

:root body.home a.site-button {
  --button-bg: var(--action-surface);
  --button-ink: var(--action-ink);
  --button-border: var(--action-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 52px;
  padding: 13px 20px;
  gap: 12px;
  border: 1px solid var(--button-border);
  border-radius: 3px;
  background: var(--button-bg);
  color: var(--button-ink) !important;
  -webkit-text-fill-color: var(--button-ink);
  font-family: var(--home-sans);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none !important;
  box-shadow: none;
  transition: background-color 150ms ease, border-color 150ms ease;
}
:root body.home a.site-button--primary {
  --button-bg: var(--action-ink);
  --button-ink: var(--action-surface);
  --button-border: var(--action-ink);
}
:root body.home a.site-button:hover {
  background: var(--action-hover);
  color: var(--action-ink) !important;
  -webkit-text-fill-color: var(--action-ink);
  border-color: var(--action-ink);
}
:root body.home a.site-button:focus-visible {
  outline: 3px solid var(--action-focus);
  outline-offset: 4px;
  box-shadow: 0 0 0 4px var(--action-surface);
}

/* Compact navigation and multi-line link cards belong to the same family. */
:root body.home a.site-button--compact {
  min-height: 40px;
  padding: 9px 16px;
  font-size: 13px;
}
/* A light outline keeps the application distinct without covering the glass. */
:root body.home a.home-nav__apply {
  --button-bg: transparent;
  --button-ink: var(--action-ink);
  --button-border: var(--action-border);
}
:root body.home a.home-nav__apply:hover {
  background: transparent;
  border-color: var(--action-ink);
  color: var(--action-ink) !important;
  -webkit-text-fill-color: var(--action-ink);
}
:root body.home a.site-button--card {
  display: flex;
  justify-content: flex-start;
  min-height: 56px;
  padding: 14px 17px;
  text-align: left;
}
:root body.home a.site-button--icon {
  min-width: 48px;
  min-height: 48px;
  padding: 12px;
}
:root body.home .site-button--card strong {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
:root body.home .site-button--card small,
:root body.home .site-button .join-link__note {
  color: inherit;
  -webkit-text-fill-color: currentColor;
  opacity: .8;
}
/* The closing Resources band stays light in both themes. */
.subpage-cta {
  --action-ink: #003660;
  --action-surface: #f1eeea;
  --action-border: #587184;
  --action-hover: #dae6e6;
  --action-focus: #23696e;
}
/* Hero actions share a fixed footprint, even on an incomplete wrapped row. */
:root body.home .home-actions > .site-button {
  flex: 0 0 auto;
  width: 260px;
  max-width: 100%;
  height: 52px;
}
@media (max-width: 700px) {
  :root body.home .home-actions > .site-button {
    width: 100%;
    max-width: 100%;
  }
}
@media (max-width: 600px) {
  :root body.home a.site-button--compact { padding-inline: 10px; }
  .home .application-notice {
    min-height: 40px;
    padding: 7px 18px;
    gap: 8px;
    font-size: 12px;
    line-height: 1.35;
  }
  .home .application-notice > span:first-child {
    max-width: none;
    line-height: inherit;
  }
  .home .home-nav__links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
  }
  :root body.home .home-nav__links > a {
    width: 100%;
    justify-content: center;
  }
  :root body.home .home-nav__links > a:not(.site-button) {
    flex: 0 0 auto;
    justify-content: center;
    min-height: 40px;
    padding: 8px 6px;
    border: 0;
    background: transparent;
    color: var(--action-ink) !important;
    -webkit-text-fill-color: var(--action-ink);
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
  }
  :root body.home .home-nav__links > a:not(.site-button):hover {
    color: var(--action-focus) !important;
    -webkit-text-fill-color: var(--action-focus);
  }
  :root body.home .home-nav__links > a:focus-visible {
    outline: 3px solid var(--action-focus);
    outline-offset: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  :root body.home a.site-button { transition: none; }
}