/* Shared work detail only; shared theme layout and components keep their existing styles. */
.work-detail-modern{margin:0;background:#fff;color:#202627;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:15px;line-height:1.9;-webkit-font-smoothing:antialiased}
.work-detail-modern *{box-sizing:border-box}.work-detail-modern a{color:inherit;text-decoration:none}.work-detail-modern a:hover{color:#567c72}.work-detail-modern a:focus-visible{outline:2px solid #567c72;outline-offset:6px}.work-detail-modern img{display:block;max-width:100%;height:auto}.work-detail-modern h1,.work-detail-modern h2,.work-detail-modern h3,.work-detail-modern p,.work-detail-modern figure,.work-detail-modern dl,.work-detail-modern dd{margin:0}.work-detail-modern .work-detail__wrap{width:calc(100% - 48px);margin-inline:auto}.work-detail-modern .work-detail__hero{padding-block:88px 64px}.work-detail-modern .work-detail__eyebrow{font-size:11px;font-weight:600;letter-spacing:2px;line-height:1.5}.work-detail-modern .work-detail__eyebrow span{color:#7c8581;margin-left:12px}.work-detail-modern .work-detail__hero h1{margin-top:32px;font-weight:500;line-height:1.6;letter-spacing:.02em}.work-detail-modern .work-detail__client{display:block;font-size:clamp(23px,3.1vw,41px);font-weight:600;line-height:1.35;letter-spacing:-.035em}.work-detail-modern .work-detail__headline{display:block;max-width:850px;margin-top:24px;font-size:clamp(23px,2.7vw,35px);font-weight:500;text-wrap:pretty}.work-detail-modern .work-detail__lead{max-width:790px;margin-top:32px!important;font-size:15px;line-height:2.15;color:#58605e}.work-detail-modern .work-detail__info{margin-top:48px;background:#f5f6f5;padding:28px 34px}.work-detail-modern .work-detail__info dl{display:grid;grid-template-columns:1.15fr 1.15fr 1fr .5fr;gap:24px;margin-top:22px}.work-detail-modern .work-detail__field dt{color:#727b77;font-size:11px;margin-bottom:7px}.work-detail-modern .work-detail__field dd{font-size:13px}.work-detail-modern .work-detail__field--wide{grid-column:1/-1;border-top:1px solid #dce1de;padding-top:18px}.work-detail-modern .work-detail__site{display:flex;justify-content:space-between;border-top:1px solid #dce1de;margin-top:20px;padding-top:18px;font-size:12px}.work-detail-modern .work-detail__site span{color:#636e68}.work-detail-modern .work-detail__visual{background:transparent;padding:0 0 28px}.work-detail-modern .work-detail__devices{position:relative;max-width:940px;margin:40px auto 0;padding:0 80px 36px 0}.work-detail-modern .work-detail__desktop{overflow:hidden;border:1px solid #d0d5d2;border-radius:9px;background:white;box-shadow:0 20px 45px #263c2d15}.work-detail-modern .work-detail__bar{height:29px;display:flex;gap:5px;align-items:center;padding:0 12px;background:#fafbfa;border-bottom:1px solid #e2e5e3}.work-detail-modern .work-detail__bar i{width:5px;height:5px;border-radius:100%;background:#c8ceca}.work-detail-modern .work-detail__bar span{font-size:8px;text-align:center;flex:1;color:#88918a;letter-spacing:.4px}.work-detail-modern .work-detail__desktop-screen{aspect-ratio:1.6;overflow:hidden}.work-detail-modern .work-detail__phone{position:absolute;right:0;bottom:0;width:22%;padding:7px;background:#fafbfa;border:1px solid #c8cfca;border-radius:25px;box-shadow:0 15px 30px #263c2d20;overflow:hidden}.work-detail-modern .work-detail__speaker{height:13px;width:38%;background:#d7ddd9;border-radius:20px;position:absolute;left:31%;top:9px}.work-detail-modern .work-detail__phone-screen{aspect-ratio:.48;overflow:hidden;border-radius:19px;padding-top:18px;background:white}.work-detail-modern .work-detail__phone-screen img{width:100%;height:auto}.work-detail-modern .work-detail__caption{text-align:right;font-size:10px;color:#747e78;margin-top:22px!important}.work-detail-modern .work-detail__story{display:block;padding-block:112px}.work-detail-modern .work-detail__body{max-width:none;margin-left:0;line-height:2.2;color:#49514d;font-size:15px}.work-detail-modern .work-detail__body h2{font-size:23px;font-weight:500;line-height:1.7;color:#202627;padding-top:35px;margin:60px 0 24px;border-top:1px solid #dee3df}.work-detail-modern .work-detail__body h2:first-of-type{margin-top:0;padding-top:0;border:0}.work-detail-modern .work-detail__body p{margin:0 0 24px}.work-detail-modern .work-detail__body figure{margin:35px 0}.work-detail-modern .work-detail__body figure img{margin-inline:auto;border:1px solid #e5e8e6}.work-detail-modern .work-detail__body figcaption{font-size:11px;text-align:center;color:#737d76;line-height:1.8;margin-top:12px}.work-detail-modern .work-detail__body a{display:inline-block;text-decoration:underline;text-underline-offset:5px}.work-detail-modern .work-detail__related{padding-block:88px}.work-detail-modern .work-detail__section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:32px}.work-detail-modern .work-detail__section-head h2{font-size:25px;font-weight:500;margin-top:14px}.work-detail-modern .work-detail__section-head>a{font-size:12px;border-bottom:1px solid #ccd3ce;padding-bottom:5px}.work-detail-modern .work-detail__cards{display:grid;grid-template-columns:1fr 1fr;gap:34px}.work-detail-modern .work-detail__card img{width:100%;aspect-ratio:2.05;object-fit:contain;background:#fff}.work-detail-modern .work-detail__card h3{font-size:15px;font-weight:500;line-height:1.9;margin:20px 0 12px}.work-detail-modern .work-detail__card>span{font-size:11px;color:#707b73}
@media(max-width:760px){.work-detail-modern .work-detail__wrap{width:calc(100% - 40px)}.work-detail-modern .work-detail__hero{padding-block:52px 40px}.work-detail-modern .work-detail__hero h1{margin-top:26px}.work-detail-modern .work-detail__headline{margin-top:20px;font-size:25px}.work-detail-modern .work-detail__lead{font-size:14px;margin-top:24px!important}.work-detail-modern .work-detail__info{padding:24px 22px;margin-top:32px}.work-detail-modern .work-detail__info dl{grid-template-columns:1fr 1fr;gap:20px}.work-detail-modern .work-detail__site{display:block}.work-detail-modern .work-detail__site span{display:block;font-size:10px;margin-top:5px}.work-detail-modern .work-detail__visual{padding-top:0}.work-detail-modern .work-detail__devices{margin-top:28px;padding-right:36px;padding-bottom:20px}.work-detail-modern .work-detail__phone{width:26%;padding:4px;border-radius:13px}.work-detail-modern .work-detail__phone-screen{border-radius:9px;padding-top:10px}.work-detail-modern .work-detail__speaker{height:6px;top:6px}.work-detail-modern .work-detail__bar{height:20px;padding:0 7px;gap:3px}.work-detail-modern .work-detail__bar span{font-size:6px}.work-detail-modern .work-detail__bar i{width:3px;height:3px}.work-detail-modern .work-detail__caption{font-size:9px}.work-detail-modern .work-detail__story{display:block;padding-block:64px}.work-detail-modern .work-detail__body{font-size:14px}.work-detail-modern .work-detail__body h2{font-size:21px;margin-top:45px}.work-detail-modern .work-detail__related{padding-block:60px}.work-detail-modern .work-detail__section-head{align-items:start;gap:18px}.work-detail-modern .work-detail__section-head h2{font-size:22px}.work-detail-modern .work-detail__section-head>a{font-size:10px;white-space:nowrap}.work-detail-modern .work-detail__cards{grid-template-columns:1fr;gap:34px}}


.work-detail-modern .work-detail__client{overflow-wrap:anywhere}

/* Match typography, links, and buttons used by the existing theme. */
.work-detail-modern{
  color:#222;
  font-family:inherit;
  font-size:inherit;
  line-height:inherit;
}
.work-detail-modern .work-detail__wrap{width:100%}
.work-detail-modern .work-detail__hero{padding:40px 0 32px}
.work-detail-modern a:hover{color:var(--orangered)}
.work-detail-modern a:focus-visible{outline:2px solid var(--orangered);outline-offset:2px}
.work-detail-modern .work-detail__hero h1{
  margin:30px 0 0;
  color:#222;
  font-size:2.2rem;
  font-weight:700;
  line-height:1.35;
  letter-spacing:normal;
}
.work-detail-modern .work-detail__client,
.work-detail-modern .work-detail__headline{
  font-size:inherit;
  font-weight:inherit;
  line-height:inherit;
  letter-spacing:normal;
}
.work-detail-modern .work-detail__client{font-size:.84em}
.work-detail-modern .work-detail__headline{max-width:none;margin-top:.45em}
.work-detail-modern .work-detail__headline--single{margin-top:0}
.work-detail-modern .work-detail__eyebrow{font-size:.75rem;color:#666}
.work-detail-modern .work-detail__hero>.work-detail__eyebrow{color:var(--orangered);font-size:1rem}
.work-detail-modern .work-detail__lead{
  max-width:none;
  font-size:inherit;
  line-height:1.9;
  color:#333;
}
.work-detail-modern .work-detail__info{border-radius:7px;color:#222;font-size:.96rem}
.work-detail-modern .work-detail__info dl{margin-top:0}
.work-detail-modern .work-detail__field dt{color:#333;font-size:inherit;font-weight:700}
.work-detail-modern .work-detail__field dd{color:#222;font-size:inherit}
.work-detail-modern .work-detail__site.btn-work-detail-page{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  margin:24px 0 0;
  padding:16px 24px;
  border:0;
  background:var(--orangered);
  color:#fff!important;
  font-size:1.25rem;
  letter-spacing:.1em;
  text-align:center;
  white-space:nowrap;
  transition:background .2s,color .2s;
}
.work-detail-modern .work-detail__site.btn-work-detail-page:hover{background:var(--blue);color:#fff!important}
.work-detail-modern .work-detail__site.btn-work-detail-page span{color:inherit;font-size:.85rem;letter-spacing:normal}
.work-detail-modern .work-detail__actions{display:grid;gap:12px;margin-top:24px}
.work-detail-modern .work-detail__actions .btn-work-detail-page{margin:0}
.work-detail-modern .work-detail__report.btn-work-detail-page{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:14px 24px;
  border:1px solid var(--orangered);
  border-radius:4px;
  background:#fff;
  color:var(--orangered)!important;
  font-weight:700;
  text-align:center;
}
.work-detail-modern .work-detail__report.btn-work-detail-page:hover{border-color:var(--blue);background:var(--blue);color:#fff!important}
.work-detail-modern .work-detail__caption{font-size:.75rem;color:#666}
.work-detail-modern .work-detail__story{padding:32px 0 56px}
.work-detail-modern .work-detail__body{
  color:#222;
  font-size:inherit;
  line-height:1.9;
}
.work-detail-modern .work-detail__body-section{margin:0;padding:0}
.work-detail-modern .work-detail__body h2{
  margin:64px 0 16px;
  padding-top:0;
  border-top:0;
  color:#222;
  font-size:1.5em;
  font-weight:700;
  line-height:1.9;
}
.work-detail-modern .work-detail__body-section:first-child h2:first-of-type{margin-top:0}
.work-detail-modern .work-detail__body-section + .work-detail__body-section h2:first-of-type{margin-top:64px}
.work-detail-modern .work-detail__body p{margin:0 0 16px}
.work-detail-modern .work-detail__body figcaption{font-size:16px}
.work-detail-modern .work-detail__legacy-gallery{display:grid;gap:28px;margin-top:40px}
.work-detail-modern .work-detail__legacy-gallery figure{margin:0}
.work-detail-modern .work-detail__legacy-gallery img{width:100%;height:auto;margin-inline:auto;border:1px solid #e5e8e6}
.work-detail-modern .work-detail__legacy-visual{max-width:940px;margin:40px auto 0}
.work-detail-modern .work-detail__legacy-hero{overflow:hidden;border:1px solid #d0d5d2;border-radius:9px;background:#fff;box-shadow:0 20px 45px #263c2d15}
.work-detail-modern .work-detail__legacy-viewport{height:clamp(340px,42vw,520px);overflow:hidden;background:#f5f6f5}
.work-detail-modern .work-detail__legacy-hero-image{width:100%;max-width:none;height:auto}
.work-detail-modern .work-detail__legacy-full figcaption{margin-top:12px;color:#666;font-size:.9rem;text-align:center}
.work-detail-modern .work-detail__body a:not(.btn-work-detail-page){color:var(--orangered);text-decoration:underline!important;text-underline-offset:3px}
.work-detail-modern .work-detail__body .btn-work-detail-page{color:#fff!important;text-decoration:none!important}
.work-detail-modern .btn-work-detail-page,
.work-detail-modern ~ .btn-work-detail-page{border-radius:4px;font-weight:700}
.work-detail-modern .work-detail__section-head h2{margin-top:7px;color:#222;font-size:1.5rem;font-weight:700}
.work-detail-modern .work-detail__section-head>a{font-size:.9rem;color:var(--orangered);border-bottom-color:var(--orangered)}
.work-detail-modern .work-detail__card h3{color:#222;font-size:1.1rem;font-weight:600;line-height:1.4}
.work-detail-modern .work-detail__card>span{font-size:.9rem;color:var(--orangered)}
.work-detail-modern .work-detail__body-section:last-child p:last-child{margin-bottom:8px}
.work-detail-modern .work-detail__body-section:last-child p:last-child .btn-work-detail-page{margin-bottom:25px}
.work-detail-modern .work-detail__related{padding:28px 0 64px}

/* Keep non-web visual work sharp by limiting only its article imagery on desktop. */
@media(min-width:768px){
  .work-detail-modern--visual .work-detail__legacy-gallery,
  .work-detail-modern--visual .work-detail__body-section>figure{
    width:65%;
    max-width:65%;
    margin-left:auto;
    margin-right:auto;
  }
  .work-detail-modern--visual .work-detail__body-section>img,
  .work-detail-modern--visual .work-detail__body-section>p>img:only-child{
    width:auto;
    max-width:65%;
    margin-left:auto;
    margin-right:auto;
  }
  .work-detail-modern--visual .work-detail__body-section>figure img{
    width:100%;
    max-width:100%;
  }
}

@media(max-width:760px){
  .work-detail-modern .work-detail__hero{padding-bottom:20px}
  .work-detail-modern .work-detail__legacy-visual{margin-top:28px}
  .work-detail-modern .work-detail__legacy-viewport{height:260px}
  .work-detail-modern .work-detail__story{padding-top:24px}
  .work-detail-modern .work-detail__related{padding:20px 0 44px}
}

@media(max-width:576px){
  .work-detail-modern .work-detail__hero{padding:24px 0 20px}
  .work-detail-modern .work-detail__hero h1{font-size:1.4rem!important}
  .work-detail-modern .work-detail__headline{font-size:inherit}
  .work-detail-modern .work-detail__lead,
  .work-detail-modern .work-detail__body{font-size:inherit}
  .work-detail-modern .work-detail__body h2{font-size:1.5em}
  .work-detail-modern .work-detail__story{padding:24px 0 32px}
  .work-detail-modern .work-detail__site.btn-work-detail-page{display:block;font-size:1.25rem;text-align:center}
  .work-detail-modern .work-detail__site.btn-work-detail-page span{display:block;margin-top:4px}
}

/* Match the phone frame to the 750 x 1300 smartphone screenshot. */
.work-detail-modern .work-detail__phone-screen{aspect-ratio:auto}