/* ===========================================================================
   ServicesAiAgent — Page Basics & Tokens
   Text helpers, breadcrumb contrast fix, term popovers, focus indicators.
   =========================================================================== */

:root {
  --aa-blue-text: #165F9C;
  --aa-navy: var(--navy);
  --aa-navy-deep: var(--navy-deep);
  --aa-blue: var(--blue);
  --aa-blue-pale: var(--blue-pale);
  --aa-green: var(--green);
  --aa-white: var(--white);
  --aa-line: var(--line);
  --aa-line-strong: var(--line-strong);
  --aa-muted: var(--muted);
  --aa-ink: var(--ink);
}

/* Breadcrumb contrast fix (guarantees >= 4.5:1 on white without touching shared files) */
.bcrumb, .bcrumb a {
  color: #485E75 !important;
}
.bcrumb a:hover {
  color: var(--blue) !important;
}

/* Base lead paragraph: left edge matches the section heading (same as main and the Aidd page) */
.aa-lead {
  margin: 0 0 clamp(24px, 3vw, 36px);
  max-width: 880px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 2.0;
  color: var(--muted);
}

/* Keeps the last word of a jump-link label and its arrow on one line (no stray arrow) */
.aa-nb {
  white-space: nowrap;
}

/* --- Hard words (term popover: PoC) --- */
.aa-term {
  position: relative;
  display: inline-block;
}

/* The inline button has min-height: 44px for touch target without shifting line layout */
.aa-term__btn {
  all: unset;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  font-weight: 700;
  color: var(--blue-pale);
  text-decoration: underline dotted var(--blue-pale);
  text-underline-offset: 5px;
  padding: 10px 2px;
  margin: -10px 0;
  min-height: 44px;
  scroll-margin-top: 92px;
  vertical-align: middle;
}

.aa-term__btn:focus-visible {
  outline: 2px solid var(--blue-pale) !important;
  outline-offset: 2px !important;
}

.aa-term__q {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: 4px;
  border-radius: 50%;
  background: var(--amber);
  color: var(--navy);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  vertical-align: middle;
}

/* Popover bubble: hidden by default, visible when .is-open */
.aa-term__pop {
  display: none;
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 25;
  width: min(320px, 80vw);
  padding: 14px 16px;
  border-radius: 8px;
  background: var(--white);
  color: var(--navy);
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
  box-shadow: 0 10px 30px rgba(16, 42, 67, .25);
  white-space: normal;
  border: 1px solid var(--line);
}

.aa-term.is-open .aa-term__pop {
  display: block;
  visibility: visible;
  opacity: 1;
}

/* Focus styles for accessible keyboard navigation */
.aa-hero__cta:focus-visible,
.aa-hero__jump:focus-visible,
.aa-flow__link:focus-visible,
.aa-film__btn:focus-visible,
.aa-film__play:focus-visible,
.faq__q:focus-visible,
.rel3__card:focus-visible {
  outline: 2px solid var(--blue) !important;
  outline-offset: 2px !important;
}

.aa-hero .aa-hero__cta:focus-visible,
.aa-hero .aa-hero__jump:focus-visible {
  outline-color: var(--blue-pale) !important;
}
