/* High-contrast floating contact controls */
.float-cta{right:22px;bottom:92px;gap:12px;z-index:300}
.fc-item{min-width:184px;min-height:52px;border:2px solid #fff;background:#fff;color:#18345e;box-shadow:0 8px 26px rgba(4,22,53,.28);border-radius:14px}
.fc-wx{border-color:#18b968;background:#fff;color:#146b45}
.fc-wx svg{color:#18b968}
.fc-wx span{font-weight:800}
.fc-tel{border:2px solid #ff8a1e;background:linear-gradient(135deg,#ff9d24,#f26c00);box-shadow:0 8px 26px rgba(160,72,0,.3)}
@media(max-width:768px){.float-cta{right:10px;bottom:72px}.fc-item{min-width:158px}}
/* Contact section: open two-column layout based on the original site */
#c1{position:relative;overflow:hidden;padding:38px 0 84px;background:#f4f7fb}
#c1 .wrap{position:relative;z-index:1;max-width:1320px}
#c1 .contact-list{display:grid;grid-template-columns:1fr 1fr;column-gap:88px;padding:10px 26px 6px}
#c1 .contact-column{display:grid;grid-template-rows:repeat(4,minmax(68px,auto))}
#c1 .contact-column+ .contact-column{padding-left:72px;border-left:1px solid #d8e1ee}
#c1 .contact-item{display:grid;grid-template-columns:54px 1fr;gap:18px;align-items:center;padding:8px 0;border-bottom:1px solid #e0e7f0;font-size:16px;line-height:1.5}
#c1 .contact-item:last-child{border-bottom:0}
#c1 .contact-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:#2675d8}
#c1 .contact-icon svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#c1 .contact-item h3{display:inline;margin:0 12px 0 0;font-size:16px;line-height:1.5;color:#17355f}
#c1 .contact-item h3::after{content:"："}
#c1 .contact-item p{display:inline;margin:0;font-size:16px;line-height:1.5;font-weight:600;color:#415676}
#c1 .contact-item a{color:inherit;text-decoration:none}
#c1 .contact-item a:hover{color:#1768cf}
@media(max-width:900px){#c1 .contact-list{column-gap:36px;padding-left:10px;padding-right:10px}#c1 .contact-column+ .contact-column{padding-left:36px}}
@media(max-width:700px){#c1{padding:28px 0 64px}#c1 .contact-list{grid-template-columns:1fr;padding:0 8px}#c1 .contact-column{grid-template-rows:repeat(4,minmax(60px,auto))}#c1 .contact-column+ .contact-column{padding-left:0;border-left:0}#c1 .contact-column:first-child .contact-item:last-child{border-bottom:1px solid #e0e7f0}#c1 .contact-item{grid-template-columns:44px 1fr;gap:12px;min-height:60px;font-size:15px}#c1 .contact-icon{width:42px;height:42px}#c1 .contact-icon svg{width:29px;height:29px}#c1 .contact-item h3{font-size:15px}#c1 .contact-item p{font-size:15px}}

/* Banner followed by the same underline navigation used on product pages. */
#contactPage{--contact-header-height:118px;--contact-tabs-height:62px}
#contactPage .contact-banner{position:relative;overflow:hidden;padding:72px 24px 64px;text-align:center;color:#fff;background:radial-gradient(circle at 78% 15%,rgba(99,176,255,.34),transparent 24%),radial-gradient(circle at 18% 85%,rgba(228,171,71,.16),transparent 26%),linear-gradient(120deg,#071a33 0%,#103d78 58%,#1768d8 100%)}
#contactPage .contact-banner::before{content:"";position:absolute;inset:0;opacity:.26;background-image:linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(110deg,#000 10%,transparent 78%);pointer-events:none}
#contactPage .contact-banner .wrap{position:relative}
#contactPage .contact-banner h1{font-size:clamp(32px,4vw,46px);font-weight:800;letter-spacing:2px;color:#fff;text-shadow:0 4px 18px rgba(2,17,38,.22)}
#contactPage .contact-banner h1::after{content:"";display:block;width:76px;height:5px;margin:16px auto 0;border-radius:2px;background:linear-gradient(90deg,#6db5ff,#f2c66c)}
#contactPage .contact-banner .sec-en{margin-top:10px;color:#b9d4f4;letter-spacing:5px}
#contactPage #cTabs{top:var(--contact-header-height);display:block;padding:0;background:#fff;backdrop-filter:none;border-bottom:1px solid #d8e4f2;box-shadow:0 4px 14px rgba(15,45,90,.04)}
#contactPage #cTabs .wrap{display:flex;justify-content:safe center;gap:4px;max-width:1320px;overflow-x:auto}
#contactPage #cTabs a{position:relative;flex:0 0 auto;white-space:nowrap;padding:16px 22px;border:0;border-radius:0;color:var(--ink-2);font-size:15px;font-weight:600;line-height:1.8;background:transparent}
#contactPage #cTabs a::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:3px;border-radius:2px;background:var(--blue);transform:scaleX(0);transition:transform .2s}
#contactPage #cTabs a:hover,#contactPage #cTabs a[aria-current]{color:var(--blue)}
#contactPage #cTabs a:hover::after,#contactPage #cTabs a[aria-current]::after{transform:scaleX(1)}
#contactPage #cTabs a:focus-visible{outline:2px solid var(--blue);outline-offset:-4px}
#contactPage>section[id]{scroll-margin-top:calc(var(--contact-header-height) + var(--contact-tabs-height) + 12px)}
@media(max-width:768px){#contactPage .contact-banner{padding:54px 18px 48px}#contactPage .contact-banner h1{font-size:32px}#contactPage #cTabs .wrap{justify-content:flex-start;padding:0 12px}#contactPage #cTabs a{padding:14px 16px;font-size:14px}}

/* Equal banner heights on the five main information pages. */
main[data-banner-size="standard"]{--page-banner-height:260px}
main[data-banner-size="standard"]>.sec:first-child .sec-head,
main[data-banner-size="standard"]>.case-hero,
main[data-banner-size="standard"]>.service-hero,
#contactPage[data-banner-size="standard"]>.contact-banner{
  box-sizing:border-box;height:var(--page-banner-height);min-height:0;
  padding:24px;display:flex;flex-direction:column;justify-content:center;
}
main[data-banner-size="standard"]>.case-hero>.wrap,
main[data-banner-size="standard"]>.service-hero>.wrap,
#contactPage[data-banner-size="standard"]>.contact-banner>.wrap{width:100%;padding-left:0;padding-right:0}
main[data-banner-size="standard"]>.sec:first-child .sec-head h2,
main[data-banner-size="standard"]>.case-hero h1,
main[data-banner-size="standard"]>.service-hero h1,
#contactPage[data-banner-size="standard"]>.contact-banner h1{font-size:clamp(32px,4vw,46px);line-height:1.3;font-weight:800;letter-spacing:2px}
main[data-banner-size="standard"]>.case-hero h1,
main[data-banner-size="standard"]>.service-hero h1{margin:0 0 12px}
main[data-banner-size="standard"]>.case-hero p,
main[data-banner-size="standard"]>.service-hero p{font-size:16px;line-height:1.8}
main[data-banner-size="standard"]>.case-hero .case-stats,
main[data-banner-size="standard"]>.service-hero .service-pills{margin-top:16px}
@media(max-width:768px){
  main[data-banner-size="standard"]{--page-banner-height:210px}
  main[data-banner-size="standard"]>.sec:first-child .sec-head,
  main[data-banner-size="standard"]>.case-hero,
  main[data-banner-size="standard"]>.service-hero,
  #contactPage[data-banner-size="standard"]>.contact-banner{padding:16px 18px}
  main[data-banner-size="standard"]>.sec:first-child .sec-head h2,
  main[data-banner-size="standard"]>.case-hero h1,
  main[data-banner-size="standard"]>.service-hero h1,
  #contactPage[data-banner-size="standard"]>.contact-banner h1{font-size:32px}
  main[data-banner-size="standard"]>.case-hero h1,
  main[data-banner-size="standard"]>.service-hero h1{margin-bottom:8px}
  main[data-banner-size="standard"]>.case-hero p,
  main[data-banner-size="standard"]>.service-hero p{font-size:15px;line-height:1.7}
  main[data-banner-size="standard"]>.case-hero .case-stats,
  main[data-banner-size="standard"]>.service-hero .service-pills{margin-top:10px;gap:6px}
  main[data-banner-size="standard"]>.case-hero .case-stat,
  main[data-banner-size="standard"]>.service-hero .service-pill{font-size:12px;line-height:1.5;padding:4px 8px;white-space:nowrap}
}

/* Consistent type hierarchy for equivalent content on menu pages. */
main[data-banner-size="standard"]:not(#contactPage)>.sec:not(:first-child) .sec-head h2{font-size:clamp(28px,3vw,38px);font-weight:800;letter-spacing:-.5px}
main[data-banner-size="standard"] .cat-head h3,
main[data-banner-size="standard"] .cat-title h3{font-size:24px;line-height:1.5;font-weight:800}
main[data-banner-size="standard"] .prod-card h3,
main[data-banner-size="standard"] .news-item h3,
main[data-banner-size="standard"] .svc-item h3{font-size:18px;line-height:1.5;font-weight:700}
main[data-banner-size="standard"] .prod-card p,
main[data-banner-size="standard"] .news-item p,
main[data-banner-size="standard"] .svc-item p,
main[data-banner-size="standard"] .cat-desc{font-size:16px;line-height:1.8}
main[data-banner-size="standard"] .prod-card .tag,
main[data-banner-size="standard"] .prod-card .more,
main[data-banner-size="standard"] .cat-head .en,
main[data-banner-size="standard"] .cat-head .count{font-size:13px}

/* Keep category links visible below the actual header at every width. */
#productsPage .cat-block{scroll-margin-top:calc(var(--section-header-height) + var(--section-tabs-height) + 16px)}
#productsPage .prod-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
#productsPage .prod-card{min-width:0;display:flex;flex-direction:column}
#productsPage .prod-card .tag{align-self:flex-start}
#productsPage .prod-card p{min-height:3.6em}
#productsPage .prod-card .more{margin-top:auto;padding-top:12px}

/* Product and news navigation use the contact page's full-width underline style. */
#productsPage,#newsPage{--section-header-height:118px;--section-tabs-height:60px}
#productsPage>.sec:first-child .sec-head,
#newsPage>.sec:first-child .sec-head{width:var(--section-page-width,100vw);margin-bottom:0}
#productsPage .cat-nav,
#newsPage .news-tabs{
  position:sticky;top:var(--section-header-height);z-index:90;display:block;
  width:var(--section-page-width,100vw);margin:0 0 38px;
  margin-left:calc((100% - var(--section-page-width,100vw))/2);padding:0;
  border:0;border-bottom:1px solid #d8e4f2;border-radius:0;
  background:#fff;backdrop-filter:none;box-shadow:0 4px 14px rgba(15,45,90,.04);
}
#productsPage .cat-nav>.wrap,
#newsPage .news-tabs>.wrap{display:flex;justify-content:safe center;gap:4px;max-width:1320px;overflow-x:auto}
#productsPage .cat-nav a,
#newsPage .news-tabs a{
  position:relative;flex:0 0 auto;white-space:nowrap;padding:16px 22px;
  border:0;border-radius:0;background:transparent;box-shadow:none;
  color:var(--ink-2);font-size:15px;font-weight:600;line-height:1.8;
}
#productsPage .cat-nav a::after,
#newsPage .news-tabs a::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:3px;border-radius:2px;background:var(--blue);transform:scaleX(0);transition:transform .2s}
#productsPage .cat-nav a:hover,
#productsPage .cat-nav a[aria-current],
#newsPage .news-tabs a:hover,
#newsPage .news-tabs a[aria-current]{color:var(--blue)}
#productsPage .cat-nav a:hover::after,
#productsPage .cat-nav a[aria-current]::after,
#newsPage .news-tabs a:hover::after,
#newsPage .news-tabs a[aria-current]::after{transform:scaleX(1)}
#productsPage .cat-nav a:focus-visible,
#newsPage .news-tabs a:focus-visible{outline:2px solid var(--blue);outline-offset:-4px}
@media(max-width:768px){
  #productsPage .cat-nav,#newsPage .news-tabs{margin-bottom:28px}
  #productsPage .cat-nav>.wrap,#newsPage .news-tabs>.wrap{justify-content:flex-start;padding:0 12px}
  #productsPage .cat-nav a,#newsPage .news-tabs a{padding:14px 16px;font-size:14px}
}

/* Contact page: spacing only; preserve content, images and typography. */
#contactPage>.sec[id]{padding-top:56px;padding-bottom:56px}
#contactPage>#c1{padding-top:38px}
#contactPage>.sec[id] .sec-head{margin-bottom:32px}
@media(max-width:1024px){#productsPage .prod-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:768px){
  main[data-banner-size="standard"]:not(#contactPage)>.sec:not(:first-child) .sec-head h2{font-size:28px}
  main[data-banner-size="standard"] .cat-head h3,
  main[data-banner-size="standard"] .cat-title h3{font-size:22px}
  #contactPage>.sec[id]{padding-top:40px;padding-bottom:40px}
  #contactPage>#c1{padding-top:28px}
  #contactPage>.sec[id] .sec-head{margin-bottom:24px}
}
@media(max-width:600px){#productsPage .prod-grid{grid-template-columns:minmax(0,1fr)}}

/* Site spacing review: vertical whitespace only. */
main>.sec{padding-bottom:48px}
main>.sec:not(:first-child){padding-top:48px}
main .sec-head{margin-bottom:28px}
main>.sec:first-child>.wrap>.sec-head{margin-bottom:36px}
main>.sec.service-page-sec,
main>.sec.case-page-sec{padding-top:0}
main>.service-hero,
main>.case-hero{margin-bottom:32px}
main .case-client-title{margin-top:36px!important}
main .cat-block{margin-bottom:36px}
main .cat-block:last-child{margin-bottom:0}
main>.cta{padding-top:48px;padding-bottom:48px}
main>.article{padding-top:32px;padding-bottom:40px}
main>.sec .article{padding-bottom:0}

#productsPage .cat-nav,
#newsPage .news-tabs{margin-bottom:32px}
#contactPage>.sec[id]{padding-top:40px;padding-bottom:40px}
#contactPage>#c1{padding-top:32px}
#contactPage>.sec[id] .sec-head{margin-bottom:24px}

main>.pd-original-body{padding-top:24px;padding-bottom:32px}
main .pd-original-content>.pd-original-section{padding-top:36px;padding-bottom:36px}
main .pd-original-content>.pd-original-section:first-child{padding-top:20px}

@media(max-width:768px){
  main>.sec{padding-bottom:32px}
  main>.sec:not(:first-child){padding-top:32px}
  main .sec-head{margin-bottom:22px}
  main>.sec:first-child>.wrap>.sec-head{margin-bottom:28px}
  main>.sec.service-page-sec,
  main>.sec.case-page-sec{padding-top:0}
  main>.service-hero,
  main>.case-hero{margin-bottom:24px}
  main .case-client-title{margin-top:28px!important}
  main .cat-block{margin-bottom:28px}
  main .cat-block:last-child{margin-bottom:0}
  main>.cta{padding-top:32px;padding-bottom:32px}
  main>.article{padding-top:24px;padding-bottom:32px}
  #productsPage .cat-nav,#newsPage .news-tabs{margin-bottom:24px}
  #contactPage>.sec[id]{padding-top:28px;padding-bottom:28px}
  #contactPage>#c1{padding-top:24px}
  #contactPage>.sec[id] .sec-head{margin-bottom:20px}
  main>.pd-original-body{padding-top:20px;padding-bottom:24px}
  main .pd-original-content>.pd-original-section{padding-top:28px;padding-bottom:28px}
  main .pd-original-content>.pd-original-section:first-child{padding-top:16px}
}