.compass-page,
.compass-page .site-header,
.compass-page .main-navigation,
.compass-page .menu-button,
.compass-page .site-footer { background: #f0eadd; }
.compass-page .site-header,
.compass-page .main-navigation,
.compass-page .site-footer { border-color: #d8d0c2; }
.compass-page .main-navigation a[aria-current="page"] { color: #5c1721; background: #e6cdc8; font-weight: 700; text-decoration: none; }
.compass-page h1,
.compass-page h2 { font-family: "Shippori Mincho", "Yu Mincho", "YuMincho", serif; }
.compass-page h1 { margin: 0 0 31px; font-size: clamp(39px, 5.2vw, 66px); line-height: 1.45; letter-spacing: .035em; }
.compass-page h1 > .hero-title-line { display: block; }
.compass-page h1 > .hero-title-meaning { white-space: nowrap; }
.compass-page h1 .hero-title-lead { display: inline; }
.compass-page h1 .hero-title-term { display: inline-block; white-space: nowrap; }
.compass-page h2 { margin: 0 0 27px; font-size: clamp(31px, 3.6vw, 45px); line-height: 1.55; letter-spacing: .025em; }
.compass-page h3 { font-size: 23px; line-height: 1.65; }
.compass-page p { max-width: 760px; }
.compass-reading { max-width: 780px; }
.section-marker { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; color: #5c1721; font-size: 14px; font-weight: 700; letter-spacing: .08em; }
.section-marker::before { content: ""; width: 28px; height: 1px; background: #5c1721; flex: 0 0 auto; }
.compass-section { padding: 88px 0; border-top: 1px solid #d8d0c2; }
.section-introduction { margin-bottom: 52px; }
.section-introduction > p:last-child { margin-bottom: 0; }

.compass-hero { padding: 94px 0 91px; border-bottom: 2px solid #5c1721; }
.hero-introduction { max-width: 720px; }
.hero-introduction p { margin-bottom: 20px; }
.hero-action { margin: 37px 0 0; }
.hero-action a { display: inline-block; padding: 12px 0 8px; color: #1c1f28; border-bottom: 2px solid #5c1721; font-weight: 700; text-decoration: none; }
.hero-action a:hover { color: #5c1721; }

.comparison-layout { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid #5c1721; border-bottom: 1px solid #d8d0c2; }
.comparison-layout section { padding: 36px 44px 40px 0; }
.comparison-layout section + section { padding-right: 0; padding-left: 44px; border-left: 1px solid #d8d0c2; }
.comparison-label { margin: 0 0 11px; color: #5c1721; font-size: 13px; font-weight: 700; letter-spacing: .08em; }
.comparison-layout h3 { margin-bottom: 20px; }
.comparison-layout ul { margin: 0; padding-left: 1.35em; }
.comparison-layout li + li { margin-top: 10px; }

.account-editorial { display: block; }
.account-ledger { border-top: 2px solid #5c1721; border-bottom: 1px solid #d8d0c2; }
.account-ledger-heading { display: flex; justify-content: space-between; gap: 30px; padding: 22px 0; border-bottom: 1px solid #d8d0c2; }
.account-ledger-heading p { margin: 0; }
.account-ledger-heading p:first-child { color: #5c1721; font-family: "Shippori Mincho", "Yu Mincho", serif; font-size: 24px; font-weight: 600; }
.account-ledger-heading p:last-child { font-size: 14px; text-align: right; }
.account-list { margin: 0; padding: 0; list-style: none; }
.account-list li { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 18px; padding: 27px 0 29px; }
.account-list li + li { border-top: 1px solid #d8d0c2; }
.account-index { align-self: start; margin-top: 5px; color: #5c1721; font-size: 17px; font-weight: 700; line-height: 1.2; letter-spacing: .04em; }
.account-list h3 { margin: 0 0 8px; text-wrap: balance; }
.account-transition-title { display: flex; flex-wrap: wrap; column-gap: .35em; row-gap: 0; }
.account-transition-unit { white-space: nowrap; }
.account-list p { margin: 0; font-size: 16px; }
.account-to-reserve { position: relative; width: 1px; height: 42px; margin: 0 auto; background: #5c1721; }
.account-to-reserve::after { content: ""; position: absolute; bottom: 0; left: -4px; width: 8px; height: 8px; border-right: 1px solid #5c1721; border-bottom: 1px solid #5c1721; transform: rotate(45deg); }
.reserve-fund { margin: 0; padding: 27px 0 32px; border-top: 2px solid #5c1721; border-bottom: 1px solid #d8d0c2; }
.reserve-label { margin: 0 0 9px; color: #5c1721; font-size: 14px; font-weight: 700; letter-spacing: .04em; }
.reserve-center { max-width: 680px; margin: 0 auto; text-align: center; }
.reserve-center h3 { margin: 0 0 12px; }
.reserve-center > p:last-child { margin: 0; font-size: 16px; }
.reserve-branch-lines { position: relative; height: 58px; margin: 0; }
.reserve-branch-lines::before { content: ""; position: absolute; top: 0; left: 50%; width: 1px; height: 32px; background: #5c1721; }
.reserve-branch-lines::after { content: ""; position: absolute; top: 40px; left: 25%; right: 25%; border-top: 1px solid #5c1721; }
.reserve-branch-lines span { position: absolute; z-index: 1; top: 25px; left: calc(50% - 4px); width: 8px; height: 8px; border-right: 1px solid #5c1721; border-bottom: 1px solid #5c1721; transform: rotate(45deg); }
.reserve-uses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; }
.reserve-uses section { position: relative; padding: 17px 20px 0; }
.reserve-uses section::before { content: ""; position: absolute; top: -18px; left: 50%; height: 18px; border-left: 1px solid #5c1721; }
.reserve-uses h4 { margin: 0 0 10px; font-size: 20px; line-height: 1.55; text-align: center; }
.reserve-uses p { max-width: 28em; margin: 0 auto; font-size: 16px; }
.app-preview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; max-width: 920px; margin-top: 42px; }
.app-preview-item { margin: 0; text-align: center; }
.app-preview-item img { display: block; width: min(100%, 300px); height: auto; margin: 0 auto; border: 1px solid #d8d0c2; border-radius: 2px; }
.app-preview-item figcaption { margin-top: 10px; color: #5b5749; font-size: 14px; font-weight: 700; }
.app-preview-note { margin: 30px 0 0; color: #5b5749; font-size: 14px; line-height: 1.7; }

.consultation-flow { position: relative; margin: 0; padding: 0; border-top: 2px solid #5c1721; border-bottom: 1px solid #d8d0c2; list-style: none; }
.consultation-flow::before { content: ""; position: absolute; z-index: 1; top: 0; bottom: 34px; left: 0; width: 1px; background: #5c1721; }
.consultation-flow li { position: relative; display: grid; grid-template-columns: 112px minmax(260px, .9fr) minmax(350px, 1.25fr); column-gap: 28px; align-items: start; padding: 30px 28px 32px 32px; }
.consultation-flow li + li { border-top: 1px solid #d8d0c2; }
.consultation-flow li::before { content: ""; position: absolute; z-index: 2; top: 39px; left: 0; width: 18px; border-top: 1px solid #5c1721; }
.consultation-flow li:not(:last-child)::after { content: ""; position: absolute; z-index: 2; bottom: 8px; left: -4px; width: 7px; height: 7px; background: #f0eadd; border-right: 1px solid #5c1721; border-bottom: 1px solid #5c1721; transform: rotate(45deg); }
.consultation-flow li:last-child { padding-bottom: 36px; }
.consultation-flow li:last-child::after { content: ""; position: absolute; bottom: 0; left: 0; width: 42%; border-bottom: 2px solid #5c1721; }
.flow-phase { margin: 0 0 15px; color: #5c1721; font-size: 14px; font-weight: 700; line-height: 1.4; letter-spacing: .05em; }
.consultation-flow h3 { margin: 0; font-size: 21px; line-height: 1.65; word-break: normal; }
.consultation-flow li:last-child h3 { font-size: 22px; font-weight: 700; }
.consultation-flow li > p:last-child { margin: 0; font-size: 16px; line-height: 1.9; }
.flow-keyword,
.flow-ending { word-break: keep-all; }


.judgment-section blockquote { margin: 38px 0; padding: 5px 0 5px 25px; border-left: 3px solid #5c1721; font-family: "Shippori Mincho", "Yu Mincho", serif; font-size: clamp(22px, 2.5vw, 28px); font-weight: 600; line-height: 1.8; }
.judgment-copy p { margin-bottom: 20px; }
.judgment-copy p:last-child { margin-bottom: 0; }
.audience-list { margin: 38px 0 0; padding: 0; border-top: 2px solid #5c1721; list-style: none; }
.audience-list li { padding: 19px 4px; border-bottom: 1px solid #d8d0c2; }

.faq-list { margin-top: 38px; border-top: 2px solid #5c1721; }
.faq-list details { border-bottom: 1px solid #d8d0c2; }
.faq-list summary { position: relative; padding: 22px 44px 22px 4px; cursor: pointer; font-weight: 700; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; top: 19px; right: 5px; color: #5c1721; font-size: 24px; font-weight: 400; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { margin: 0; padding: 0 44px 24px 4px; }

.compass-contact { border-top: 1px solid #d8d0c2; background: #f0eadd; }
.compass-contact .contact-introduction { max-width: 760px; }
.compass-contact .contact-introduction > p:last-child { margin-top: 20px; }

@media (min-width: 900px) {
  .compass-page h1 > .hero-title-line:last-child { white-space: nowrap; }
}

@media (max-width: 899px) {
  .consultation-flow { border-top-width: 1px; }
  .consultation-flow::before { bottom: 28px; width: 2px; }
  .consultation-flow li { display: block; padding: 23px 4px 25px 28px; }
  .consultation-flow li::before { top: 33px; width: 17px; }
  .consultation-flow li:not(:last-child)::after { bottom: 7px; left: -4px; }
  .consultation-flow li:last-child { padding-bottom: 31px; }
  .consultation-flow li:last-child::after { width: 54%; }
  .flow-phase { margin-bottom: 8px; }
  .consultation-flow h3 { margin-bottom: 13px; font-size: 19px; line-height: inherit; }
  .consultation-flow li:last-child h3 { font-size: 20px; }
  .consultation-flow li > p:last-child { font-size: 14px; line-height: 1.8; }
}

@media (max-width: 760px) {
  .compass-page h1 { font-size: clamp(34px, 10.3vw, 44px); }
  .compass-page h2 { font-size: 29px; }
  .compass-page h3 { font-size: 21px; }
  .compass-section { padding: 58px 0; }
  .compass-hero { padding: 60px 0 58px; }
  .section-introduction { margin-bottom: 35px; }
  .comparison-layout { grid-template-columns: 1fr; }
  .comparison-layout section { padding: 29px 0 31px; }
  .comparison-layout section + section { padding: 29px 0 31px; border-top: 1px solid #d8d0c2; border-left: 0; }
  .account-ledger-heading { display: block; }
  .account-ledger-heading p:first-child { margin-bottom: 5px; }
  .account-ledger-heading p:last-child { text-align: left; }
  .account-list li { grid-template-columns: 44px minmax(0, 1fr); gap: 11px; padding: 24px 0 26px; }
  .account-index { margin-top: 4px; font-size: 16px; letter-spacing: .03em; }
  .account-list h3 { overflow-wrap: normal; }
  .account-to-reserve { height: 37px; }
  .reserve-fund { padding: 25px 0 28px; }
  .reserve-center { text-align: left; }
  .reserve-branch-lines { height: 43px; }
  .reserve-branch-lines::before { left: 0; height: 35px; }
  .reserve-branch-lines::after { display: none; }
  .reserve-branch-lines span { top: 28px; left: -4px; }
  .reserve-uses { display: block; border-left: 1px solid #5c1721; }
  .reserve-uses section { padding: 17px 0 24px 27px; }
  .reserve-uses section::before { top: 29px; left: 0; width: 17px; height: 0; border-top: 1px solid #5c1721; border-left: 0; }
  .reserve-uses section + section { border-top: 1px solid #d8d0c2; }
  .reserve-uses section + section::after { content: ""; position: absolute; top: -11px; left: -4px; width: 7px; height: 7px; background: #f0eadd; border-right: 1px solid #5c1721; border-bottom: 1px solid #5c1721; transform: rotate(45deg); }
  .reserve-uses h4 { text-align: left; }
  .reserve-uses p { margin: 0; }
  .app-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 14px; margin-top: 34px; }
  .app-preview-item figcaption { margin-top: 8px; font-size: 13px; }
  .app-preview-note { margin-top: 26px; font-size: 13px; }
  .judgment-section blockquote { margin: 30px 0; padding-left: 18px; font-size: 21px; }
}

@media (max-width: 360px) {
  .compass-page h2 { font-size: 27px; }
  .account-list h3 { font-size: 19px; }
}

@media (max-width: 390px) {
  .compass-page h1 { font-size: 30px; }
  .compass-page h1 > .hero-title-meaning { letter-spacing: .02em; }
}

@media (max-width: 340px) {
  .compass-page h1 { font-size: 28px; }
}
.voices-link-section .voices-link-action { margin-top: 24px; }
.voices-link-section .voices-link-action a { font-weight: 700; }
