/* Japanese company page: September 2026 editorial redesign. */
:root,:root[data-theme]{
  color-scheme:light;
  --surface:#fff;--surface-alt:#f1f7f5;--card:#fff;
  --deep:#173f45;--mid:#395a60;--accent:#267f80;--accent-soft:#466d72;
  --text:#2e494d;--muted:#53676b;--border:#cfdfdd;--hairline:#e0ebe8;
  --ph-bg:#f0f6f3;--shadow:none;--wrap:1240px;
  --serif:var(--sans);
}
body{font-size:1rem;line-height:1.95}
h1,h2,h3,h4{font-weight:600;letter-spacing:.035em}
a:hover{color:#17494c}
section[id]{scroll-margin-top:100px}
.site-head{background:#ffffffed;border-bottom:0}
.site-head .wrap{min-height:88px;gap:24px;max-width:1440px}
.brand{display:block;flex-shrink:0}
.brand__mark{font-size:1.13rem;letter-spacing:.06em}
.brand__sub{display:block;font-size:.62rem;letter-spacing:.19em;margin-top:0;color:var(--accent)}
.nav{gap:20px}
.nav>a{font-size:.75rem;white-space:nowrap}
.lang-nav{gap:3px}
.lang-nav a{font-size:.65rem;border:0;border-radius:20px;padding:5px 9px}
.lang-nav a[aria-current="true"]{background:#e7f2ef}
.hero{background:#fff;position:relative;padding:48px 0 68px;isolation:isolate}
.hero:after{content:"";position:absolute;inset:auto 3% 0;height:95px;background:#f1f7f5;border-radius:90% 90% 0 0;z-index:-1}
.hero .wrap{grid-template-columns:.94fr 1.06fr;gap:22px;max-width:1360px;min-height:570px}
.hero__eyebrow{font-size:.75rem;letter-spacing:.18em;display:flex;align-items:center;gap:12px;margin-bottom:26px;font-weight:600}
.hero__eyebrow:before{content:"";display:block;width:26px;height:2px;background:#d8ab6e}
.hero h1{font-size:clamp(2rem,3.5vw,3.05rem);line-height:1.62;letter-spacing:.02em;text-wrap:initial}
.hero__lead{font-size:.95rem;line-height:2.1;max-width:30em;margin-top:26px}
.hero-art{max-width:680px;width:112%;margin-left:-5%;background:#fff;border-radius:0;overflow:visible}
.hero-art img{width:100%;height:auto}
.btn-row{gap:14px;margin-top:30px}
.btn{border-radius:40px;padding:14px 24px;font-size:.8rem;letter-spacing:.02em}
.btn:after{content:"↗";margin-left:18px}
.btn--ghost{border-color:#9ebfba}
.sec{padding-block:90px}
.sec--alt{border:0}
.sec__head{max-width:50em;margin-bottom:38px}
.sec__head .n{font-family:var(--sans);font-size:.74rem;font-weight:600;letter-spacing:.12em;display:flex;align-items:center;gap:12px}
.sec__head .n:after{content:"";width:40px;height:1px;background:#b3cbc5}
.sec__head h2{font-size:clamp(1.5rem,2.65vw,2.15rem);line-height:1.65}
.sec__head p{font-size:.96rem;line-height:2;max-width:46em}
:is(#ja-insight,#en-insight,#vi-insight,#fr-insight)>.wrap{display:grid;grid-template-columns:1.25fr .75fr;column-gap:70px;align-items:start}
:is(#ja-insight,#en-insight,#vi-insight,#fr-insight) .sec__head,:is(#ja-insight,#en-insight,#vi-insight,#fr-insight) .msg__body{grid-column:1}
.insight-landscape{grid-column:2;grid-row:1/4;align-self:center;position:relative;transform:rotate(2deg);margin:0 0 50px}
.insight-landscape img{display:block;width:100%;height:410px;object-fit:cover;border-radius:130px 130px 8px 8px}
.insight-landscape figcaption{font-size:.66rem;letter-spacing:.18em;margin-top:16px;color:var(--accent)}
:is(#ja-insight,#en-insight,#vi-insight,#fr-insight) .scope-quote{grid-column:1/-1;max-width:none;width:100%;margin-top:40px!important;padding:28px 36px;background:white;border:0;border-radius:4px 40px 4px 4px;font-size:clamp(1.12rem,2vw,1.5rem)}
:is(#ja-insight,#en-insight,#vi-insight,#fr-insight) .msg__body:last-child{grid-column:1/-1;max-width:48em!important}
.msg__body p{font-size:1rem;line-height:2.1}
.cards{gap:26px}
.card{border:0;border-radius:0;padding:0 24px 28px;box-shadow:none;background:#f4f8f6;gap:16px;overflow:hidden}
.card:nth-child(2){background:#f3f7fa}
.card:nth-child(3){background:#fbf6ec}
.card:hover{transform:none;box-shadow:none}
.card__icon{display:none}
.card__tag{order:-2;padding-top:25px;font-size:.75rem;font-weight:600;letter-spacing:.08em}
.service-art{order:-1;width:calc(100% + 48px);max-width:none;margin:0 -24px 8px;height:230px;object-fit:contain;background:#fff}
.card h3{font-size:1.24rem;line-height:1.65;min-height:3.3em}
.card p{font-size:.94rem;line-height:1.95}
.chips{gap:5px}
.chips span{font-size:.69rem;border:0;background:#ffffffc9;padding:5px 10px}
.compare-wrap{margin-top:44px;border-top:1px solid var(--border)}
.compare th,.compare td{padding:20px 16px}
.compare thead{background:#f1f7f5}
.compare tbody th{width:24%}
.compare{min-width:0;font-size:.85rem}
.panels{gap:28px;margin-top:36px}
.panel{padding:32px;border:0;border-radius:8px;background:#fff}
.panel--muted{background:#e5f0ed}
.panel h4{font-size:1.12rem;margin-bottom:22px}
.panel li{font-size:.95rem;line-height:1.85;gap:5px}
.panel--muted li:before{color:#668c85}
.two{gap:36px}
.two>div{border-top:2px solid #8db8ac;padding:30px 28px;background:#f6f9f7;border-radius:0 0 10px 10px}
.two>div:last-child{border-color:#dcb67e;background:#fbf7ef}
.two h4{font-size:1.23rem}
.two li{font-size:.95rem}
.scope-quote{font-size:clamp(1.25rem,2.6vw,1.75rem);border-left:3px solid #84b6aa;padding-left:24px}
:is(#ja-message,#en-message,#vi-message,#fr-message){background:#fff;padding-block:100px}
.msg{grid-template-columns:310px minmax(0,1fr);gap:80px}
.photo--portrait{border-radius:160px 160px 8px 8px}
.photo-cap{text-align:center;letter-spacing:.05em}
.msg__sign{gap:8px 20px}
.msg__sign strong{font-size:1.4rem}
.bio{background:#f1f7f5;padding:24px;border-radius:4px}
.bio li{font-size:.85rem}
:is(#ja-company,#en-company,#vi-company,#fr-company){background:#f6f9f8}
:is(#ja-company,#en-company,#vi-company,#fr-company)>.wrap{max-width:1060px}
.facts th,.facts td{padding:22px 0;line-height:1.9}
.facts th{font-size:.84rem;width:11em}
.facts td{font-size:.93rem}
.site-foot{background:#fff;padding-block:36px}
.site-foot nav{flex-wrap:wrap;gap:12px 22px}
.site-foot nav a{font-size:.75rem}
@media(max-width:1120px){.nav>a{display:none}.hero .wrap{min-height:480px}.hero-art{width:108%;margin-left:-4%}.msg{gap:45px}}
@media(max-width:800px){
 .site-head .wrap{min-height:76px;padding-inline:22px;gap:12px}
 .brand__mark{font-size:.95rem}.brand__sub{font-size:.55rem}
 .hero{padding-top:30px;padding-bottom:40px}
 .hero .wrap{grid-template-columns:1fr;gap:24px;min-height:0}
 .hero h1{font-size:clamp(1.9rem,5.4vw,2.75rem);line-height:1.6}
 .hero__eyebrow{margin-bottom:18px}
 .hero__lead{max-width:36em;font-size:1rem}
 .hero-art{max-width:540px;width:100%;margin:0 auto}
 .hero:after{height:60px}
 .sec{padding-block:56px}
 :is(#ja-insight,#en-insight,#vi-insight,#fr-insight)>.wrap{display:flex;flex-direction:column;gap:0}
 .insight-landscape{order:2;width:100%;max-width:480px;align-self:center;margin:38px 0 0;transform:rotate(0)}
 .insight-landscape img{height:220px;border-radius:60px 4px 4px 4px}
 :is(#ja-insight,#en-insight,#vi-insight,#fr-insight) .scope-quote{padding:24px;margin-top:26px!important}
 .cards{grid-template-columns:1fr;gap:28px}
 .card{padding:0 26px 28px}
 .service-art{width:calc(100% + 52px);margin-inline:-26px;height:250px}
 .card h3{min-height:0;font-size:1.3rem}
 .card p{font-size:1rem}
 .chips span{font-size:.8rem}
 .panels,.two{grid-template-columns:1fr;gap:20px}
 .panel{padding:26px}.panel li{font-size:1rem}
 .two>div{padding:26px}
 .msg{grid-template-columns:1fr;gap:32px}
 .photo-figure{max-width:280px;margin:0 auto;width:100%}
 :is(#ja-message,#en-message,#vi-message,#fr-message){padding-block:56px}
 .facts th{width:7.5em;padding-right:18px}
 .facts td{overflow-wrap:anywhere}
 .compare{font-size:.8rem}.compare th,.compare td{padding:16px 8px}
 .site-foot .wrap{gap:20px}
}
@media(max-width:420px){
 .site-head .wrap{padding-inline:16px}
 .brand__mark{font-size:.86rem}
 .lang-nav a{font-size:.61rem;padding:5px 6px}
 .btn{padding:12px 16px;font-size:.75rem}.btn:after{margin-left:10px}
 .btn-row{gap:10px}
 .facts th{width:6.5em;font-size:.8rem}.facts td{font-size:.88rem}
 .compare th,.compare td{font-size:.75rem}
}
