/* ShakeHands homepage v11, editorial and mobile-specific.
   One identity and one content source. The layout changes at 760px.
   Lightweight: no animation framework; only transform/opacity on images. */
.s5-app[data-s5-palette="brand"]:has(.s11-home){padding-bottom:0!important}
.s5-app[data-s5-palette="brand"]:has(.s11-home) .s5-mobile-cta{display:none!important}
.s5-app[data-s5-palette="brand"] .s11-home{
  background:white!important;
  color:#231916;
}
.s5-app[data-s5-palette="brand"] .s11-home :is(h1,h2,h3,p,figure){margin:0;padding:0}
.s5-app[data-s5-palette="brand"] .s11-home h2{
  color:#231916!important;line-height:1.45!important;font-size:clamp(30px,8vw,43px);font-weight:850;letter-spacing:-.052em!important;
}
.s5-app[data-s5-palette="brand"] .s11-home .s11-en{
  color:#1D2088!important;letter-spacing:.135em;font:800 11px/1.5 "Noto Sans JP",sans-serif;
  margin:0 0 15px!important;
}
.s5-app[data-s5-palette="brand"] .s11-hero{
  position:relative;
  background:#fff!important;
}
.s5-app[data-s5-palette="brand"] .s11-hero-inner{
  width:100%!important;
  max-width:none!important;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:1fr;
  height:calc(100svh - 72px);
  min-height:575px;
  max-height:900px;
  margin:0;
  position:relative;
  isolation:isolate;
}
.s5-app[data-s5-palette="brand"] .s11-hero-image{
  grid-area:1/1;position:relative;z-index:0;isolation:isolate;overflow:hidden;
  background:#465668!important;height:100%;width:100%;
}
.s5-app[data-s5-palette="brand"] .s11-hero-image picture{display:block;height:100%;width:100%}
.s5-app[data-s5-palette="brand"] .s11-hero-image img{
  display:block;height:100%;width:100%;object-fit:cover;object-position:50% 52%;
  filter:saturate(.93);
}
.s5-app[data-s5-palette="brand"] .s11-hero-image:after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(12,19,38,.89) 0%,rgba(12,19,38,.73) 23%,rgba(12,19,38,.28) 64%,transparent 95%);
}
.s5-app[data-s5-palette="brand"] .s11-hero-copy{
  grid-area:1/1;z-index:2;
  align-self:end;
  padding:0 24px 63px;
  position:relative;
}
.s5-app[data-s5-palette="brand"] .s11-hero-copy .s11-overline{
  color:rgba(255,255,255,.85)!important;
  font:800 10px/1.3 "Noto Sans JP",sans-serif;
  letter-spacing:.16em;margin:0 0 16px!important;
}
.s5-app[data-s5-palette="brand"] .s11-hero-copy h1,
.s5-app[data-s5-palette="brand"] .s11-hero-copy h1 em{
  color:#fff!important;
  font-size:clamp(42px,11.6vw,62px)!important;
  font-weight:900!important;
  line-height:1.46!important;
  letter-spacing:-.065em!important;
  font-style:normal!important;
  text-shadow:0 3px 18px rgba(0,0,0,.2);
}
.s5-app[data-s5-palette="brand"] .s11-hero-copy>p:last-child{
  margin-top:19px!important;
  color:#fff!important;
  line-height:2!important;
  font-size:13px!important;
  max-width:29em;
  letter-spacing:.015em;
}
.s5-app[data-s5-palette="brand"] .s11-section{padding:76px 0}
.s5-app[data-s5-palette="brand"] .s11-section-head{margin-bottom:33px}
.s5-app[data-s5-palette="brand"] .s11-section-head>p:last-child{
  color:#545462!important;
  margin-top:15px!important;
  line-height:1.95!important;
  font-size:14px!important;
}
.s5-app[data-s5-palette="brand"] .s11-business{background:#fff!important}
.s5-app[data-s5-palette="brand"] .s11-services{display:grid;gap:28px}
.s5-app[data-s5-palette="brand"] .s11-service{
  min-width:0;
  display:block;
  text-decoration:none;
  color:inherit!important;
}
.s5-app[data-s5-palette="brand"] .s11-service figure{
  position:relative;overflow:hidden;
  height:auto;aspect-ratio:1.42;background:#e7e8ef;
  border-radius:5px;
}
.s5-app[data-s5-palette="brand"] .s11-service figure img{
  display:block;width:100%;height:100%;object-fit:cover;
  transition:transform .65s ease;
}
.s5-app[data-s5-palette="brand"] .s11-service:hover figure img{transform:scale(1.035)}
.s5-app[data-s5-palette="brand"] .s11-service-copy{padding:17px 2px 2px}
.s5-app[data-s5-palette="brand"] .s11-service-no{
  color:#555887;font:800 10px/1.4 "Noto Sans JP",sans-serif;letter-spacing:.11em;
}
.s5-app[data-s5-palette="brand"] .s11-service h3{
  margin:10px 0 8px!important;font-size:23px!important;
  font-weight:800;color:#231916!important;line-height:1.45!important;
}
.s5-app[data-s5-palette="brand"] .s11-service-copy>p{
  color:#686874!important;font-size:13px!important;
  line-height:1.9!important;
}
.s5-app[data-s5-palette="brand"] .s11-more{
  margin-top:14px;display:flex;justify-content:space-between;
  gap:12px;align-items:center;
  padding-top:11px;border-top:1px solid #e5e6ec;
  color:#1D2088;font-size:12px;font-weight:800;
}
.s5-app[data-s5-palette="brand"] .s11-more>span{font-size:20px;font-weight:500}
.s5-app[data-s5-palette="brand"] .s11-development-image{
  display:grid;place-items:center;
  isolation:isolate;
  background:linear-gradient(150deg,#e5e7ee,#f3f4f9 58%,#d6dbea)!important;
}
.s5-app[data-s5-palette="brand"] .s11-building{
  display:block;position:absolute;bottom:25%;width:19%;border:2px solid #69718f;
  background:repeating-linear-gradient(to bottom,#b9c1d9 0 13px,#f5f6fc 14px 20px);
  box-shadow:6px 7px 0 rgba(21,27,73,.1);
}
.s5-app[data-s5-palette="brand"] .s11-building-a{left:22%;height:35%}
.s5-app[data-s5-palette="brand"] .s11-building-b{left:43%;height:59%}
.s5-app[data-s5-palette="brand"] .s11-building-c{left:65%;height:42%}
.s5-app[data-s5-palette="brand"] .s11-building-floor{width:76%;height:2px;background:#6f7591;bottom:24%;position:absolute}
.s5-app[data-s5-palette="brand"] .s11-web-work{
  margin-top:30px;
  border-top:1px solid #e0e2ee;border-bottom:1px solid #e0e2ee;
  padding:24px 0 25px;display:grid;grid-template-columns:46px 1fr;gap:16px;
  align-items:start;
}
.s5-app[data-s5-palette="brand"] .s11-web-symbol{
  display:grid;place-items:center;
  border:1px solid #c5c9e7;color:#1D2088;
  font-size:12px;font-weight:900;height:45px;border-radius:5px;
}
.s5-app[data-s5-palette="brand"] .s11-web-work>div:last-child>span{
  font-size:10px;letter-spacing:.08em;color:#525794;font-weight:800;
}
.s5-app[data-s5-palette="brand"] .s11-web-work h3{
  font-size:17px!important;margin:7px 0 5px!important;
  color:#231916!important;font-weight:850!important;
}
.s5-app[data-s5-palette="brand"] .s11-web-work p{
  font-size:12px!important;color:#61616d!important;line-height:1.9!important;
}
/* Quiet about text, not a second hero. */
.s5-app[data-s5-palette="brand"] .s11-about{background:#f8f8fc!important}
.s5-app[data-s5-palette="brand"] .s11-about-inner{display:grid;gap:23px}
.s5-app[data-s5-palette="brand"] .s11-about-right p,
.s5-app[data-s5-palette="brand"] .s11-case-intro>p:not(.s11-en){
  font-size:14px!important;line-height:2.05!important;color:#565663!important;
}
.s5-app[data-s5-palette="brand"] .s11-about-right a,
.s5-app[data-s5-palette="brand"] .s11-case-intro a,
.s5-app[data-s5-palette="brand"] .s11-end-inner>a{
  display:inline-flex;align-items:center;gap:22px;color:#1D2088!important;
  border-bottom:1px solid #1D2088;padding-bottom:6px;
  font-size:13px;font-weight:800;margin-top:23px;
}
.s5-app[data-s5-palette="brand"] .s11-about-right a span,
.s5-app[data-s5-palette="brand"] .s11-case-intro a span,
.s5-app[data-s5-palette="brand"] .s11-end-inner>a span{font-size:19px;font-weight:500}
/* Evidence with geographical context: not 'Nago 16' without an explanation. */
.s5-app[data-s5-palette="brand"] .s11-case{background:#fff!important}
.s5-app[data-s5-palette="brand"] .s11-case-inner{display:grid;gap:33px}
.s5-app[data-s5-palette="brand"] .s11-case-intro h2{margin-bottom:18px!important}
.s5-app[data-s5-palette="brand"] .s11-case-numbers{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;align-self:center;
}
.s5-app[data-s5-palette="brand"] .s11-case-numbers>div{
  border-top:3px solid #1D2088;
  background:#f6f6fc;padding:20px 12px;
  min-width:0;
}
.s5-app[data-s5-palette="brand"] .s11-case-numbers strong{
  display:flex;align-items:baseline;font-weight:900;
  color:#1D2088!important;font-size:clamp(54px,15.1vw,74px)!important;
  line-height:1.1!important;letter-spacing:-.075em!important;
  white-space:nowrap;
}
.s5-app[data-s5-palette="brand"] .s11-case-numbers strong .s6-count{
  font-size:inherit!important;font-weight:inherit!important;
  letter-spacing:inherit!important;display:inline!important;line-height:inherit!important;
  color:inherit!important;margin:0!important;
}
.s5-app[data-s5-palette="brand"] .s11-case-numbers strong small{
  font-size:14px!important;letter-spacing:0;margin-left:5px;
}
.s5-app[data-s5-palette="brand"] .s11-case-numbers>div>span{
  display:block;color:#5b5c68;font-size:11px;line-height:1.55;
  font-weight:700;margin-top:10px;
}
.s5-app[data-s5-palette="brand"] .s11-note{
  font-size:10px!important;color:#8b8b95!important;line-height:1.75!important;
  margin-top:20px!important;
}
.s5-app[data-s5-palette="brand"] .s11-end{border-top:1px solid #e9e9ee;background:#fff!important}
.s5-app[data-s5-palette="brand"] .s11-end-inner{display:grid;gap:16px}
.s5-app[data-s5-palette="brand"] .s11-end-inner>p{color:#5e5f6a!important;font-size:13px!important;line-height:2!important}
.s5-app[data-s5-palette="brand"] .s11-end-inner>a{margin-top:3px}
@media(min-width:760px){
 .s5-app[data-s5-palette="brand"] .s11-hero{padding:78px 0 95px}
 .s5-app[data-s5-palette="brand"] .s11-hero-inner{
   width:calc(100% - 80px)!important;max-width:1200px!important;
   display:grid;grid-template-columns:minmax(0,1fr) minmax(0,46%);
   grid-template-rows:auto;gap:6%;
   height:auto;min-height:0;max-height:none;
   align-items:center;margin:auto;
 }
 .s5-app[data-s5-palette="brand"] .s11-hero-copy{
   grid-area:1/1;align-self:auto;
   color:#231916!important;padding:0;
 }
 .s5-app[data-s5-palette="brand"] .s11-hero-copy .s11-overline{
   color:#1D2088!important;
   font-size:11px!important;
 }
 .s5-app[data-s5-palette="brand"] .s11-hero-copy h1{
   color:#231916!important;font-size:clamp(46px,5vw,70px)!important;
   text-shadow:none;
 }
 .s5-app[data-s5-palette="brand"] .s11-hero-copy h1 em{
   color:#1D2088!important;font-size:inherit!important;text-shadow:none;
 }
 .s5-app[data-s5-palette="brand"] .s11-hero-copy>p:last-child{
   color:#595967!important;font-size:14px!important;margin-top:26px!important;
 }
 .s5-app[data-s5-palette="brand"] .s11-hero-image{
   grid-area:1/2;aspect-ratio:1.06;
   height:auto;border-radius:7px;
 }
 .s5-app[data-s5-palette="brand"] .s11-hero-image:after{display:none}
 .s5-app[data-s5-palette="brand"] .s11-section{padding:106px 0}
 .s5-app[data-s5-palette="brand"] .s11-services{
   grid-template-columns:repeat(2,minmax(0,1fr));
   gap:27px;
 }
 .s5-app[data-s5-palette="brand"] .s11-service-featured{
   grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;
   align-items:center;gap:30px;
 }
 .s5-app[data-s5-palette="brand"] .s11-service-featured figure{aspect-ratio:1.42}
 .s5-app[data-s5-palette="brand"] .s11-service figure{aspect-ratio:1.65}
 .s5-app[data-s5-palette="brand"] .s11-service-featured figure{aspect-ratio:1.45}
 .s5-app[data-s5-palette="brand"] .s11-service-featured .s11-service-copy{padding:0 25px 0 0}
 .s5-app[data-s5-palette="brand"] .s11-service-featured h3{font-size:31px!important}
 .s5-app[data-s5-palette="brand"] .s11-web-work{
   grid-template-columns:52px 1fr;
   gap:22px;padding:28px 0;margin-top:44px;
 }
 .s5-app[data-s5-palette="brand"] .s11-about-inner{grid-template-columns:1fr 1fr;gap:8%}
 .s5-app[data-s5-palette="brand"] .s11-case-inner{grid-template-columns:1.1fr .9fr;gap:7%}
 .s5-app[data-s5-palette="brand"] .s11-case-numbers strong{font-size:clamp(59px,5.8vw,86px)!important}
 .s5-app[data-s5-palette="brand"] .s11-end-inner{
   grid-template-columns:1fr 1.1fr auto;gap:23px;align-items:center;
 }
 .s5-app[data-s5-palette="brand"] .s11-end-inner>a{margin-top:0;white-space:nowrap}
}
@media(min-width:1080px){
 .s5-app[data-s5-palette="brand"] .s11-hero{padding:110px 0}
 .s5-app[data-s5-palette="brand"] .s11-hero-copy h1{font-size:clamp(59px,5vw,76px)!important}
 .s5-app[data-s5-palette="brand"] .s11-section{padding:124px 0}
 .s5-app[data-s5-palette="brand"] .s11-services{gap:32px}
}
@media(max-width:375px){
 .s5-app[data-s5-palette="brand"] .s11-hero-copy{padding-left:19px;padding-right:19px;padding-bottom:48px}
 .s5-app[data-s5-palette="brand"] .s11-hero-copy h1{font-size:41px!important}
 .s5-app[data-s5-palette="brand"] .s11-case-numbers strong{font-size:52px!important}
}
@media(prefers-reduced-motion:reduce){
 .s5-app[data-s5-palette="brand"] .s11-service img{transition:none!important}
}
