/* Local behavior and shared chrome around the reference page designs. */
.is-subpage #main { padding-top: 0; }
.is-subpage .reference-page { display: flex; flex-direction: column; align-items: center; width: 100%; }
.is-subpage .reference-page > .source-main { width: 100%; }
.is-subpage .reference-page .fa-arrow-right-long::before { content: "\f178"; }
.is-subpage .reference-page a[href]:focus-visible, .is-subpage .reference-page button:focus-visible, .is-subpage .reference-page input:focus-visible, .is-subpage .reference-page textarea:focus-visible, .is-subpage .reference-page select:focus-visible { outline: 3px solid var(--green-strong); outline-offset: 4px; }
.is-subpage .reference-page button[data-page-disclosure] { cursor: pointer; }
.is-subpage .reference-page [role="region"][hidden] { display: none !important; }
.header-nav .nav-link[aria-current="page"]::after, .has-dropdown.is-current > .nav-link::after { transform: scaleX(1); }
.is-subpage .reference-page .demo-note { display: block; align-self: center; width: min(900px,90%); margin: 20px auto; padding: 14px 18px; border: 1px solid #c9dfd1; border-radius: 8px; background: #f4f9f5; color: #3c5c49; font: 400 13px/1.9 var(--japanese); text-align: left; }
.is-subpage .reference-page .demo-error { display: block; align-self: stretch; width: 100%; color: #a33434; margin-top: 16px; font: 400 13px/1.8 var(--japanese); text-align: center; }
.is-subpage .reference-page .demo-error:empty { display: none; }
.is-subpage .reference-page [data-demo-field][aria-invalid="true"] { border-color: #b35050; }
.is-subpage .reference-page .demo-thanks-note { margin-top: 32px; text-align: center; }
html.has-page-reveals .is-subpage .reference-page [data-page-reveal] { opacity: 0; transform: translateY(10px); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
html.has-page-reveals .is-subpage .reference-page [data-page-reveal].is-revealed, html.has-page-reveals .is-subpage .reference-page [data-page-reveal]:focus-within { opacity: 1; transform: none; }
@media (max-width: 540px) { .is-subpage .reference-page .demo-note { font-size: 12px; padding: 12px 14px; } }
@media (prefers-reduced-motion: reduce) { html.has-page-reveals .is-subpage .reference-page [data-page-reveal] { opacity: 1; transform: none; } }
@media print { html.has-page-reveals .is-subpage .reference-page [data-page-reveal] { opacity: 1; transform: none; } }

/* Refinement: a quieter hierarchy, deliberate reading rhythm, generous targets. */
.is-subpage .reference-page { --page-line: #dfe8e2; --page-muted: #64716b; --page-tint: #f3f7f4; --page-accent: #0e7a61; overflow: visible; }
.is-subpage .reference-page > .source-main { margin-top: var(--header-height); overflow: visible; }
.is-subpage .reference-page :is(h1,h2,h3) { text-wrap: pretty; }
.is-subpage .reference-page [id] { scroll-margin-top: 68px; }
.is-subpage .reference-page :is(a,button,input,select,textarea) { -webkit-tap-highlight-color: transparent; }
.is-subpage .reference-page :is(a,button) { touch-action: manipulation; }
.is-subpage .reference-page .page-hero { position: relative; padding-top: 104px; }
.is-subpage .reference-page .page-heading { width: min(1280px,90%); max-width: none; margin: 0 auto; padding: 0; gap: 12px; }
.is-subpage .reference-page .index-hero .page-english { font: 500 clamp(54px,6.1vw,88px)/1.08 "Inter",sans-serif; letter-spacing: -.045em; }
.is-subpage .reference-page .index-hero .page-title { font-size: 17px; line-height: 1.8; letter-spacing: .06em; }
.is-subpage .reference-page .detail-hero .page-title { font-size: clamp(30px,3.6vw,52px); line-height: 1.45; letter-spacing: .015em; font-weight: 600; }
.is-subpage .reference-page .detail-hero .page-english { color: var(--page-accent); font: 500 13px/1.8 "Inter",sans-serif; letter-spacing: .12em; }
.is-subpage .reference-page .page-rule { width: min(1360px,90%); margin-top: 48px; background: var(--page-line); height: 1px; }
.page-breadcrumb { color: var(--page-muted); font: 400 12px/1.8 var(--japanese); letter-spacing: .02em; }
.page-hero > .page-breadcrumb { position: absolute; top: 28px; left: 50%; width: min(1280px,90%); transform: translateX(-50%); }
.page-breadcrumb ol { display: flex; align-items: center; flex-wrap: nowrap; gap: 11px; min-width: 0; }
.page-breadcrumb li { display: flex; align-items: center; min-width: 0; gap: 11px; }
.page-breadcrumb li:not(:last-child) { flex-shrink: 0; }
.page-breadcrumb li:not(:last-child)::after { content: '/'; color: #bbc9c0; }
.page-breadcrumb li:last-child span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.page-breadcrumb a { padding: 4px 0; transition: color 180ms; }
.page-breadcrumb a:hover { color: var(--page-accent); text-decoration: underline; text-underline-offset: 5px; }
.page-section-nav { position: sticky; top: calc(var(--header-height) + 12px); z-index: 3; display: flex; align-self: center; gap: 4px; width: max-content; max-width: 90%; margin: 28px auto 0; padding: 5px; border: 1px solid var(--page-line); border-radius: 12px; background: rgb(255 255 255 / 96%); box-shadow: 0 5px 22px rgb(23 64 44 / 4%); overflow: auto; scrollbar-width: thin; }
.page-section-nav a { flex: 0 0 auto; display: flex; align-items: center; min-height: 42px; padding: 8px 20px; border-radius: 7px; color: #5b6861; font-size: 13px; line-height: 1.6; transition: color 180ms,background 180ms; }
.page-section-nav a:hover { color: var(--page-accent); background: #f3f7f4; }
.page-section-nav a[aria-current="location"] { color: var(--page-accent); background: #edf5ef; font-weight: 600; }
.is-subpage .reference-page .page-cta, .is-subpage .reference-page [data-demo-submit], .is-subpage .reference-page .thanks-section a { min-height: 56px; background: var(--page-accent); color: white; border-radius: 10px; box-shadow: 0 4px 12px rgb(17 94 64 / 6%); transition: background 200ms,box-shadow 200ms,transform 200ms; }
.is-subpage .reference-page .page-cta:hover, .is-subpage .reference-page [data-demo-submit]:hover, .is-subpage .reference-page .thanks-section a:hover { background: #09644f; box-shadow: 0 7px 20px rgb(17 94 64 / 14%); transform: translateY(-2px); }
.is-subpage .reference-page .page-cta:active, .is-subpage .reference-page [data-demo-submit]:active { transform: translateY(0); }
.is-subpage .reference-page .page-cta :is(p,i), .is-subpage .reference-page [data-demo-submit] p, .is-subpage .reference-page .thanks-section a :is(p,i) { color: white; }
.is-subpage .reference-page .page-cta i, .is-subpage .reference-page .page-text-link i { transition: transform 220ms var(--ease); }
.is-subpage .reference-page .page-cta:hover i, .is-subpage .reference-page .page-text-link:hover i { transform: translateX(4px); }
.is-subpage .reference-page .page-contact-section > .sd { border: 1px solid rgb(255 255 255 / 70%); }
.is-subpage .reference-page .page-contact-section h2 { font-size: 16px; letter-spacing: .04em; }
.is-subpage .reference-page .page-text-link { min-height: 44px; color: var(--page-accent); }
/* Services: retain the image and row composition, make the entire row a link. */
.is-subpage .reference-page .service-list { gap: 20px; }
.service-card-shell { width: 100%; list-style: none; }
.is-subpage .reference-page .service-card { position: relative; width: 100%; gap: 36px; padding: 26px 20px 32px; border: 1px solid transparent; border-bottom-color: var(--page-line); border-radius: 14px; background: white; transition: background 220ms,border-color 220ms,box-shadow 220ms; }
.is-subpage .reference-page .service-card-image { border-radius: 10px; align-self: center; aspect-ratio: 16 / 9; height: auto; object-fit: cover; transition: transform 350ms var(--ease); }
.is-subpage .reference-page .service-card-body { gap: 20px; min-width: 0; }
.is-subpage .reference-page .service-card-title { color: #253b30; font-family: var(--japanese-bold); font-size: clamp(21px,1.9vw,28px); font-weight: 600; line-height: 1.6; transition: color 180ms; }
.is-subpage .reference-page .service-card-body > p { font-size: 15px; line-height: 2; color: #4f5b54; }
.is-subpage .reference-page .service-card-body > p br { display: none; }
.is-subpage .reference-page .service-card-action { flex-shrink: 0; color: var(--page-accent); }
.is-subpage .reference-page .service-card-action > div:last-child { width: 44px; height: 44px; color: var(--page-accent); border: 1px solid #a4c6b5; transition: background 200ms,border-color 200ms; }
.is-subpage .reference-page .service-card-action p { color: var(--page-accent); font-size: 12px; letter-spacing: .02em; }
.is-subpage .reference-page .service-card-action i { color: var(--page-accent); transition: transform 200ms; }
.is-subpage .reference-page .service-tags { gap: 8px; }
.is-subpage .reference-page .service-tags li { background: #f1f4f0; border-radius: 4px; padding: 4px 10px; }
.is-subpage .reference-page .service-tags p { color: #526354; font-size: 12px; line-height: 1.8; }
.is-subpage .reference-page .service-card:focus-visible { outline-offset: 2px; }
@media (hover:hover) {
  .is-subpage .reference-page .service-card:hover { background: #f8faf7; border-color: #dae7dd; box-shadow: 0 8px 28px rgb(40 75 48 / 4%); }
  .is-subpage .reference-page .service-card:hover .service-card-image { transform: scale(1.012); }
  .is-subpage .reference-page .service-card:hover .service-card-action > div:last-child { background: var(--page-accent); border-color: var(--page-accent); }
  .is-subpage .reference-page .service-card:hover .service-card-action i { color: white; transform: translateX(2px); }
}
.is-subpage .reference-page .record-value { color: #214d3b; font-size: clamp(30px,4vw,52px); font-weight: 600; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
/* News rows show their direction without relying on a tiny button. */
.is-subpage .reference-page .news-row { position: relative; width: 100%; min-height: 90px; padding: 25px 68px 25px 0; border-bottom: 1px solid var(--page-line); transition: background 180ms,padding 180ms; }
.is-subpage .reference-page .news-row > div { flex-shrink: 0; width: auto; min-width: 116px; gap: 0; }
.is-subpage .reference-page .news-row h3 { min-width: 0; color: #303c34; font-size: 16px; line-height: 1.8; font-weight: 400; }
.is-subpage .reference-page .news-row p { color: var(--page-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.is-subpage .reference-page .row-arrow { position: absolute; right: 5px; top: 50%; display: grid; place-items: center; width: 36px; height: 36px; margin-top: -18px; border: 1px solid #d3e1d7; border-radius: 50%; color: var(--page-accent); font: 400 20px/1 "Inter",sans-serif; transition: background 180ms,color 180ms,transform 180ms; }
.is-subpage .reference-page .news-row:hover { background: #f7faf7; padding-left: 14px; }
.is-subpage .reference-page .news-row:hover .row-arrow { background: var(--page-accent); color: white; transform: translate(2px,-2px); }
.is-subpage .reference-page .listing-label { min-height: 36px; padding: 7px 14px; border: 1px solid #d8e4da; border-radius: 6px; background: #f1f6f0; color: #41634f; font-size: 13px; }
/* Case studies: consistent logo frames and an honest preparing state. */
.is-subpage .reference-page .case-grid { align-items: stretch; }
.is-subpage .reference-page .case-item { display: flex; align-items: stretch; }
.is-subpage .reference-page .case-card { position: relative; flex: 1; gap: 0; height: 100%; padding-bottom: 24px; overflow: hidden; border: 1px solid #e0e8e1; border-radius: 14px; background: white; box-shadow: 0 4px 18px rgb(30 60 35 / 3%); transition: box-shadow 240ms,transform 240ms,border-color 240ms; }
.is-subpage .reference-page .case-image { width: 100%; height: auto; aspect-ratio: 8 / 5; overflow: hidden; background: #fff; border-bottom: 1px solid #edf1eb; }
.is-subpage .reference-page .case-image img { width: 100%; height: 100%; max-height: none; object-fit: contain; padding: 16px; transition: transform 400ms var(--ease); }
.is-subpage .reference-page .case-card > div:not(.case-image) { padding: 24px 22px 12px; gap: 12px; }
.is-subpage .reference-page .case-card h2, .is-subpage .reference-page .case-card h3 { color: #263b2f; font-size: 20px; font-weight: 600; line-height: 1.65; }
.is-subpage .reference-page .case-card p { font-size: 12px; color: #64716b; }
.is-subpage .reference-page .case-action { display: flex; align-items: center; justify-content: space-between; align-self: stretch; gap: 16px; margin: auto 22px 0; padding-top: 16px; border-top: 1px solid #e7eee6; color: var(--page-accent); font-size: 13px; }
.is-subpage .reference-page .case-action > span { font-size: 20px; }
.is-subpage .reference-page .case-card.is-pending { box-shadow: none; background: #fafbf8; }
.is-subpage .reference-page .is-pending h2 { color: #748477; font: 500 24px/1.4 "Inter",sans-serif; }
@media (hover:hover) {
 .is-subpage .reference-page a.case-card:hover { transform: translateY(-4px); border-color: #a7c6b2; box-shadow: 0 12px 30px rgb(30 60 35 / 9%); }
 .is-subpage .reference-page a.case-card:hover img { transform: scale(1.035); }
}
/* Editorial pages keep a calm, comfortable measure. */
.is-subpage .reference-page .article-page > .page-breadcrumb { width: min(840px,90%); margin: 30px auto 0; }
.is-subpage .reference-page .article-shell { align-self: center; width: min(840px,90%); max-width: none; margin: 0 auto; padding: 46px 0 100px; }
.is-subpage .reference-page .article-title { width: 100%; color: #263b2f; font-family: var(--japanese-bold); font-size: clamp(27px,2.75vw,40px); font-weight: 600; line-height: 1.6; letter-spacing: .015em; text-align: left; padding-bottom: 24px; }
.is-subpage .reference-page .article-header { width: 100%; }
.is-subpage .reference-page .page-date { color: var(--page-muted); font: 400 13px/1.8 "Inter",sans-serif; font-variant-numeric: tabular-nums; }
.is-subpage .reference-page .article-body { align-self: center; width: min(100%,760px); max-width: none; color: #39453d; font-size: 16px; line-height: 2.05; letter-spacing: .025em; overflow-wrap: anywhere; }
.is-subpage .reference-page .article-body p { margin: 0 0 1.6em; line-height: inherit; }
.is-subpage .reference-page .article-body h2 { position: relative; margin: 2.5em 0 1em; padding-left: 18px; color: #244b37; font-size: clamp(22px,2vw,28px); font-weight: 600; line-height: 1.7; }
.is-subpage .reference-page .article-body h2::before { position: absolute; content: ''; left: 0; top: .25em; bottom: .25em; width: 3px; border-radius: 2px; background: #7bac8a; }
.is-subpage .reference-page .article-body h3 { margin: 2em 0 .8em; color: #244b37; font-size: 20px; line-height: 1.8; }
.is-subpage .reference-page .article-body a { color: var(--page-accent); text-decoration-color: #9cbca8; text-underline-offset: 5px; }
.is-subpage .reference-page .article-body img { margin: 28px auto; max-height: 520px; width: 100%; object-fit: contain; border-radius: 8px; }
.is-subpage .reference-page .article-cover { align-self: center; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: contain; border: 1px solid #edf1eb; border-radius: 14px; margin: 32px 0 40px; }
.article-contents { width: min(100%,760px); align-self: center; display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 0 0 36px; padding: 22px 26px; background: #f5f7f2; border: 1px solid #e3e9de; border-radius: 10px; font-size: 13px; line-height: 1.8; }
.article-contents p { width: 100%; color: #5e7162; font-size: 12px; }
.article-contents a { color: var(--page-accent); text-decoration: underline; text-decoration-color: #c1d6c5; text-underline-offset: 5px; }
.is-subpage .reference-page .article-back { min-height: 52px; margin-top: 24px; padding: 12px 24px; border: 1px solid #cadcce; border-radius: 8px; color: var(--page-accent); transition: background 180ms; }
.is-subpage .reference-page .article-back:hover { background: #f1f6f0; }
.is-subpage .reference-page .pending-story .article-title { text-align: center; }
.is-subpage .reference-page .pending-story .article-cover { max-width: 600px; max-height: 280px; margin-bottom: 24px; border: none; }
.pending-message { text-align: center; line-height: 2; }
.pending-message > span { display: inline-block; padding: 3px 14px; border-radius: 30px; background: #edf3e9; color: #54705a; font-size: 12px; }
.pending-message p { margin: 20px 0 28px; color: #5d6a61; font-size: 15px; }
.pending-message a { display: inline-flex; gap: 32px; padding: 12px 24px; border: 1px solid #c5d9ca; border-radius: 8px; color: var(--page-accent); font-size: 14px; }
/* Company and policy: clarity without changing the original visual story. */
.is-subpage .reference-page .message-copy, .is-subpage .reference-page .philosophy-copy { color: #445147; font-size: 16px; line-height: 2.1; letter-spacing: .025em; }
.is-subpage .reference-page .company-photo { border-radius: 14px; }
.is-subpage .reference-page .partner-card { padding: 20px; border: 1px solid #e4ebe3; border-radius: 12px; }
.is-subpage .reference-page .partner-card > img { width: 100%; height: auto; aspect-ratio: 8/5; object-fit: contain; }
.is-subpage .reference-page .policy-body { width: min(800px,90%); max-width: none; gap: 32px; padding-top: 64px; }
.is-subpage .reference-page .policy-body > p, .is-subpage .reference-page .policy-section > p { color: #445147; font-size: 15px; line-height: 2.1; }
.is-subpage .reference-page .policy-section { width: 100%; padding-bottom: 28px; border-bottom: 1px solid #e6ece4; }
.is-subpage .reference-page .policy-section h2 { color: #2d4a36; font-size: 19px; line-height: 1.8; font-weight: 600; }
/* FAQ: clear states, useful search, no decorative motion. */
.is-subpage .reference-page .faq-layout { overflow: visible; }
.faq-search { width: 100%; max-width: 760px; align-self: center; margin: 0 auto 28px; }
.faq-search > label { display: block; margin-bottom: 12px; font-size: 14px; color: #405c49; }
.faq-search-field { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 0 18px; border: 1px solid #bfcfc3; border-radius: 10px; background: white; box-shadow: 0 3px 12px rgb(35 70 42 / 3%); transition: border-color 180ms,box-shadow 180ms; }
.faq-search-field:focus-within { border-color: var(--page-accent); box-shadow: 0 0 0 3px #e2eee5; }
.faq-search-field > span { color: #6c8572; font: 32px/1 serif; }
.faq-search input { flex: 1; width: 0; min-width: 0; height: 56px; padding: 0; border: 0; outline: none !important; background: transparent; color: #2b4032; font: 400 16px/1.7 var(--japanese); }
.faq-search input::-webkit-search-cancel-button { display: none; }
.faq-search-field button { flex: 0 0 auto; min-width: 48px; min-height: 40px; border-radius: 5px; background: #f0f5ef; color: #41654c; font-size: 12px; }
.faq-result-count { margin: 12px 0 0; color: #627767; font-size: 12px; line-height: 1.8; }
.faq-empty { padding: 36px 16px 10px; text-align: center; font-size: 14px; line-height: 1.9; }
.faq-empty a { display: inline-flex; gap: 24px; margin-top: 18px; padding: 10px 18px; border: 1px solid #c4d6c7; border-radius: 6px; color: var(--page-accent); }
.is-subpage .reference-page .faq-categories { position: sticky; z-index: 3; top: calc(var(--header-height) + 12px); flex-wrap: nowrap; justify-content: flex-start; align-self: center; gap: 8px; max-width: 100%; width: max-content; margin-bottom: 40px; padding: 8px; border: 1px solid #e1e8df; border-radius: 10px; background: rgb(255 255 255 / 97%); overflow: auto; scrollbar-width: thin; box-shadow: 0 3px 15px rgb(35 70 42 / 3%); }
.is-subpage .reference-page .faq-categories li { flex-shrink: 0; }
.is-subpage .reference-page .faq-categories a { display: flex; min-height: 40px; padding: 8px 12px; border: 0; border-radius: 6px; background: transparent; color: #5a7160; font-size: 13px; white-space: nowrap; }
.is-subpage .reference-page .faq-categories a:hover, .is-subpage .reference-page .faq-categories a[aria-current="location"] { background: #edf5ec; color: #175d3d; }
.is-subpage .reference-page .faq-box { border: 1px solid #e1e9e1; border-radius: 10px; overflow: hidden; background: white; transition: border-color 180ms,box-shadow 180ms; }
.is-subpage .reference-page .faq-box:has([aria-expanded="true"]) { border-color: #b8d1bd; box-shadow: 0 5px 18px rgb(24 70 38 / 4%); }
.is-subpage .reference-page .faq-question { min-height: 76px; gap: 18px; padding: 20px 24px; background: white; }
.is-subpage .reference-page .faq-question:hover { background: #f8faf6; }
.is-subpage .reference-page .faq-question > span:first-child { color: var(--page-accent); font-family: "Inter",sans-serif; font-size: 16px; }
.is-subpage .reference-page .faq-question > span:nth-child(2) { flex: 1; color: #344b3b; font-size: 15px; line-height: 1.85; font-weight: 500; }
.is-subpage .reference-page .faq-answer { padding: 4px 24px 24px; background: white; }
.is-subpage .reference-page .faq-answer p { font-size: 15px; line-height: 2; color: #526056; }
/* Forms: labels, errors and focus are part of the composition. */
.is-subpage .reference-page .contact-form { width: min(760px,100%); gap: 30px; padding: 32px 0 0; }
.is-subpage .reference-page .form-field { width: 100%; gap: 10px; margin: 0; padding: 0; border: 0; min-width: 0; }
.is-subpage .reference-page .form-name-group legend { display: flex; align-items: center; gap: 12px; float: left; width: 100%; margin: 0 0 10px; padding: 0; }
.is-subpage .reference-page .name-inputs { display: flex; align-items: flex-start; width: 100%; gap: 12px; }
.name-input { display: flex; flex: 1; flex-direction: column; min-width: 0; gap: 8px; }
.is-subpage .reference-page [data-demo-field]:not([type="checkbox"]) { width: 100%; min-width: 0; min-height: 54px; padding: 14px 16px; border: 1px solid #c9d5cb; border-radius: 7px; background: #fcfdfb; color: #293e30; font: 400 16px/1.7 var(--japanese); box-shadow: 0 1px 2px rgb(35 70 42 / 2%); transition: border-color 180ms,box-shadow 180ms,background 180ms; }
.is-subpage .reference-page [data-demo-field]:not([type="checkbox"]):focus { border-color: #3a8a62; background: white; box-shadow: 0 0 0 3px #e5efe5; outline: none; }
.is-subpage .reference-page [data-demo-field]::placeholder { color: #89968b; opacity: 1; }
.is-subpage .reference-page textarea[data-demo-field] { height: auto; min-height: 180px; resize: vertical; }
.is-subpage .reference-page [data-demo-field][aria-invalid="true"] { border-color: #b04738; background: #fffafa; }
.is-subpage .reference-page .field-error { align-self: flex-start; display: block; width: 100%; color: #a23d30; font-size: 12px; line-height: 1.7; text-align: left; }
.is-subpage .reference-page .demo-error { margin: 0; padding: 16px 20px; border: 1px solid #e8ccc5; border-radius: 8px; background: #fdf7f3; color: #933b2d; font-size: 13px; line-height: 1.9; text-align: left; }
.demo-error ul { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 2px 18px; }
.demo-error a { text-decoration: underline; text-underline-offset: 4px; }
.is-subpage .reference-page .consent-field { position: relative; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 12px 0; }
.is-subpage .reference-page input[type="checkbox"] { width: 20px; height: 20px; margin: 0; accent-color: var(--page-accent); cursor: pointer; flex-shrink: 0; }
.is-subpage .reference-page .consent-field .field-error { order: 3; text-align: center; }
.is-subpage .reference-page .consent-field a { color: var(--page-accent); text-decoration: underline; text-underline-offset: 4px; }
.is-subpage .reference-page .consent-field > div { width: auto; }
.is-subpage .reference-page .demo-note { width: min(760px,100%); border-color: #dce6d8; border-radius: 8px; background: #f5f8f1; color: #58705c; font-size: 12px; text-align: left; }
.is-subpage .reference-page [data-demo-submit] { width: min(360px,100%); margin-top: 0; font-size: 15px; }
.completion-mark { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 26px; border: 1px solid #c3dbc9; border-radius: 50%; background: #f0f7ee; color: #2d7750; font: 400 30px/1 "Inter",sans-serif; }
.is-subpage .reference-page .thanks-section h2 { color: #2f4b36; font-size: clamp(22px,2.4vw,30px); line-height: 1.7; }
.is-subpage .reference-page .thanks-description { max-width: 520px; margin: 0 auto; color: #5b6b5f; font-size: 15px; line-height: 2; text-align: center; }
/* Keep reading progress subordinate to the actual navigation. */
body.is-reading::after { content: ''; position: fixed; z-index: 6; top: var(--header-height); left: 0; width: var(--reading-progress,0%); height: 2px; background: #4f9e70; pointer-events: none; }
@media (max-width:840px) {
 .is-subpage .reference-page .page-hero { padding-top: 88px; }
 .is-subpage .reference-page .index-hero .page-english { font-size: clamp(50px,8vw,68px); }
 .is-subpage .reference-page .page-rule { margin-top: 36px; }
 .is-subpage .reference-page .service-card { gap: 24px; padding: 22px 12px 28px; }
 .is-subpage .reference-page .service-card-body > p { font-size: 14px; }
 .is-subpage .reference-page .article-shell { padding-top: 32px; padding-bottom: 64px; }
 .is-subpage .reference-page .article-title { font-size: 30px; }
 .is-subpage .reference-page .article-body { font-size: 15px; line-height: 2.05; }
 .is-subpage .reference-page .message-copy, .is-subpage .reference-page .philosophy-copy { font-size: 15px; line-height: 2; }
 .is-subpage .reference-page .faq-question { padding: 18px; }
 .is-subpage .reference-page .faq-answer { padding: 2px 18px 22px; }
 .page-section-nav { max-width: 90%; justify-content: flex-start; }
 .page-section-nav a { min-height: 40px; padding: 8px 14px; font-size: 12px; }
}
@media (max-width:540px) {
 .is-subpage .reference-page .page-heading { gap: 8px; }
 .is-subpage .reference-page .page-hero { padding-top: 78px; }
 .page-hero > .page-breadcrumb { top: 21px; }
 .page-breadcrumb { font-size: 10px; }
 .page-breadcrumb ol,.page-breadcrumb li { gap: 8px; }
 .is-subpage .reference-page .index-hero .page-title { font-size: 14px; }
 .is-subpage .reference-page .page-rule { margin-top: 30px; }
 .is-subpage .reference-page .detail-hero .page-title { font-size: 29px; line-height: 1.5; }
 .is-subpage .reference-page .detail-hero .page-english { font-size: 11px; }
 .is-subpage .reference-page .service-list { gap: 16px; }
 .is-subpage .reference-page .service-card { padding: 0 0 26px; gap: 20px; border-radius: 10px 10px 0 0; border-left: 0; border-right: 0; border-top: 0; }
 .is-subpage .reference-page .service-card-image { width: 100%; }
 .is-subpage .reference-page .service-card-body { gap: 14px; }
 .is-subpage .reference-page .service-card-title { font-size: 20px; }
 .is-subpage .reference-page .service-tags { gap: 6px; }
 .is-subpage .reference-page .service-tags li { padding: 3px 8px; }
 .is-subpage .reference-page .service-tags p { font-size: 11px; }
 .is-subpage .reference-page .news-row { min-height: 104px; padding: 22px 44px 22px 0; gap: 8px; }
 .is-subpage .reference-page .news-row h3 { font-size: 14px; line-height: 1.9; }
 .is-subpage .reference-page .news-row p { font-size: 12px; }
 .is-subpage .reference-page .row-arrow { width: 30px; height: 30px; margin-top: -15px; font-size: 17px; right: 0; }
 .is-subpage .reference-page .case-card > div:not(.case-image) { padding: 22px 20px 16px; }
 .is-subpage .reference-page .case-action { margin-left: 20px; margin-right: 20px; }
 .is-subpage .reference-page .article-title { font-size: 27px; line-height: 1.65; padding-bottom: 20px; }
 .is-subpage .reference-page .article-body { font-size: 15px; letter-spacing: .015em; }
 .is-subpage .reference-page .article-cover { margin: 24px 0 30px; }
 .article-contents { gap: 10px; flex-direction: column; padding: 18px; font-size: 12px; }
 .is-subpage .reference-page .faq-categories { gap: 4px; padding: 5px; border-radius: 8px; margin-bottom: 32px; }
 .is-subpage .reference-page .faq-categories a { min-height: 40px; padding: 8px 10px; font-size: 12px; }
 .is-subpage .reference-page .faq-question { gap: 12px; padding: 16px; min-height: 78px; }
 .is-subpage .reference-page .faq-question > span:nth-child(2) { font-size: 14px; }
 .is-subpage .reference-page .faq-answer { padding: 2px 16px 20px; }
 .is-subpage .reference-page .faq-answer p { font-size: 14px; }
 .faq-search { margin-bottom: 24px; }
 .faq-search input { font-size: 14px; }
 .is-subpage .reference-page .policy-body { padding-top: 40px; gap: 26px; }
 .is-subpage .reference-page .policy-section h2 { font-size: 17px; }
 .is-subpage .reference-page .policy-body > p,.is-subpage .reference-page .policy-section > p { font-size: 14px; line-height: 2; }
 .is-subpage .reference-page .contact-form { gap: 26px; padding-top: 12px; }
 .is-subpage .reference-page .demo-note { margin: 16px auto 24px; line-height: 1.9; }
 .is-subpage .reference-page .thanks-description { font-size: 14px; }
 .is-subpage .reference-page .consent-field { gap: 8px; }
 .is-subpage .reference-page .consent-field > div { flex-wrap: wrap; }
}
@media (prefers-reduced-motion:reduce) {
 .is-subpage .reference-page *, .is-subpage .reference-page *::before, .is-subpage .reference-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media print { .page-section-nav,.faq-search,.faq-categories,body.is-reading::after { display: none !important; } .is-subpage .reference-page .faq-answer[hidden] { display: flex !important; } }

/* Keep row dimensions explicit when the source's list layout becomes a link. */
.is-subpage .reference-page .service-card { display: grid; grid-template-columns: 32% minmax(0,1fr); gap: 36px; }
.is-subpage .reference-page .service-card-image, .is-subpage .reference-page .service-card-body { width: 100%; max-width: none; margin: 0; }
.page-breadcrumb ol { margin: 0; padding: 0; list-style: none; }
@media (max-width:840px) { .is-subpage .reference-page .service-card { gap: 24px; } }
@media (max-width:540px) { .is-subpage .reference-page .service-card { display: flex; flex-direction: column; gap: 20px; } }
.is-subpage .reference-page .faq-layout { gap: 0; padding-top: 48px; }
@media (max-width:540px) { .is-subpage .reference-page .faq-layout { padding-top: 32px; } }
.is-subpage .reference-page .contact-form { margin: 0; }
.is-subpage .reference-page [data-demo-field]:not([type="checkbox"]) { max-width: none; }
.is-subpage .reference-page .required-tag { padding: 1px 6px; border-radius: 3px; background: #f8eeea; color: #8d4a3d; font-size: 10px; line-height: 1.8; }
.is-subpage .reference-page .case-facts { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; width: auto; }
.is-subpage .reference-page .case-facts > span { width: auto; padding: 3px 9px; border-radius: 4px; background: #f2f5ef; color: #5c7060; font-size: 12px; }
.is-subpage .reference-page .case-facts > span:first-child { width: 100%; padding: 0 0 4px; background: transparent; color: #3b5645; font-size: 15px; }
.is-subpage .reference-page .pending-story .article-title { justify-content: center; text-align: center; }
.is-subpage .reference-page .page-hero { width: 100%; max-width: none; }
.is-subpage .reference-page .case-meta { flex-wrap: wrap; gap: 16px; width: 100%; }
.is-subpage .reference-page .case-facts { flex: 1 1 400px; min-width: 0; }
.is-subpage .reference-page .case-facts > span { justify-content: flex-start; text-align: left; }
.is-subpage .reference-page .article-body > h2:first-child { margin-top: 0; }
.is-subpage .reference-page .reading-copy { font-size: 16px; line-height: 2.05; color: #445147; }
@media (max-width:540px) {
 .is-subpage .reference-page .case-meta .page-date { width: 100%; justify-content: flex-end; }
 .is-subpage .reference-page .reading-copy { font-size: 15px; line-height: 2; }
}
.faq-search { width: min(760px,90%); max-width: none; }
.is-subpage .reference-page .faq-categories { max-width: 90%; margin: 0 auto 40px; }
@media (max-width:540px) {
 .faq-search input { font-size: 16px; }
 .faq-search input::placeholder { font-size: 13px; }
 .is-subpage .reference-page .faq-categories { margin-bottom: 32px; }
}
.is-subpage .reference-page .form-select-wrap { display: block; position: relative; width: 100%; }
.is-subpage .reference-page .form-select-wrap select { padding-right: 44px; appearance: none; }
.is-subpage .reference-page .form-select-wrap i { position: absolute; top: 50%; right: 16px; transform: translateY(-50%); pointer-events: none; }
.demo-error :is(p,ul,li,a) { font: inherit; line-height: 1.9; }
.is-subpage .reference-page .demo-thanks-note { width: min(760px,90%); margin: 24px auto 0; text-align: center; }
.is-subpage .reference-page .case-card.is-pending { cursor: default; }
.is-subpage .reference-page .listing-label { cursor: default; }
.is-subpage .reference-page [tabindex="-1"]:focus { outline: none; }
