.documents-page { background: #fff; }
.documents-hero { padding: 100px 0 92px; background: linear-gradient(128deg, #f5f8fd 0 68%, #e8f0ff 68%); }
.documents-hero-grid { display: grid; grid-template-columns: 1fr 310px; align-items: end; gap: 90px; }
.documents-hero h1 { max-width: 960px; margin: 0; color: #102554; font-family: var(--serif); font-size: clamp(2.9rem, 4.5vw, 5rem); font-weight: 600; letter-spacing: -.06em; line-height: 1.14; }
.documents-hero h1 em { color: var(--blue); font-style: normal; }
.documents-hero-grid > div > p:last-child { max-width: 760px; margin: 30px 0 0; color: #536177; font-size: .98rem; line-height: 1.95; }
.documents-summary { border-top: 4px solid var(--blue); padding-top: 22px; }
.documents-summary > span { color: var(--blue); font-size: .62rem; font-weight: 800; letter-spacing: .14em; }
.documents-summary > div { display: grid; grid-template-columns: 60px 1fr; align-items: baseline; margin-top: 16px; padding-bottom: 11px; border-bottom: 1px solid #cfd7e4; }
.documents-summary > div strong { color: #12244c; font-family: var(--serif); font-size: 2rem; }
.documents-summary > div small { color: #657287; font-size: .63rem; }
.documents-summary > p { display: flex; align-items: center; gap: 9px; margin: 18px 0 0; color: #34435a; font-size: .66rem; font-weight: 700; }
.documents-summary > p i { width: 8px; height: 8px; border-radius: 50%; background: #17a673; box-shadow: 0 0 0 5px rgba(23,166,115,.12); }
.documents-index { padding-top: 105px; padding-bottom: 112px; }
.documents-section-head { display: flex; align-items: end; justify-content: space-between; gap: 50px; }
.documents-section-head h2 { margin: 0; color: #172541; font-family: var(--serif); font-size: clamp(2.3rem, 3.6vw, 3.8rem); font-weight: 600; letter-spacing: -.045em; line-height: 1.2; }
.documents-section-head > p { max-width: 490px; margin: 0; color: var(--body); font-size: .78rem; }
.document-groups { display: grid; grid-template-columns: 1.35fr .65fr; gap: 14px; margin-top: 55px; }
.document-group { min-height: 390px; border: 1px solid var(--line); background: #fff; }
.document-group > header { min-height: 116px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 25px 30px; border-top: 4px solid var(--blue); border-bottom: 1px solid var(--line); }
.document-group > header span { color: var(--blue); font-size: .58rem; font-weight: 800; letter-spacing: .12em; }
.document-group > header h3 { margin: 7px 0 0; color: #172541; font-family: var(--serif); font-size: 1.22rem; }
.document-group > header b { flex: 0 0 auto; border-radius: 99px; padding: 5px 10px; background: var(--blue); color: #fff; font-size: .58rem; }
.document-list { padding: 0 30px 28px; }
.document-list a { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 17px; min-height: 122px; border-bottom: 1px solid var(--line); }
.document-list a:hover .document-copy strong, .document-list a:focus-visible .document-copy strong { color: var(--blue); }
.document-list a:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.document-icon { width: 44px; height: 52px; display: grid; place-items: center; border: 1px solid #b8c2d0; background: #fff; color: var(--blue); font-size: .58rem; font-weight: 800; letter-spacing: .06em; }
.document-copy { min-width: 0; display: grid; }
.document-copy strong { color: #1b2841; font-size: .82rem; transition: color .18s ease; }
.document-copy small { margin-top: 7px; color: #7a8595; font-size: .59rem; }
.document-action { color: var(--blue); font-size: .66rem; font-weight: 800; }
.document-action i { margin-left: 6px; font-size: .9rem; font-style: normal; }
.branch-document-group > header { border-top-color: #9da8b8; }
.branch-document-group > header span { color: #687589; }
.document-empty { min-height: 260px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 20px; border: 1px dashed #aeb9c9; padding: 30px; text-align: center; }
.document-empty > span { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #bdc6d2; border-radius: 50%; color: #8994a4; font-size: 1.1rem; }
.document-empty strong { margin-top: 18px; color: #2b3951; font-family: var(--serif); font-size: 1.08rem; }
.document-empty p { max-width: 250px; margin: 8px 0 0; color: #7b8798; font-size: .65rem; }
.document-guidance { padding: 95px 0 110px; background: var(--blue); color: #fff; }
.documents-section-head.light h2 { color: #fff; }
.documents-section-head.light > p { color: rgba(255,255,255,.7); }
.guidance-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 52px; border-top: 1px solid rgba(255,255,255,.35); }
.guidance-grid article { min-height: 210px; padding: 25px 35px 25px 0; border-right: 1px solid rgba(255,255,255,.18); }
.guidance-grid article + article { padding-left: 35px; }
.guidance-grid span { color: rgba(255,255,255,.6); font-size: .62rem; font-weight: 800; }
.guidance-grid h3 { margin: 32px 0 8px; font-family: var(--serif); font-size: 1.2rem; }
.guidance-grid p { max-width: 280px; margin: 0; color: rgba(255,255,255,.7); font-size: .68rem; }

/* Use one lining, tabular numeral style for document counts and step markers. */
.documents-page :is(.documents-summary > div strong, .document-group > header b, .guidance-grid span) {
  font-family: var(--sans);
  font-weight: 700;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
  line-height: 1;
}

@media (min-width: 761px) {
  html[lang="en"] .documents-section-head h2 { font-size: clamp(1.4rem, 1.9vw, 2.1rem); letter-spacing: -.035em; line-height: 1.3; }
}

@media (max-width: 1100px) {
  .documents-hero-grid { grid-template-columns: 1fr 250px; gap: 45px; }
  .document-groups { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .documents-hero { padding: 68px 0; background: #f5f8fd; }
  .documents-hero-grid, .documents-section-head { display: block; }
  .documents-hero h1 { font-size: clamp(2.7rem, 12vw, 4.2rem); }
  html[lang="en"] .documents-hero h1 { font-size: clamp(1.75rem, 8vw, 2.25rem); letter-spacing: -.04em; line-height: 1.16; }
  html[lang="en"] .documents-section-head h2 { font-size: clamp(1.4rem, 6vw, 1.9rem); letter-spacing: -.035em; line-height: 1.3; }
  .documents-summary { margin-top: 50px; }
  .documents-index { padding-top: 76px; padding-bottom: 88px; }
  .documents-section-head > p { margin-top: 22px; }
  .document-group { min-height: auto; }
  .document-group > header { padding-inline: 20px; }
  .document-list { padding-inline: 20px; }
  .document-list a { grid-template-columns: 42px minmax(0, 1fr); min-height: 132px; }
  .document-action { grid-column: 2; margin-top: -20px; }
  .document-guidance { padding: 76px 0 90px; }
  .guidance-grid { grid-template-columns: 1fr; }
  .guidance-grid article, .guidance-grid article + article { min-height: 155px; padding: 24px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.18); }
  .guidance-grid h3 { margin-top: 20px; }
}