/* Source-matched child pages: docs/design/site/spec.svg and manifest.md.
   Every rule is scoped to the child-page document; shared branding lives in styles.css. */
html.subpage {
  --editorial-blue: #014099;
  --editorial-pale: #f3f3f8;
  --editorial-border: #ddd;
  --sidebar-blue: #025fb6;
  --tab-blue: #0c84d1;
  --tab-gray: #c9c9c9;
  --separator-purple: #2a24a0;
}
html.subpage body { min-height: 100svh; }
html.subpage .content-main { min-height: calc(100svh - 50px); }
html.subpage .page-banner { height: 368px; overflow: hidden; }
html.subpage .page-banner img { width: 100%; height: auto; max-width: none; }
html.subpage .box-chitiet-duan { padding-block: 20px; }
html.subpage .breachTop { margin-bottom: 30px; }
html.subpage .breadcrumb { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; list-style: none; color: #808080; font-size: 13px; line-height: 20.8px; }
html.subpage .breadcrumb li + li::before { content: "/"; padding-inline: 10px; color: #ccc; }
html.subpage .breadcrumb a:hover { color: var(--sidebar-blue); }
html.subpage .article-grid { display: grid; grid-template-columns: 2fr 1fr; margin-inline: calc(-1 * var(--gutter)); }
html.subpage .pageNewsPost { min-width: 0; padding-inline: var(--gutter); }
html.subpage .box-r-r { min-width: 0; padding-inline: 25px; }
html.subpage .box-link-r { margin-bottom: 15px; }
html.subpage .box-r-r .has-underline { margin-bottom: 15px; padding-bottom: 2px; font-size: 16px; font-weight: 700; line-height: 1.4; text-transform: uppercase; }
html.subpage .list-link-gp { padding-block: 5px; background: var(--muted-surface); }
html.subpage .list-link-gp a { display: block; margin-bottom: 5px; padding: 6px 10px; font-size: 13px; font-weight: 600; line-height: 1.6; text-transform: uppercase; }
html.subpage .list-link-gp a:hover { color: var(--sidebar-blue); }
html.subpage .list-link-gp .icon-caret-right { margin-right: 5px; color: var(--sidebar-blue); }
html.subpage .icon-caret-right::before { content: "\f0da"; }
html.subpage .title-page { margin-bottom: 5px; font-size: 25px; font-weight: 700; line-height: 1.4; text-align: center; text-transform: uppercase; }
html.subpage .postentry .line-home { position: relative; width: 100%; height: 20px; margin-bottom: 25px; overflow: hidden; color: transparent; background: linear-gradient(90deg, transparent, var(--separator-purple) 46%, transparent 46%, transparent 54%, var(--separator-purple) 54%, transparent) center 14px / min(450px, 100%) 1px no-repeat; }
html.subpage .line-home::after { content: ""; position: absolute; top: 10px; left: calc(50% - 4px); width: 8px; height: 8px; border-radius: 50%; background: var(--separator-purple); box-shadow: -13px 0 0 -1px var(--separator-purple), 13px 0 0 -1px var(--separator-purple); }

/* Editorial content keeps its original type, spacing and image relationships. */
html.subpage .postentry { display: flow-root; font-size: 14px; line-height: 1.6; overflow-wrap: break-word; }
html.subpage .postentry p { margin: 0 0 10px; }
html.subpage .postentry :is(h1, h2, h3, h4, h5, h6) { margin: 0; padding: 0; font-size: 18px; font-weight: 600; line-height: 1.4; }
html.subpage .postentry .title-page { margin-bottom: 5px; font-size: 25px; font-weight: 700; }
html.subpage .postentry figure { margin: 0; }
html.subpage .postentry img { display: inline-block; width: auto; height: auto; max-width: 100%; margin-block: 15px; vertical-align: middle; }
html.subpage .postentry ul, html.subpage .postentry ol { margin-top: 0; margin-bottom: 10px; padding-left: 40px; }
html.subpage .postentry ul { list-style: disc; }
html.subpage .postentry ol { list-style: decimal; }
html.subpage .postentry a { color: #337ab7; }
html.subpage .postentry a:hover { text-decoration: underline; }
html.subpage .postentry .text-center { text-align: center; }
html.subpage .postentry .gp-al-right { text-align: right; }
html.subpage .postentry .heading-lv2 { margin-bottom: 20px; border-bottom: 2px solid var(--editorial-blue); }
html.subpage .postentry .heading-lv2 .block { position: relative; display: block; margin-bottom: 12px; padding-left: 30px; }
html.subpage .postentry .heading-lv2 .block::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 9px; background: linear-gradient(to bottom, #014099, #0161b4 50%, #008bd5); }
html.subpage .postentry .heading-lv2 .block::after { content: ""; position: absolute; inset: 0 auto 0 4px; width: 1px; background: var(--white); }
html.subpage .postentry .heading-lv2 .heading_title { position: relative; line-height: 1.3; }
html.subpage .postentry .column-media > .column_image[data-image="right"] { float: right; margin-left: 36px; }
html.subpage .postentry .column-media > .column_detail[data-wraparound="false"] { overflow: hidden; }
html.subpage .postentry .column-media p { color: #333; font: 16px/1.6 Arial, sans-serif; text-align: justify; }
html.subpage :is(.route-our-company, .route-message-from-the-president) .postentry img { margin-top: 0; }
html.subpage .table-layout { max-width: 100%; }
html.subpage .table-layout .table_inner { width: 100%; border: 2px solid var(--editorial-border); border-collapse: collapse; }
html.subpage .gp-w-025per { width: 25%; }
html.subpage .gp-w-075per { width: 75%; }
html.subpage .table-layout th, html.subpage .table-layout td { padding: 14px 10px; border-bottom: 1px solid var(--editorial-border); border-left: 1px solid var(--editorial-border); background: var(--white); vertical-align: top; text-align: left; font-weight: 400; }
html.subpage .table-layout .cell-style2 { background: var(--editorial-pale); }
html.subpage :is(.route-head-office-outline, .route-company-outline) .heading-lv2 { margin-top: 30px; margin-bottom: 15px; }
html.subpage :is(.route-head-office-outline, .route-company-outline) .heading-lv2 .heading_title { font-size: 27px; }
html.subpage .postentry .list-note { padding-left: 0; list-style: none; }
html.subpage .list-note > li { position: relative; padding-left: 1.3em; color: #666; font-size: 14px; }
html.subpage .list-note > li > .list_mark { position: absolute; top: 0; left: 0; }
html.subpage .movie-layout { margin-block: 1em; text-align: center; }
html.subpage .postentry iframe { display: block; width: min(560px, 100%); height: auto; aspect-ratio: 560 / 315; margin-inline: auto; border: 0; }
html.subpage .route-data-center .heading-lv2 { margin-block: 15px; }
html.subpage .route-data-center .heading-lv2 h2 { position: relative; font-size: 27px; line-height: 1.3; }
html.subpage .route-data-center .heading-lv2 + * { margin-top: 1.9em; }
html.subpage .postentry .list-order, html.subpage .postentry .list-bullet { padding-left: 0; list-style: none; }
html.subpage .list-order > li { position: relative; padding-left: 2.5em; }
html.subpage .list-order > li > .list_mark { position: absolute; top: 0; left: 0; color: #255ba8; font-weight: 700; }
html.subpage .list-bullet > li { position: relative; padding-left: 20px; }
html.subpage .list-bullet > li::before { content: ""; position: absolute; top: .5em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: #255ba8; }
html.subpage .postentry .heading-lv3, html.subpage .postentry .heading-lv4 { margin-bottom: 15px; }
html.subpage .heading-lv3 .block, html.subpage .heading-lv4 .block { display: block; padding: 12px 23px; background: var(--editorial-pale); }
html.subpage .postentry .heading-lv4 h4 { position: relative; padding-left: 14px; font-size: 18px; font-weight: 700; line-height: 1.4; }
html.subpage .heading-lv4 h4::before { content: ""; position: absolute; top: .1em; left: 0; width: 3px; height: 18px; background: var(--editorial-blue); }

/* Named equivalents of the finite inline formatting in the original articles. */
html.subpage .postentry .editorial-width-full { width: 100%; }
html.subpage .editorial-center { text-align: center; }
html.subpage .postentry .editorial-float-left-43 { float: left; width: 43%; }
html.subpage .postentry .editorial-width-49 { width: 49%; }
html.subpage .postentry .editorial-font-24 { font-size: 24px; }
html.subpage .postentry .editorial-portrait { width: 270px; max-width: 100%; }
html.subpage .postentry .editorial-iso { width: 138px; height: 90px; margin: 0; }
html.subpage .editorial-right { text-align: right; }
html.subpage .editorial-spacer { float: right; width: 5%; }
html.subpage .editorial-justify { text-align: justify; }
html.subpage .editorial-heading-break { display: block; }
html.subpage .unavailable-image { display: inline-flex; align-items: center; justify-content: center; min-height: 60px; max-width: 100%; padding: 10px; border: 1px dashed #ccc; color: #777; background: #fafafa; font-size: 12px; line-height: 1.6; text-align: center; vertical-align: middle; }

/* Four original solution tiles; imagery stays flat and unrounded. */
html.subpage .OURSOLUTIONS { padding-block: 40px 30px; }
html.subpage .OURSOLUTIONS > .container > .title-page { padding-bottom: 20px; }
html.subpage .solutions-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-inline: -5px; }
html.subpage .solution-card { display: block; min-width: 0; }
html.subpage .solution-card-image { width: 100%; height: 200px; object-fit: cover; object-position: center; }
html.subpage .solution-card-title { min-height: 54px; padding: 15px 5px; border: 1px solid #ccc; font-size: 16px; font-weight: 600; line-height: 1.6; text-align: center; }
html.subpage .solution-card:hover .solution-card-title { color: var(--sidebar-blue); }

/* Contact and recruitment reuse the original homepage office and form components. */
html.subpage .lienhe { padding-block: 70px 20px; background: var(--brand-blue); color: var(--white); }
html.subpage .lienhe .title-page, html.subpage .lienhe .title-sec { margin-bottom: 15px; color: var(--white); font-size: 30px; font-weight: 700; line-height: 42px; text-align: left; }
html.subpage .contact-page .title-page { text-transform: none; }
html.subpage .office-tabs { display: flex; justify-content: center; margin-bottom: 10px; }
html.subpage .office-tab { border: 0; border-radius: 0; padding: 10px 20px; background: var(--tab-gray); color: #414141; font-size: 18px; font-weight: 600; line-height: 36px; text-align: center; }
html.subpage .office-tab[aria-selected="true"] { background: var(--tab-blue); color: var(--white); }
html.subpage .office-tab-panel { min-width: 0; }
html.subpage .office-tab-panel:focus-visible { outline-offset: 3px; }
html.subpage .contact-page .offices { color: var(--text); }
html.subpage .contact-page .contact-form { font-size: 13px; }
html.subpage .contact-fields select { width: 100%; height: 34px; border: 1px solid #ccc; border-radius: var(--card-radius); padding: 6px 12px; background: var(--white); color: #555; font: 14px/20px var(--font-family); }
html.subpage .contact-fields label:not(.sr-only) { display: block; margin-bottom: 3px; color: var(--white); font-size: 13px; font-weight: 600; }
html.subpage .contact-fields label em { font-style: normal; }
html.subpage .contact-fields .gender-field { display: flex; align-items: center; gap: 0; min-width: 0; height: 34px; margin: 0; border: 0; padding: 0 15px; }
html.subpage .contact-fields .gender-field label { display: inline-flex; align-items: center; width: 25%; min-width: 100px; margin: 0; font-weight: 600; }
html.subpage .contact-fields .gender-field input { width: auto; height: auto; margin: 0 3px 0 0; padding: 0; accent-color: var(--tab-blue); }
html.subpage .recruitment-form { font-size: 13px; }
html.subpage .contact-fields .form-field { min-width: 0; }
html.subpage .recruitment-form .message-field { margin-top: 10px; }
html.subpage .contact-form select:focus-visible { outline: 3px solid var(--active); outline-offset: 2px; }
html.subpage .office-tab-panel#menu1-akr { text-align: center; }
html.subpage .office-tab-panel#menu1-akr > div:first-child { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin-inline: -15px; }
html.subpage .ct-item { min-width: 0; padding: 15px 15px 0; }
html.subpage .ct-item img { width: 40px; height: 25px; margin-inline: auto; }
html.subpage .ct-item p { margin: 0 0 10px; color: var(--white); font-size: 13px; }
html.subpage .ct-item p:nth-child(2) { margin: 0; padding-top: 10px; }
html.subpage .ct-item:hover p { color: var(--active); }
html.subpage .ct-content { margin-top: 0; padding-top: 30px; border-top: 1px solid var(--white); color: var(--white); }
html.subpage .ct-content h2 { color: var(--active); font-size: 21px; font-weight: 600; line-height: 1.4; text-align: left; }
html.subpage .ct-content h3 { font-size: 16px; font-weight: 600; line-height: 1.4; }
html.subpage .ct-content h4, html.subpage .ct-content h6 { margin: 0; padding: 0; font-size: 12px; font-weight: 400; line-height: 1.4; }
html.subpage .ct-content a:hover { text-decoration: underline; }
html.subpage .site-footer { min-height: 50px; padding-block: 0; background: rgb(17 94 238 / 88%); color: var(--white); font-size: 13px; line-height: 50px; text-align: center; }
html.subpage .site-footer .copy-r { margin: 0; }

@media (min-width: 1200px) {
  html.subpage .lienhe { min-height: calc(100svh - 50px); }
}
@media (max-width: 991px) {
  html.subpage .article-grid { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  html.subpage .box-r-r { padding-inline: var(--gutter); }
  html.subpage .office-tab-panel#menu1-akr > div:first-child { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  html.subpage .page-banner { height: auto; }
  html.subpage .postentry .title-page, html.subpage .title-page { font-size: 20px; }
  html.subpage .OURSOLUTIONS { padding-top: 50px; }
  html.subpage .solution-card-title { font-size: 15px; }
  html.subpage .postentry .column-media > .column_image[data-image="right"] { float: none; margin-left: 0; }
  html.subpage .postentry .column-media figure { margin-inline: auto; }
  html.subpage .postentry .column-media .column_image img { display: block; }
  html.subpage .postentry .column-media > .column_detail[data-wraparound="false"] { overflow: visible; }
  html.subpage .postentry .table-layout { overflow-x: auto; }
  html.subpage .solutions-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  html.subpage .lienhe { padding-bottom: 40px; }
  html.subpage .office-tabs { margin-inline: -15px; }
  html.subpage .office-tab { flex: 1 1 0; min-width: 0; padding-inline: 8px; font-size: 18px; white-space: nowrap; }
  html.subpage .contact-fields .gender-field { height: auto; min-height: 24px; padding-inline: 0; }
  html.subpage .contact-fields .gender-field label { width: auto; margin-right: 30px; }
  html.subpage .recruitment-form .message-field { margin-top: 0; }
  html.subpage .site-footer { padding-block: 10px; line-height: 1.6; }
}
@media (max-width: 359px) {
  html.subpage .office-tab { font-size: 16px; }
}