:root{--shell-blue:#7186ff;--shell-violet:#a78bfa;--shell-panel:rgba(255,255,255,.72);--shell-line:rgba(13,13,13,.1);--shell-shadow:0 24px 80px rgba(48,58,120,.12)}
html{scroll-padding-top:104px}
body{overflow-x:hidden;background:#f7f8fc;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;background:radial-gradient(78% 58% at 6% 3%,rgba(63,88,255,.72),transparent 70%),radial-gradient(68% 52% at 94% 5%,rgba(132,105,255,.68),transparent 70%),radial-gradient(48% 38% at 52% 18%,rgba(255,255,255,.9),transparent 74%),linear-gradient(180deg,#c8d4ff 0,#edf1ff 35rem,#f7f8fc 58rem,#fff 76rem)}
body::after{content:"";position:absolute;inset:0 0 auto;height:760px;z-index:-2;pointer-events:none;opacity:.28;background-image:linear-gradient(rgba(255,255,255,.4) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.4) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,#000,transparent 88%)}
.glow-top{display:none}
.header{top:12px;margin:0 16px;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.header-in{max-width:1180px;height:58px;padding:7px 10px 7px 18px;border:1px solid rgba(255,255,255,.7);border-radius:18px;background:rgba(255,255,255,.68);box-shadow:0 12px 36px rgba(46,55,100,.1);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}
.brand{letter-spacing:-.02em;white-space:nowrap}.nav{gap:4px}
.nav a:not(.nav-contact){padding:10px 15px;border-radius:12px;color:rgba(13,13,13,.62)}
.nav a:not(.nav-contact):hover{background:rgba(255,255,255,.62);color:var(--black)}
.nav a[aria-current="page"]:not(.nav-contact){background:#fff;color:var(--black);box-shadow:0 3px 12px rgba(20,25,55,.08)}
.nav a.nav-contact{height:42px;padding:0 19px;border-radius:13px}
.hero{padding:118px 0 0}.hero .container{max-width:1180px}
.hero h1{max-width:980px;margin-inline:auto;font-size:clamp(1.95rem,3vw,3rem);line-height:1.15;letter-spacing:-.035em;text-wrap:balance}
.hero .lead{max-width:720px;margin-top:30px;font-size:clamp(1.0625rem,1.5vw,1.25rem);line-height:1.65}
.hero-cta{margin-top:34px;gap:10px}.btn{height:48px;padding:0 24px;border-radius:14px;font-size:.9375rem}
.btn-primary{box-shadow:0 10px 28px rgba(13,13,13,.18)}
.btn-ghost{background:rgba(255,255,255,.58);border:1px solid rgba(255,255,255,.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#office{width:min(980px,calc(100vw - 40px));margin-top:68px;border-radius:28px;border:10px solid rgba(17,17,20,.94);box-shadow:0 34px 90px rgba(35,43,100,.24),0 0 0 1px rgba(255,255,255,.35)}
.office-note{margin-top:24px}.sec{margin-top:0;padding:128px 0}
#cursor-field{position:fixed;inset:0;z-index:1;width:100%;height:100%;pointer-events:none;opacity:1;mix-blend-mode:normal}
.sec:nth-of-type(even){background:rgba(255,255,255,.58);border-block:1px solid rgba(255,255,255,.72)}
.sec-head{text-align:left;max-width:1128px}.sec-head h2{max-width:880px;font-size:clamp(1.8rem,3vw,2.75rem);line-height:1.15;letter-spacing:-.035em}.sec-head .nw{display:inline;white-space:normal}
.sec-head .lead{max-width:680px;margin-top:28px}.sec-body{margin-top:52px}
.card{position:relative;border:1px solid rgba(255,255,255,.84);border-radius:22px;padding:34px;background:var(--shell-panel);box-shadow:0 12px 40px rgba(55,63,105,.07);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);transition:transform .28s ease,box-shadow .28s ease,background-color .28s ease,border-color .28s ease}
.card:hover{transform:translateY(-6px);background:rgba(255,255,255,.92);border-color:#fff;box-shadow:var(--shell-shadow)}
.reason,.flow-item{padding-top:24px;border-top:1px solid var(--shell-line)}
.contact{margin-top:0;padding:140px 0;background:linear-gradient(135deg,rgba(105,126,255,.92),rgba(157,132,246,.76) 50%,rgba(236,240,255,.9));overflow:hidden}
.contact::before{inset:-30% auto auto 60%;width:520px;height:520px;border-radius:50%;background:rgba(255,255,255,.42);filter:blur(72px)}
.contact h2{font-size:clamp(1.8rem,3vw,3rem);line-height:1.15;letter-spacing:-.035em}.contact-sub{color:rgba(13,13,13,.68)}
.footer{background:#0f1014;color:#fff;padding:42px 0}.footer-nav a{color:rgba(255,255,255,.64)}.footer-nav a:hover{color:#fff}
.price-num{letter-spacing:-.045em}
.work-card{padding:9px}.work-img{border-radius:16px}.work-img img{transition:transform .5s ease}.work-card:hover .work-img img{transform:scale(1.025)}
.case-main{background:linear-gradient(145deg,rgba(225,231,255,.92),rgba(255,255,255,.82))}
.reveal-ready .sec-head,.reveal-ready .card,.reveal-ready .reason,.reveal-ready .flow-item{opacity:0;transform:translateY(22px);transition:opacity .58s ease,transform .58s ease}.reveal-ready .is-visible{opacity:1;transform:none}
@media (max-width:767px){body{word-break:normal}.header{top:8px;margin:0 8px}.header-in{height:52px;padding:5px 7px 5px 14px;border-radius:15px}.nav a.nav-contact{height:40px;padding:0 14px}.menu-btn{height:40px;border-radius:11px}.mnav:not([hidden]){margin:8px 8px 0;border:1px solid rgba(255,255,255,.8);border-radius:15px;background:rgba(255,255,255,.9);overflow:hidden;box-shadow:0 16px 36px rgba(30,35,70,.12)}.mnav a{border-color:rgba(13,13,13,.08)}.hero{padding-top:102px}.hero h1{font-size:clamp(1.8rem,7vw,2.2rem)}.hero .lead{margin-top:24px}.hero-cta{align-items:stretch}.hero-cta .btn{width:100%}#office{margin-top:48px;border-width:6px;border-radius:20px}.sec{padding:84px 0}.sec-head h2{font-size:clamp(1.7rem,7vw,2.15rem)}.sec-body{margin-top:38px}.card{padding:25px;border-radius:18px}.contact{padding:96px 0}.contact h2{font-size:clamp(1.7rem,7vw,2.15rem)}.footer{padding:32px 0}}
@media (max-width:479px){.nav a.nav-contact{display:none}}
@media (hover:none),(pointer:coarse){#cursor-field{display:none}}
@media (prefers-reduced-motion:reduce){#cursor-field{display:none}.reveal-ready .sec-head,.reveal-ready .card,.reveal-ready .reason,.reveal-ready .flow-item{opacity:1;transform:none}}

/* Service destinations; compact Japanese type and blue-only atmosphere. */
body::before{background:radial-gradient(76% 54% at 12% 0,rgba(78,125,242,.38),transparent 75%),radial-gradient(58% 42% at 94% 6%,rgba(115,173,246,.3),transparent 75%),linear-gradient(180deg,#e4edff 0,#f4f7fd 38rem,#fff 70rem)}
.hero h1{font-size:clamp(1.65rem,2.65vw,2.5rem);line-height:1.55;text-wrap:pretty;letter-spacing:-.02em}
.hero .lead,.office-note.lead{font-size:1.0625rem;line-height:1.9;max-width:850px;text-wrap:pretty;word-break:normal}
.sec-head h2,.contact h2{font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.55;text-wrap:pretty}
.sec-head .lead{margin-top:20px;line-height:1.9;word-break:normal}
.sec{padding:85px 0}.sec-body{margin-top:35px}
.contact{background:linear-gradient(130deg,#bdd3fb,#e7f0ff);padding:95px 0}
.nav a:not(.nav-contact){padding-inline:12px}.footer-nav{flex-wrap:wrap;gap:20px}
.work-card{border:1px solid #dce3ed;box-shadow:none;background:#fff;padding:8px;overflow:hidden}
.work-img{aspect-ratio:16/10;height:auto;background:#e8ecf3}
.work-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.work-body{padding:22px}.work-body .desc{line-height:1.8}.work-meta{color:#405675}
#featured .works-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
a.card:hover,.card:hover{border-color:#b6c7df;box-shadow:0 15px 35px #203a6010}
@media(min-width:768px) and (max-width:980px){.brand{font-size:.875rem}.header-in{gap:12px}.nav a:not(.nav-contact){padding-inline:8px}.nav a.nav-contact{padding-inline:12px}}
@media(max-width:767px){.hero h1{font-size:1.7rem}.hero .lead{font-size:1rem}.sec-head h2,.contact h2{font-size:1.5rem}.sec{padding:58px 0}.footer-nav{gap:16px}#featured .works-grid{grid-template-columns:1fr}.work-card{padding:8px}.work-body{padding:20px}.hero{padding-top:80px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card,.work-img img{transition:none}.card:hover{transform:none}}
.section-note{margin-top:28px;max-width:850px;line-height:1.8;color:#526278}
@media(min-width:768px) and (max-width:1100px){.nav a:not(.nav-contact){display:none}.menu-btn{display:inline-flex}.nav .nav-contact{display:inline-flex}.mnav:not([hidden]){display:block;background:#fff;border:1px solid #dce3ed;border-radius:16px;margin-top:8px}.mnav a{display:block;padding:14px 20px;border-bottom:1px solid #e6ebf2;color:inherit;text-decoration:none}}

/* One continuous background across the full page. */
body{position:relative;background:#edf3fc}
body::before{position:absolute;inset:0;background:radial-gradient(100% 900px at 0 0,rgba(97,151,240,.25),transparent 80%),radial-gradient(90% 1100px at 100% 48%,rgba(159,190,243,.18),transparent 80%),linear-gradient(180deg,#e1ebfc 0,#f8faff 1000px,#fff 32%,#f6f9ff 65%,#edf4ff 88%,#d9e7fb 100%)}
.sec,.sec:nth-of-type(even),.contact{background:transparent;border:0}
.contact::before{display:none}
.footer{background:transparent;color:#26354d}
.footer-nav a{color:#405675}.footer-nav a:hover{color:#10213c}
.work-preview{aspect-ratio:16/10;border-radius:16px;background:radial-gradient(ellipse at 0 0,#c1d8fd,transparent 80%),linear-gradient(130deg,#eaf1fc,#f8faff);display:flex;flex-direction:column;justify-content:center;gap:18px;padding:24px;color:#243e65}
.work-preview span{font-size:.75rem;letter-spacing:.06em}.work-preview b{font-size:clamp(.9rem,1.3vw,1.2rem);line-height:1.6}.work-preview small{font-size:.75rem;color:#536985}