@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800;900&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#252a33;--muted:#626975;--blue:#303fd6;--surface:#edf0f2;--yellow:#e9ff68;--line:#d5dce1;--shadow:12px 12px 26px #cdd3d9,-12px -12px 26px #fff;--font:'Manrope','Noto Sans JP',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:60px}
body{margin:0;color:var(--ink);background:var(--surface);font-family:var(--font);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
a:focus-visible{outline:3px solid #3246b8;outline-offset:7px}.hero a:focus-visible,.header a:focus-visible{outline-color:var(--yellow)}
::selection{color:#172017;background:var(--yellow)}
.section-wrap{max-width:1440px;padding-left:6.25%;padding-right:6.25%;margin:0 auto}
.icon-definitions{position:absolute;width:0;height:0;overflow:hidden}
.triangle-icon{display:inline-block;width:16px;height:16px;fill:currentColor;flex-shrink:0;vertical-align:middle}.triangle-down{transform:rotate(90deg)}.triangle-up{transform:rotate(-90deg)}
.header{position:absolute;z-index:5;left:0;top:0;width:100%;height:104px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;color:white;box-shadow:inset 0 -1px 0 #ffffff25}
.brand{display:flex;align-items:center;gap:22px}.brand-image{width:260px;height:auto;display:block}.brand-white{filter:invert(1)}
.brand-caption{font-size:8px;line-height:1.8;font-weight:500;letter-spacing:1.1px;border-left:1px solid #ffffff50;padding-left:19px;max-width:78px}
.header nav{display:flex;align-items:center;gap:31px;font-size:12px;font-weight:600}.header nav a{padding:10px 0}.header nav a:hover{color:var(--yellow)}
.header .nav-contact{border-radius:999px;padding:15px 20px;background:#ffffff0b;box-shadow:6px 6px 15px #060b2628,-3px -3px 10px #ffffff12,inset 1px 1px 0 #ffffff20}.nav-contact span{margin-left:15px}.nav-contact .triangle-icon{width:11px;height:11px}
.menu-toggle{display:none}
.hero{position:relative;min-height:760px;height:94svh;max-height:1050px;overflow:hidden;background:#161c4c;color:#fff}
.hero-image{position:absolute;inset:0;background:url('assets/hero-with-viewer.webp') center/cover}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0a0f33d1 0%,#0c143990 35%,#0c14390d 72%),linear-gradient(0deg,#0e142b40,transparent 40%)}
.hero-inner{position:relative;padding:210px 6.25% 160px;max-width:1440px;margin:0 auto}
.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;margin:0 0 25px;line-height:1.5}.eyebrow.light{font-weight:600;letter-spacing:2.4px;color:#e2e5f5}
.hero h1{font-size:clamp(45px,5.3vw,80px);font-weight:800;line-height:1.18;letter-spacing:.025em;margin:0 0 28px}

.hero-description{font-size:18px;line-height:1.9;color:#f1f1f7;letter-spacing:.025em;margin:0 0 30px}.mobile-break{display:none}
.hero-button{display:inline-flex;gap:35px;align-items:center;background:var(--yellow);border-radius:999px;color:#21282d;padding:13px 14px 13px 26px;font-size:12px;font-weight:700;box-shadow:9px 9px 22px #080e3060,-3px -3px 12px #ffffc027,inset 1px 1px 2px #ffffffb0;transition:transform .25s,box-shadow .25s}
.hero-button:hover{transform:translateY(-3px);box-shadow:12px 12px 25px #080e3070,-3px -3px 13px #ffffc030}
.round-arrow{display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:var(--yellow);color:#263024;box-shadow:inset 4px 4px 7px #c1d54f,inset -4px -4px 8px #f7ff9f}.round-arrow .triangle-icon{width:15px;height:15px}
.hero-bottom{position:absolute;bottom:29px;left:6.25%;right:6.25%;display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:600;letter-spacing:1.8px}.hero-bottom a{display:flex;gap:17px;align-items:center}.hero-bottom a span{display:flex}.hero-bottom .triangle-icon{width:11px;height:11px}
.image-credit{position:absolute;right:26px;top:50%;writing-mode:vertical-rl;letter-spacing:2px;font-size:8px;color:#f5f5f5}
.services{padding-top:100px;padding-bottom:96px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:46px;gap:30px}.section-heading .eyebrow{color:var(--blue);margin-bottom:16px}
h2{font-size:36px;line-height:1.6;font-weight:800;letter-spacing:.02em;margin:0}
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:31px}
.service-card{display:flex;flex-direction:column;min-width:0;border-radius:29px;background:var(--surface);padding:14px;box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s}.service-card:hover{transform:translateY(-5px);box-shadow:17px 17px 33px #cbd1d7,-12px -12px 27px #fff}
.service-art{position:relative;width:100%;aspect-ratio:3/2;overflow:visible;background:transparent}.service-art img{display:block;width:100%;height:100%;object-fit:contain}
.service-copy{padding:23px 12px 12px;flex:1;display:flex;flex-direction:column}
.service-number{font-size:12px;color:#58606c;display:flex;align-items:center;gap:10px;margin:0 0 13px;font-weight:700}.service-number span{font-size:11px;font-weight:500;padding-left:10px;border-left:1px solid #bfc8d2}
.service-copy h3{font-size:clamp(18px,1.7vw,23px);font-weight:800;line-height:1.7;letter-spacing:-.04em;margin:0 0 12px}.service-description{font-size:14px;line-height:2;letter-spacing:.02em;color:var(--muted);margin:0 0 23px}
.card-link{display:flex;justify-content:space-between;align-items:center;padding-top:16px;font-size:13px;font-weight:700;margin-top:auto;border-top:1px solid #d6dce2;box-shadow:0 -1px 0 #ffffff80}
.circle-link{display:grid;place-items:center;border-radius:50%;height:37px;width:37px;color:var(--blue);background:var(--surface);box-shadow:4px 4px 8px #c8d0d8,-4px -4px 8px #fff;transition:box-shadow .2s}.circle-link .triangle-icon{width:13px;height:13px}.service-card:hover .circle-link{box-shadow:inset 3px 3px 6px #c8d0d8,inset -3px -3px 6px #fff}
.about{padding:0 6.25%;max-width:1440px;margin:0 auto}
.about-inner{max-width:none;margin:0;padding:60px 65px;display:grid;grid-template-columns:235px minmax(0,1fr);gap:65px;align-items:center;border-radius:34px;background:var(--surface);box-shadow:var(--shadow)}
.portrait-wrap{position:relative;justify-self:center;width:210px}.portrait-frame{border-radius:50%;padding:11px;background:var(--surface);box-shadow:inset 6px 6px 12px #c4cdd5,inset -6px -6px 12px #fff}.portrait-frame img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%}
.portrait-label{display:block;margin-top:25px;font-size:10px;line-height:1.9;font-weight:700;letter-spacing:1.5px;text-align:center;color:#5e6773}
.about-copy .eyebrow{color:var(--blue);margin-bottom:15px;font-size:11px}.about-copy h2{font-size:31px;line-height:1.7;margin-bottom:25px}
.about-title-part{display:inline-block;white-space:nowrap}
.profile-name{display:flex;align-items:baseline;gap:23px}.profile-name h3{font-size:22px;margin:0;font-weight:700}.profile-name span{font-size:12px;letter-spacing:1.7px}.profile-role{font-size:12px!important;color:#646b77;margin:8px 0 23px!important}
.about-copy>p:not(.eyebrow){font-size:14px;line-height:2.2;letter-spacing:.025em;margin:0 0 16px}
.text-link{font-size:13px;font-weight:700;display:flex;align-items:center;gap:20px;padding:15px 20px;border-radius:15px;margin-top:25px;width:fit-content;max-width:100%;background:var(--surface);box-shadow:5px 5px 11px #ccd3da,-5px -5px 11px #fff}.text-link span{display:flex;color:var(--blue)}.text-link .triangle-icon{width:12px;height:12px}.text-link:hover{box-shadow:inset 3px 3px 7px #ccd3da,inset -3px -3px 7px #fff}
.contact{padding-top:90px;padding-bottom:85px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;text-align:center}.contact .eyebrow{color:var(--blue);margin-bottom:15px}.contact h2{font-size:clamp(9.6px,3vw,28px);white-space:nowrap}
.contact-button{display:flex;align-items:center;gap:38px;font-size:12px;font-weight:700;padding:16px 17px 16px 30px;background:var(--blue);color:white;border-radius:999px;white-space:nowrap;box-shadow:7px 7px 16px #c0c7d5,-7px -7px 16px #fff,inset 2px 2px 4px #6372f5,inset -2px -2px 4px #1a2395;transition:transform .25s}.contact-button .round-arrow{background:var(--blue);color:white;box-shadow:inset 3px 3px 6px #1f299f,inset -3px -3px 6px #5263f0}.contact-button:hover{transform:translateY(-3px)}
.footer{display:flex;align-items:center;gap:30px;border-top:1px solid #d1d9e0;box-shadow:inset 0 1px 0 #ffffff80;padding-top:35px;padding-bottom:35px}.footer-brand .brand-image{width:210px}.footer-message{font-size:16px;color:var(--ink);font-weight:600;letter-spacing:.02em}.footer small{margin-left:auto;font-size:10px;color:var(--muted);letter-spacing:1px}
.back-top{width:37px;height:37px;display:grid;place-items:center;border-radius:50%;box-shadow:4px 4px 9px #c8d0d8,-4px -4px 9px #fff;color:var(--blue)}.back-top .triangle-icon{width:13px;height:13px}
@media(min-width:1600px){.hero-inner{padding-top:230px}.hero{max-height:1000px}.hero h1{font-size:80px}}
@media(max-width:1100px){.brand-image{width:230px}.brand-caption{display:none}.header nav{gap:23px}.hero-inner{padding-top:190px}.hero{height:86svh;min-height:710px}.service-grid{gap:24px}.service-card{padding:11px;border-radius:25px}.service-copy{padding:21px 8px 10px}.service-copy h3{font-size:18px;min-height:3.4em}.service-number{gap:8px}.service-number span{font-size:10px;padding-left:8px}.about-inner{padding:48px 38px;gap:40px;grid-template-columns:205px minmax(0,1fr)}.portrait-wrap{width:190px}.about-copy h2{font-size:29px}.section-heading h2{font-size:31px}}
@media(max-width:760px){html{scroll-padding-top:30px}.section-wrap{padding-left:6%;padding-right:6%}.header{height:80px;padding:0 6%}.brand-image{width:182px}.header nav{gap:17px;font-size:10px}.header .nav-contact{display:none}.hero{height:88svh;min-height:670px;max-height:900px}.hero-image{background-position:50% center}.hero-shade{background:linear-gradient(90deg,#101846c9,#10184685 55%,#10184630),linear-gradient(0deg,#0f163f60,transparent)}.hero-inner{padding:180px 6% 130px}.hero .eyebrow{font-size:8px;letter-spacing:1.9px;margin-bottom:26px}.hero h1{font-size:clamp(33px,8.7vw,51px);line-height:1.22;letter-spacing:0;margin-bottom:28px}.hero-description{font-size:14px;line-height:1.95;letter-spacing:.01em;margin-bottom:28px}.mobile-break{display:inline}.hero-button{font-size:11px;gap:27px;padding:12px 13px 12px 23px;border-radius:999px}.hero-bottom{left:6%;right:6%;bottom:25px;font-size:7px;letter-spacing:1px}.hero-bottom>a{font-size:0}.hero-bottom a .triangle-icon{width:12px;height:12px}.image-credit{display:none}.services{padding-top:63px;padding-bottom:63px}.section-heading{display:block;margin-bottom:34px}.section-heading .eyebrow{font-size:9px;margin-bottom:12px}.section-heading h2{font-size:27px}.service-grid{grid-template-columns:1fr;gap:33px}.service-card{padding:13px;border-radius:26px;box-shadow:9px 9px 21px #cdd3d9,-9px -9px 21px #fff}.service-copy{padding:23px 13px 11px}.service-copy h3{font-size:clamp(19px,5.8vw,23px);min-height:0}.service-description{font-size:14px;margin-bottom:21px}.service-number{gap:10px}.service-number span{font-size:11px;padding-left:10px}.about{padding:0 6%}.about-inner{padding:35px 26px 38px;display:flex;flex-direction:column;gap:32px;align-items:stretch;border-radius:27px}.portrait-wrap{width:150px;align-self:center}.portrait-frame{padding:9px}.portrait-label{margin-top:15px;font-size:9px;line-height:1.8}.about-copy .eyebrow{font-size:10px;letter-spacing:1.3px}.about-copy h2{font-size:clamp(19px,6vw,28px);margin-bottom:24px}.about-copy>p:not(.eyebrow){font-size:14px}.profile-name{gap:17px}.profile-name h3{font-size:21px}.profile-name span{font-size:11px;letter-spacing:1px}.profile-role{font-size:11px!important}.text-link{font-size:12px;line-height:1.9;gap:13px;padding:12px 13px}.text-link span{flex-shrink:0}.contact{padding-top:62px;padding-bottom:59px;gap:24px}.contact .eyebrow{font-size:9px}.contact-button{width:fit-content;margin-top:0;gap:35px;font-size:11px;padding:13px 14px 13px 23px;border-radius:999px}.footer{flex-wrap:wrap;gap:22px 15px;padding-top:30px;padding-bottom:29px}.footer-brand .brand-image{width:175px}.footer-message{font-size:14px;order:3;flex-basis:100%}.footer small{order:4;margin:-8px 0 0;font-size:10px}.back-top{margin-left:auto}}
@media(max-width:360px){.header .brand-image{width:155px}.header nav{gap:12px;font-size:9px}.hero h1{font-size:30px}.about-inner{padding-left:22px;padding-right:22px}}
@media(max-width:760px){
  .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:0;border:1px solid #ffffff30;border-radius:50%;color:#fff;background:#ffffff12;box-shadow:4px 4px 10px #080d352b,inset 1px 1px 0 #ffffff25;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .menu-toggle:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}
  .menu-toggle span{display:block;width:19px;height:2px;border-radius:999px;background:currentColor;transition:transform .2s,opacity .2s}
  .menu-open .menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-open .menu-toggle span:nth-child(2){opacity:0}
  .menu-open .menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .header nav{position:absolute;top:72px;right:6%;width:min(280px,88vw);padding:15px;display:flex;flex-direction:column;align-items:stretch;gap:3px;font-size:15px;color:var(--ink);border-radius:23px;background:var(--surface);box-shadow:8px 12px 28px #080d3540,inset 1px 1px 2px #fff;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility .2s}
  .header.menu-open nav{visibility:visible;opacity:1;transform:translateY(0)}
  .header nav a{padding:15px 17px;border-radius:14px}
  .header nav a:hover{color:var(--blue);background:#e5e9ef}
  .header nav a:focus-visible{outline-color:var(--blue);outline-offset:0}
  .header .nav-contact{display:flex;align-items:center;justify-content:space-between;margin-top:8px;padding:15px 17px;color:#fff;background:var(--blue);box-shadow:4px 4px 9px #c8cfd8,-4px -4px 9px #fff,inset 1px 1px 2px #6879ff;border-radius:999px}
  .header .nav-contact:hover{color:#fff;background:#2735bd}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}