/* Shared tone: clean white, blue x coral grainy gradients, geometric shapes, serif italic accents */
:root{
  --bg:#f6f6f3;--panel:#ffffff;--ink:#1f2230;--text:#3d404a;--sub:#6c6f78;--muted:#9a9ca3;--hair:#e4e4df;
  --blue:#2f4fe0;--coral:#e0533a;--tint:#eef1fe;--blush:#fff0eb;
  --g-blue:linear-gradient(140deg,#2f4fe0 0%,#7b8cf2 45%,#f59ab4 100%);
  --g-coral:linear-gradient(140deg,#ff5a36 0%,#ff8f6b 45%,#ffc2cf 100%);
  --g-mint:linear-gradient(140deg,#5fcfae 0%,#b4e2c8 50%,#f7a9b6 100%);
  --g-sun:linear-gradient(140deg,#ffd75e 0%,#ffae5a 50%,#ff7a59 100%);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --jp:"Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  --en:"Avenir Next","Avenir","Nunito Sans","Yu Gothic",sans-serif;
  --serif:"Instrument Serif","Times New Roman",serif;
  --pad:clamp(20px,5vw,80px);--page:1200px;--r:28px;
  --ease:cubic-bezier(.22,.8,.24,1);--pop:cubic-bezier(.34,1.5,.5,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--jp);font-weight:500;font-size:16px;line-height:1.95;letter-spacing:.04em;-webkit-font-smoothing:antialiased}
a{color:inherit}button{font:inherit;color:inherit}
img{max-width:100%;display:block}
h1,h2,h3,p{margin-top:0}
::selection{background:var(--tint)}
:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:6px}
.wrap{max-width:var(--page);margin-inline:auto;padding-inline:var(--pad)}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:#fff;padding:10px 14px;z-index:99;border-radius:8px}
.skip:focus{top:12px}

/* label: small blue english over japanese */
.en{display:block;font-family:var(--en);font-size:12px;font-weight:500;letter-spacing:.04em;color:var(--blue);line-height:1.4}
.en.coral{color:var(--coral)}
.sec-title{margin:0 0 clamp(36px,5vw,64px)}
.sec-title h2{font-size:clamp(24px,2.3vw,30px);font-weight:500;color:var(--ink);margin:6px 0 0;letter-spacing:.06em}

/* header */
.head{position:sticky;top:0;z-index:40;background:rgba(246,246,243,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.head-in{display:flex;align-items:center;gap:28px;min-height:76px}
.brand{text-decoration:none;font-family:var(--en);font-weight:600;font-size:19px;letter-spacing:.01em;color:var(--ink);white-space:nowrap}
.brand small{display:block;font-size:10px;font-weight:500;color:var(--blue);letter-spacing:.06em;margin-top:2px}
.nav{display:flex;gap:30px;margin-left:auto}
.nav a{text-decoration:none;text-align:center;font-size:13.5px;color:var(--ink);line-height:1.5}
.nav a .en{font-size:10px;margin-bottom:2px}
.nav a:hover{color:var(--blue)}
.talk{display:inline-flex;align-items:center;gap:10px;text-decoration:none;background:var(--panel);border-radius:18px;padding:10px 18px;font-size:13px;font-weight:700;color:var(--ink);box-shadow:0 6px 24px rgba(47,48,45,.06);line-height:1.4}
.talk .en{font-size:10px}
.talk:hover{color:var(--blue)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:14px;min-height:50px;padding:12px 26px;border-radius:99px;text-decoration:none;font-size:14px;font-weight:700;border:1px solid transparent;cursor:pointer;transition:transform .3s var(--pop),background .25s,color .25s}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:var(--blue);color:#fff}
.btn.primary:hover{background:#1f38b8}
.btn.ghost{border-color:var(--blue);color:var(--blue);background:transparent}
.btn.ghost:hover{background:var(--tint)}
.btn .arr{font-family:var(--en);font-weight:500}

/* panels */
.panel{background:var(--panel);border-radius:var(--r)}

/* grain: film-like noise over gradients */
.grain{position:relative;isolation:isolate}
.grain:after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--grain);background-size:160px;mix-blend-mode:multiply;opacity:.22;pointer-events:none}
.it{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}

.caret{display:inline-block;width:1px;height:.9em;background:currentColor;margin-left:.18em;vertical-align:-.08em;animation:blink 1.1s steps(1) infinite;opacity:.7}
@keyframes blink{50%{opacity:0}}

.foot{padding-block:40px 48px;font-family:var(--en);font-size:12px;color:var(--muted)}
.foot .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

@media(max-width:900px){
  .nav{display:none}
  .talk{margin-left:auto}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* custom cursor (cursor.js) */
.has-cursor,.has-cursor *{cursor:none!important}
.has-cursor input,.has-cursor textarea{cursor:text!important}
.cur-dot,.cur-ring,.cur-tag{position:fixed;left:0;top:0;pointer-events:none;z-index:9999;opacity:0;transition:opacity .2s}
.cur-on .cur-dot,.cur-on .cur-ring{opacity:1}
.cur-dot{width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--g-coral);box-shadow:0 0 0 1.5px #fff,0 1px 4px rgba(31,34,48,.25)}
.cur-ring{width:36px;height:36px;margin:-18px 0 0 -18px}
.cur-ring:before{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(31,34,48,.35);transition:transform .3s var(--pop),background .25s,border-color .25s,opacity .2s}
.cur-ring.is-link:before{transform:scale(1.45);background:rgba(47,79,224,.08);border-color:rgba(47,79,224,.5)}
.cur-ring.is-media:before{transform:scale(.6);opacity:0}
.cur-ring.is-press:before{transform:scale(.8)}
.cur-tag{margin:14px 0 0 14px;white-space:nowrap;font-family:var(--serif);font-style:italic;font-size:15px;line-height:1;color:var(--ink);background:#fff;border-radius:99px;padding:6px 11px 7px;box-shadow:0 4px 14px rgba(31,34,48,.14)}
.cur-on .cur-tag.is-on{opacity:1}