/* Source desktop geometry: full-bleed banner, 45px utility strip, centered 1200px content. */
/* The imported legacy stylesheet fixes body at 1100px. Modern desktop pages
   are fluid and must be allowed to contract when the browser window narrows. */
body { min-width: 0; }
body:has(.source-home-main) .utility-bar { display:block; height:45px; padding:0; background:#f6f6f6; }
body:has(.source-home-main) .utility-bar__inner { max-width:1200px; height:45px; }
body:has(.source-home-main) .utility-bar__welcome { display:none; }
body:has(.source-home-main) .utility-bar__phone { font-size:0; }
body:has(.source-home-main) .utility-bar__phone::before { content:'9:00am-6:00pm'; color:#777; font-size:13px; }
body:has(.source-home-main) .utility-bar__phone a { display:none; }
body:has(.source-home-main) .primary-nav { top:45px; }
body:has(.source-home-main) .source-home-banner { width:100vw; max-width:none; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
body:has(.source-home-main) .source-home-banner .banner-slide img { width:100vw; max-width:none; max-height:none; height:500px; object-fit:cover; object-position:center 42%; }
body:has(.source-home-main) .source-home-sci { width:100vw; max-width:none; height:162px; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); display:flex; align-items:center; }
body:has(.source-home-main) .source-home-sci .index_sci_div { width:1200px; height:100%; margin:0 auto; box-sizing:border-box; }

/* The legacy about markup is rendered inside the modern detail card. Keep the
   nested legacy wrapper constrained to that card instead of its old 1200px
   desktop canvas, which otherwise overlaps the consultation column. */
.detail-article .main {
  width: 100%;
  max-width: 100%;
  margin: 0;
}
.detail-article .translationEdit-about {
  display: grid;
  grid-template-columns: 231px minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.detail-article .translationEdit-about > .side,
.detail-article .translationEdit-about > .content {
  float: none;
  display: block;
  width: auto;
  min-width: 0;
  margin: 0;
}
.detail-article .translationEdit-about > .side { margin-top: 28px; }
.detail-article .translationEdit-about > .content {
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.detail-article .translationEdit-about .page-location { margin-bottom: 20px; }
.detail-article .translationEdit-about .about-content {
  max-width: 100%;
  box-sizing: border-box;
  margin-top: 44px;
  margin-bottom: 65px;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Payment and message forms render legacy about markup inside the copy column.
   Constrain the old fixed-width .main wrapper before its child grid is laid
   out, otherwise the dashed payment details row overflows into the form. */
.public-form-copy .main {
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}
.public-form-copy .translationEdit-about {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.public-form-copy .message-content {
  width: 100%;
  max-width: 100%;
  margin: 55px auto;
  box-sizing: border-box;
  overflow-wrap: anywhere;
}
.public-form-copy .message-content .text,
.public-form-copy .message-content .thanks {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Source about/service pages: keep the legacy left body and the target consultation card in one aligned row. */
body:has(.legacy-about-page) { background: #f3f6f9; }
.legacy-about-page { padding: 70px 0 80px; }
.legacy-about-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 45px; align-items: start; }
.legacy-about-source { min-width: 0; padding: 0 45px; background: #fff; }
.legacy-about-source .main { width: 100%; margin: 0 auto 40px; }
.legacy-about-source .main .side { width: 231px; margin-right: 40px; }
.legacy-about-source .main .content { width: calc(100% - 271px); }
.legacy-about-source .translationEdit-about {
  display: grid;
  grid-template-columns: 231px minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  width: 100%;
}
.legacy-about-source .translationEdit-about > .side,
.legacy-about-source .translationEdit-about > .content {
  float: none;
  display: block;
  width: auto;
  min-width: 0;
  margin: 0;
}
.legacy-about-source .translationEdit-about > .content {
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.legacy-about-source .main .content .page-location { margin-bottom: 20px; }
.legacy-about-source .translationEdit-about .about-content {
  max-width: 100%;
  box-sizing: border-box;
  margin-top: 44px;
  margin-bottom: 65px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.legacy-about-layout .detail-consultation { position: sticky; top: 126px; min-height: 210px; box-sizing: border-box; }

/* Employee verification keeps the source about-page column and places the live
   verification form beside it, matching the source page's two-column rhythm. */
.employee-verify-panel {
  box-sizing: border-box;
  padding: 32px 34px 34px;
  background: #fff;
  border: 1px solid #dbe5ed;
  border-radius: 12px;
  box-shadow: 0 10px 26px rgba(27, 68, 105, .08);
}
.employee-verify-panel > span {
  display: block;
  color: #0788c9;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .15em;
}
.employee-verify-panel h1 {
  margin: 18px 0 30px;
  color: #27384a;
  font-size: 34px;
  font-weight: 400;
  line-height: 1.2;
}
.employee-verify-panel .public-form { display: block; }
.employee-verify-panel .public-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.employee-verify-panel .public-form-field label { display: block; margin-bottom: 10px; color: #21384f; font-weight: 600; }
.employee-verify-panel .public-form-field input { box-sizing: border-box; width: 100%; min-height: 50px; border: 1px solid #c9d8e6; border-radius: 6px; padding: 10px 12px; background: #fff; }
.employee-verify-panel .button { margin-top: 24px; border: 0; background: #72c45a; color: #fff; }
.employee-verify-panel .verify-result-slot { margin-top: 16px; }
.employee-verify-hint { margin: 28px 0 0; color: #47617c; line-height: 1.8; }

/* The source employee page is a left navigation plus a right verification
   panel. Hide the source's empty article column instead of rendering the
   form below the whole legacy layout. */
.employee-verify-page .legacy-about-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 45px;
}
.employee-verify-page .legacy-about-source {
  min-width: 0;
  padding: 0;
  background: transparent;
}
.employee-verify-page .legacy-about-source .main {
  width: 100%;
  margin: 0;
}
.employee-verify-page .legacy-about-source .main .side {
  width: 231px;
  margin: 0;
}
.employee-verify-page .legacy-about-source .main .content {
  display: none;
}
.employee-verify-page .employee-verify-panel {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  width: auto;
}

@media (max-width: 900px) {
  .legacy-about-page { padding: 30px 0 50px; }
  .detail-article .translationEdit-about { grid-template-columns: 1fr; gap: 24px; }
  .detail-article .translationEdit-about > .side,
  .detail-article .translationEdit-about > .content { width: 100%; margin: 0; }
  .detail-article .translationEdit-about > .content { margin-top: 0; }
  .legacy-about-layout { grid-template-columns: 1fr; gap: 24px; }
  .legacy-about-source { padding: 0 20px; }
  .legacy-about-source .main .side,
  .legacy-about-source .main .content { display: block; width: 100%; margin-right: 0; }
  .legacy-about-source .main .content { margin-top: 28px; }
  .legacy-about-source .translationEdit-about { grid-template-columns: 1fr; gap: 24px; }
  .legacy-about-source .translationEdit-about > .side,
  .legacy-about-source .translationEdit-about > .content { width: 100%; margin: 0; }
  .legacy-about-source .translationEdit-about > .content { margin-top: 0; }
  .legacy-about-layout .detail-consultation { position: static; }
  .employee-verify-panel { padding: 25px 20px 28px; }
  .employee-verify-panel .public-form-grid { grid-template-columns: 1fr; }
  .employee-verify-page .legacy-about-layout { grid-template-columns: 1fr; gap: 24px; }
  .employee-verify-page .legacy-about-source { padding: 0 20px; }
  .employee-verify-page .legacy-about-source .main .side { width: 100%; }
  .employee-verify-page .employee-verify-panel { grid-column: 1; grid-row: auto; }
}