/* About page redesign — follows the approved blue/white industrial design. */
body { color:#2853b2; background:#fff; }
.h_b_xt { opacity:.28; pointer-events:none; }

/* Inner hero */
.sub_banner { height:auto; margin-top:var(--site-nav-height, 78px); overflow:hidden; background:#f5f9ff; position:relative; line-height:0; }
.sub_banner_img { position:static!important; z-index:0!important; width:100%; height:auto; line-height:0; }
.sub_banner_img > picture { position:static!important; display:block!important; width:100%!important; height:auto!important; line-height:0; }
.sub_banner_img img,.sub_banner_img > picture > img { position:static!important; z-index:0!important; display:block; width:100%!important; height:auto!important; object-fit:contain; object-position:center; }
.sub_banner_img .img2 { display:none; }
.sub_banner_img:after { display:none!important; }
.crumbs { position:absolute; left:0; right:0; bottom:0; z-index:1000!important; background:rgba(255,255,255,.9); backdrop-filter:blur(8px); border-top:1px solid rgba(40,83,178,.1); }
.crumbs ul { height:52px; display:flex; align-items:center; }
.crumbs li,.crumbs a { color:#697992; font-size:14px; }

/* Company profile */
.about_t { max-width:1440px; padding-top:110px; padding-bottom:0; }
.about_intro { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(36px,5vw,72px); padding:0 4%; align-items:start; }
.about_intro_l { grid-column:1; grid-row:1; position:static; width:auto!important; padding:0!important; }
.about_intro_body { grid-column:1; grid-row:2; width:auto!important; margin-top:6px; padding:28px 0 4px 28px; border-left:3px solid rgba(40,83,178,.22); }
.about_intro_media { grid-column:2; grid-row:1 / span 2; align-self:center; margin:0; border-radius:12px; overflow:hidden; box-shadow:0 28px 65px rgba(23,65,133,.12); border:1px solid rgba(219,229,244,.9); }
.about_intro_media img { display:block; width:100%; aspect-ratio:1.48; object-fit:cover; object-position:center; }
.about_intro_body p { margin:0 0 24px; max-width:640px; color:#3e516e; font-size:16px; line-height:1.95; text-align:justify; }
.about_intro .pub_h2 h2 { margin:0; }
.about_intro .pub_h2 h2:after { content:""; display:block; width:48px; height:4px; margin-top:18px; background:#2853b2; border-radius:2px; }
.about_intro .h2span1,.about_intro .h2span2 { display:block; font-weight:700; color:#2853b2; line-height:1.24; font-size:clamp(34px,3vw,52px); }
.about_intro .h2span2 { color:#2853B2; }
.about_intro_body p:last-child { margin-bottom:0; }
.about_intro_lead { margin-top:30px; max-width:620px; color:#53657f; font-size:17px; line-height:2; }
.about_intro_r { grid-column:1; grid-row:2; width:auto!important; padding:25px 0 0!important; }
.about_intro_r_label { display:inline-block; margin:0 0 25px!important; padding-bottom:12px; color:#2853B2!important; font-size:18px!important; font-weight:700; border-bottom:3px solid #2853B2; }
.about_intro_r p:not(.about_intro_r_label) { margin:0 0 18px; color:#3e516e; font-size:16px; line-height:2; }

.about_core { display:grid; grid-template-columns:repeat(4,1fr); margin:64px 4% 0; padding:0!important; border-top:1px solid #dce6f5; border-bottom:1px solid #dce6f5; }
.about_core_item { position:relative; width:auto!important; max-width:none!important; min-width:0!important; min-height:158px; margin:0!important; padding:36px 28px 34px 76px; border-right:1px solid #dce6f5; box-sizing:border-box; }
.about_core_item + .about_core_item { padding-left:76px!important; border-left:0!important; }
.about_core_item:last-child { border-right:0; }
.about_core_item:before { content:""; position:absolute; left:24px; top:38px; width:39px; height:39px; background:center/contain no-repeat; }
.about_core_item:nth-child(1):before { background-image:url(../images/about-redesign/icons/highlight-founded.svg); }
.about_core_item:nth-child(2):before { background-image:url(../images/about-redesign/icons/highlight-rd-production.svg); }
.about_core_item:nth-child(3):before { background-image:url(../images/about-redesign/icons/highlight-optical-design.svg); }
.about_core_item:nth-child(4):before { background-image:url(../images/about-redesign/icons/highlight-application.svg); }
.about_core_no { display:block; color:#2853B2; font-size:25px; line-height:1; font-weight:700; }
.about_core_txt { margin-top:14px; color:#142f5c; font-size:16px; line-height:1.55; font-weight:600; }

/* Strength data */
.about_t_num { display:grid!important; width:auto!important; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:28px 4% 0; }
.about_t_num_box { position:relative; float:none!important; width:auto!important; max-width:none!important; min-width:0!important; height:auto!important; min-height:420px; margin:0!important; padding:76px 28px 35px; border:1px solid #e1e9f5; border-radius:5px; background:linear-gradient(155deg,#f9fbff 0%,#edf4ff 100%); text-align:center; overflow:hidden; box-sizing:border-box; }
.about_t_num_box:before { content:""; position:absolute; top:24px; left:50%; width:38px; height:38px; transform:translateX(-50%); background:center/contain no-repeat; }
.about_t_num_box:nth-child(1):before { background-image:url(../images/about-redesign/icons/strength-rd.svg); }
.about_t_num_box:nth-child(2):before { background-image:url(../images/about-redesign/icons/strength-production.svg); }
.about_t_num_box:nth-child(3):before { background-image:url(../images/about-redesign/icons/strength-quality.svg); }
.about_t_num_box:nth-child(4):before { background-image:url(../images/about-redesign/icons/strength-patent.svg); }
.about_t_num_box h3 { margin:0 0 26px; color:#2853b2; font-size:21px; font-weight:700; }
.about_t_num_con { display:flex; width:100%!important; max-width:none!important; min-width:0!important; flex-direction:column; align-items:center; gap:23px; }
.about_t_num_nr { width:100%!important; max-width:none!important; min-width:0!important; margin:0!important; padding:0!important; }
.about_t_num_sz { display:flex; align-items:baseline; justify-content:center; color:#2853B2; }
.about_t_num_sz p { margin:0; color:#2853B2; font-size:38px; line-height:1; font-weight:700; }
.about_t_num_sz span { margin-left:4px; color:#2853B2; font-size:18px; font-weight:700; }
.about_t_num_nr>p { margin:10px auto 0; max-width:230px; color:#51627b; font-size:14px; line-height:1.65; }

/* Core capabilities */
.about_cap { padding:72px 0 120px; background:linear-gradient(180deg,#f7faff 0%,#fff 100%); border-top:1px solid #edf2f9; }
.about_cap_inner { max-width:1440px; padding:0 4%!important; }
.about_cap_showcase { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr); gap:clamp(28px,4vw,56px); align-items:center; margin-bottom:48px; padding:clamp(28px,3vw,40px); border:1px solid #dbe5f4; border-radius:16px; background:linear-gradient(135deg,#fff 0%,#f7faff 58%,#eef4ff 100%); box-shadow:0 24px 60px rgba(26,68,139,.08); overflow:hidden; }
.about_cap_showcase_copy { max-width:560px; }
.about_cap_showcase_copy .about_cap_eyebrow { margin:0 0 14px; }
.about_cap_showcase_copy .about_cap_title { text-align:left; }
.about_cap_showcase_copy .about_cap_title:after { content:""; display:block; width:52px; height:4px; margin-top:22px; background:#2853b2; border-radius:2px; }
.about_cap_showcase_copy .about_cap_lead { margin-top:22px; text-align:left; }
.about_cap_showcase_media { position:relative; margin:0; border-radius:14px; overflow:hidden; box-shadow:0 18px 42px rgba(23,65,133,.14); }
.about_cap_showcase_media:before { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.65); border-radius:14px; pointer-events:none; z-index:2; }
.about_cap_showcase_media:after { content:""; position:absolute; inset:auto 0 0; height:38%; background:linear-gradient(180deg,transparent,rgba(15,44,96,.12)); pointer-events:none; z-index:1; }
.about_cap_showcase_media img { display:block; width:100%; height:100%; min-height:280px; max-height:420px; object-fit:cover; object-position:center 42%; }
.about_cap_eyebrow { margin:0 0 13px; color:#2853B2; font-size:16px; font-weight:700; letter-spacing:.18em; }
.about_cap_title { margin:0; color:#2853b2; font-size:clamp(32px,2.7vw,46px); line-height:1.25; }
.about_cap_lead { margin-top:20px; color:#60718a; font-size:16px; line-height:1.8; }
.about_cap_grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch; }
.about_cap_item { position:relative; width:auto!important; max-width:none!important; min-width:0!important; min-height:0; margin:0!important; padding:34px 28px 30px; display:flex; flex-direction:column; background:linear-gradient(180deg,#fff 0%,#f8fbff 100%); border:1px solid #dbe5f4; border-radius:12px; box-shadow:0 14px 40px rgba(26,68,139,.06); overflow:hidden; box-sizing:border-box; transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
.about_cap_item:hover { transform:translateY(-4px); border-color:#b8cceb; box-shadow:0 22px 50px rgba(26,68,139,.1); }
.about_cap_item:before,.about_cap_item:after { display:none!important; }
.about_cap_item_hd { position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding:0; margin-bottom:18px; }
.about_cap_item_hd:before { content:""; position:static; flex-shrink:0; width:56px; height:56px; border-radius:14px; border:1px solid rgba(40,83,178,.12); box-shadow:inset 0 1px 0 rgba(255,255,255,.85); background-color:#eef4ff; background-position:center; background-size:32px,auto; background-repeat:no-repeat,no-repeat; }
.about_cap_item:nth-child(1) .about_cap_item_hd:before { background-image:url(../images/about-redesign/icons/capability-rd.svg),linear-gradient(145deg,#eef4ff 0%,#dfeaf9 100%); }
.about_cap_item:nth-child(2) .about_cap_item_hd:before { background-image:url(../images/about-redesign/icons/capability-testing.svg),linear-gradient(145deg,#eef4ff 0%,#dfeaf9 100%); }
.about_cap_item:nth-child(3) .about_cap_item_hd:before { background-image:url(../images/about-redesign/icons/capability-manufacturing.svg),linear-gradient(145deg,#eef4ff 0%,#dfeaf9 100%); }
.about_cap_no { position:absolute; top:18px; right:22px; margin:0; color:rgba(40,83,178,.08); font-size:48px; line-height:1; font-weight:800; letter-spacing:-.02em; }
.about_cap_item h3 { margin:0; color:#2853b2; font-size:22px; line-height:1.35; font-weight:700; }
.about_cap_desc { margin:0 0 16px; flex:1; color:#40536f; font-size:15px; line-height:1.8; }
.about_cap_keys { margin-top:auto; padding-top:16px; border-top:1px dashed rgba(40,83,178,.18); color:#2853B2; font-size:14px; line-height:1.85; }

/* History intentionally not included in this redesign. */
.about_lc { display:none!important; }

/* Culture */
.about_sz { max-width:1440px; padding:88px 4% 100px!important; background:linear-gradient(180deg,#fff 0%,#f7faff 100%); }
.about_sz_inner { width:100%; }
.about_sz_showcase { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.02fr); gap:clamp(24px,4vw,48px); align-items:center; margin-bottom:36px; padding:clamp(24px,3vw,36px); border:1px solid #dbe5f4; border-radius:16px; background:linear-gradient(135deg,#fff 0%,#f8fbff 62%,#eef4ff 100%); box-shadow:0 20px 52px rgba(26,68,139,.07); }
.about_sz_showcase_copy { max-width:520px; }
.about_sz_eyebrow { margin:0 0 12px; color:#2853B2; font-size:14px; font-weight:700; letter-spacing:.18em; }
.about_sz_showcase_copy h2 { margin:0; color:#2853b2; font-size:clamp(34px,3vw,48px); line-height:1.2; font-weight:700; }
.about_sz_showcase_copy h2:after { content:""; display:block; width:48px; height:4px; margin-top:18px; background:#2853b2; border-radius:2px; }
.about_sz_lead { margin:20px 0 0; color:#60718a; font-size:16px; line-height:1.8; }
.about_sz_showcase_media { margin:0; border-radius:14px; overflow:hidden; box-shadow:0 18px 42px rgba(23,65,133,.14); }
.about_sz_showcase_media img { display:block; width:100%; min-height:260px; max-height:380px; object-fit:cover; object-position:center; }
.about_sz_box { display:grid!important; width:100%!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.about_sz_con { position:relative; float:none!important; display:flex; flex-direction:column; justify-content:center; width:auto!important; max-width:none!important; min-width:0!important; height:auto!important; min-height:148px; margin:0!important; padding:34px 28px 30px; border:1px solid #dbe5f4; border-radius:12px; background:linear-gradient(180deg,#fff 0%,#f8fbff 100%); text-align:left; box-sizing:border-box; box-shadow:0 12px 32px rgba(26,68,139,.05); transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; visibility:visible!important; opacity:1!important; animation:none!important; transform:none!important; }
.about_sz_con:hover { transform:translateY(-3px); border-color:#b8cceb; box-shadow:0 18px 40px rgba(26,68,139,.09); }
.about_sz_con:before { content:""; position:absolute; top:0; left:0; width:100%; height:4px; border-radius:12px 12px 0 0; background:linear-gradient(90deg,#2853b2,#4d7be0); }
.about_sz_con:nth-child(2):before { background:linear-gradient(90deg,#3a67c8,#6b93ea); }
.about_sz_con:nth-child(3):before { background:linear-gradient(90deg,#4d7be0,#7aa4ef); }
.about_sz_icon { display:none!important; }
.about_sz_txt { width:auto!important; max-width:none!important; min-width:0!important; margin:0!important; padding:0!important; }
.about_sz_label { margin:0 0 12px; color:#2853b2; font-size:18px; line-height:1.35; font-weight:700; }
.about_sz_desc { margin:0; color:#3e516e; font-size:15px; line-height:1.85; }
.about_sz_txt h3 { margin:0 0 11px; color:#2853b2; font-size:20px; line-height:1.35; }
.about_sz_txt p { margin:0; color:#596b83; font-size:14px; line-height:1.75; }

/* Shared footer transition */
footer { margin-top:0; }

@media(max-width:1000px){
  .about_intro { grid-template-columns:1fr; gap:35px; }
  .about_intro_l,.about_intro_body,.about_intro_r { grid-column:1; grid-row:auto; }
  .about_intro_media { grid-column:1; grid-row:auto; order:2; }
  .about_intro_l { order:1; }
  .about_intro_body { order:3; }
  .about_core,.about_t_num { grid-template-columns:repeat(2,1fr); }
  .about_core_item:nth-child(2){border-right:0}.about_core_item:nth-child(-n+2){border-bottom:1px solid #dce6f5}
  .about_cap_showcase { grid-template-columns:1fr; gap:24px; margin-bottom:36px; padding:24px; }
  .about_cap_showcase_media img { min-height:220px; max-height:320px; }
  .about_cap_grid { grid-template-columns:1fr; }
  .about_sz_showcase { grid-template-columns:1fr; gap:20px; margin-bottom:24px; padding:20px; }
  .about_sz_showcase_media img { min-height:200px; max-height:280px; }
  .about_sz_box { grid-template-columns:1fr; }
}

@media (max-width: 767px) {
  .h_b_xt { display: none !important; }

  /* Banner: show full hero art (title is baked in) — no cover crop */
  .sub_banner {
    height: auto !important;
    min-height: 0 !important;
    margin-top: 68px !important;
    overflow: hidden;
    background: #f5f9ff;
  }
  .sub_banner_img {
    position: relative !important;
    z-index: 0 !important;
    width: 100% !important;
    height: auto !important;
  }
  .sub_banner_img .img1 { display: none !important; }
  .sub_banner_img .img2 {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    object-fit: unset !important;
    object-position: center !important;
  }
  .crumbs {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    height: auto !important;
    background: #fff !important;
    backdrop-filter: none;
    border-top: 1px solid #e5ebf4;
  }
  .crumbs ul.container,
  .crumbs ul {
    width: 100% !important;
    max-width: none !important;
    height: 48px;
    padding: 0 20px !important;
  }
  .crumbs li,
  .crumbs a { font-size: 13px !important; color: #697992 !important; }
  .crumbs i { color: #697992 !important; }

  .about_t.container,
  .about_t {
    width: 100% !important;
    max-width: none !important;
    padding: 48px 0 28px !important;
  }
  .about_intro {
    display: flex !important;
    flex-direction: column;
    gap: 20px;
    padding: 0 20px !important;
  }
  .about_intro_l { order: 1; }
  .about_intro_media {
    order: 2;
    display: block;
    width: 100%;
    margin: 4px 0;
  }
  .about_intro_media img { aspect-ratio: 1.45; }
  .about_intro_body {
    order: 3;
    margin-top: 0;
    padding: 18px 0 0 18px !important;
    border-left-width: 2px;
  }
  .about_intro_r { order: 3; padding: 6px 0 0 !important; }
  .about_intro .h2span1,
  .about_intro .h2span2 {
    font-size: 26px !important;
    line-height: 1.32 !important;
  }
  .about_intro .pub_h2 h2:after {
    width: 36px;
    height: 3px;
    margin-top: 14px;
  }
  .about_intro_body p {
    font-size: 15px !important;
    line-height: 1.88 !important;
    margin-bottom: 16px !important;
    text-align: left;
  }
  .about_intro_lead {
    margin-top: 12px;
    font-size: 15px !important;
    line-height: 1.8 !important;
  }
  .about_intro_r_label { font-size: 16px !important; margin-bottom: 14px !important; }
  .about_intro_r p:not(.about_intro_r_label) {
    font-size: 15px !important;
    line-height: 1.85 !important;
    margin-bottom: 12px;
  }

  .about_core {
    grid-template-columns: 1fr 1fr;
    margin: 28px 20px 0;
  }
  .about_core_item,
  .about_core_item + .about_core_item {
    min-height: 0;
    padding: 22px 14px 20px 52px !important;
    border-right: 1px solid #dce6f5;
    border-bottom: 0;
  }
  .about_core_item:nth-child(2n) { border-right: 0; }
  .about_core_item:nth-child(-n+2) { border-bottom: 1px solid #dce6f5 !important; }
  .about_core_item:before { left: 14px; top: 24px; width: 28px; height: 28px; }
  .about_core_no { font-size: 18px; }
  .about_core_txt { margin-top: 10px; font-size: 14px; line-height: 1.45; }

  .about_t_num {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 14px 20px 0;
  }
  .about_t_num_box {
    min-height: 0 !important;
    padding: 54px 12px 18px !important;
  }
  .about_t_num_box:before { top: 16px; width: 30px; height: 30px; }
  .about_t_num_box h3 { margin: 0 0 12px; font-size: 16px; }
  .about_t_num_con { gap: 12px; }
  .about_t_num_sz p { font-size: 26px !important; }
  .about_t_num_sz span { font-size: 14px; }
  .about_t_num_nr > p { max-width: none; font-size: 12px; line-height: 1.5; }

  .about_cap { padding: 36px 0 52px; }
  .about_cap_inner.container,
  .about_cap_inner {
    width: 100% !important;
    max-width: none !important;
    padding: 0 20px !important;
  }
  .about_cap_showcase {
    margin-bottom: 24px;
    padding: 18px;
    border-radius: 12px;
    gap: 18px;
  }
  .about_cap_showcase_copy .about_cap_title { font-size: 26px !important; }
  .about_cap_showcase_copy .about_cap_title:after { width: 40px; margin-top: 14px; }
  .about_cap_showcase_copy .about_cap_lead { margin-top: 12px; font-size: 14px; line-height: 1.7; }
  .about_cap_showcase_media { border-radius: 10px; }
  .about_cap_showcase_media img { min-height: 200px; max-height: 260px; object-position: center 40%; }
  .about_cap_eyebrow { font-size: 13px; letter-spacing: .12em; }
  .about_cap_grid { gap: 14px; }
  .about_cap_item {
    padding: 24px 18px 22px !important;
  }
  .about_cap_item_hd { gap: 12px; margin-bottom: 14px; }
  .about_cap_item_hd:before { width: 48px; height: 48px; border-radius: 12px; background-size: 28px; }
  .about_cap_no { top: 14px; right: 16px; font-size: 36px; }
  .about_cap_item h3 { font-size: 18px !important; }
  .about_cap_desc { margin: 0 0 12px; font-size: 14px !important; line-height: 1.7; }
  .about_cap_keys { padding-top: 12px; font-size: 13px; line-height: 1.7; }

  .about_sz.container,
  .about_sz {
    width: 100% !important;
    max-width: none !important;
    padding: 48px 20px 60px !important;
  }
  .about_sz_showcase { margin-bottom: 18px; padding: 16px; border-radius: 12px; }
  .about_sz_eyebrow { font-size: 12px; letter-spacing: .12em; }
  .about_sz_showcase_copy h2 { font-size: 26px !important; }
  .about_sz_showcase_copy h2:after { width: 36px; height: 3px; margin-top: 14px; }
  .about_sz_lead { margin-top: 12px; font-size: 14px; line-height: 1.7; }
  .about_sz_showcase_media img { min-height: 180px; max-height: 240px; }
  .about_sz_box { grid-template-columns: 1fr; gap: 12px; }
  .about_sz_con { min-height: 0; padding: 22px 18px; border-radius: 10px; }
  .about_sz_label { font-size: 16px !important; margin-bottom: 8px; }
  .about_sz_desc { font-size: 14px; line-height: 1.75; }
}
