:root{color-scheme:light;
 --washi:#FBF6EC;--ivory:#F5EBDD;--sakura:#EFD9CF;--blush:#E6C6BA;--shiro:#FFFDF8;
 --sumi:#2B2420;--cocoa:#5C4A40;--cocoa-ink:#4A3D35;--gold-ink:#755A22;--gold-line:#B08A3E;
 --cta:#7E5143;--cta-hover:#6B4336;--ease:cubic-bezier(.22,.61,.36,1);
 --serif:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho","Noto Serif CJK JP",serif;
 --sans:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic","Noto Sans CJK JP",sans-serif;
 --hh:60px;--fs-h1:clamp(1.55rem,1.05rem + 3.8vw,2.6rem)}
@media(min-width:64em){:root{--hh:76px;--fs-h1:clamp(2.2rem,1rem + 2.9vw,3.9rem)}}
@property --r{syntax:'<percentage>';inherits:false;initial-value:0%}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--washi);color:var(--sumi);font-family:var(--sans);line-height:1.8;letter-spacing:.04em;line-break:strict;word-break:auto-phrase}
a{color:inherit}
:focus-visible{outline:3px solid var(--cocoa-ink);outline-offset:3px;box-shadow:0 0 0 2px var(--shiro)}
.skip{min-height:44px;display:inline-flex;align-items:center;position:absolute;left:12px;top:-60px;z-index:100;background:var(--shiro);padding:0 16px;border-radius:999px}
.skip:focus{top:10px}
/* header */
.hdr{position:fixed;inset:0 0 auto 0;z-index:40;height:var(--hh);display:flex;align-items:center;gap:12px;padding:0 16px;transition:background-color .2s}
.hdr.is-scrolled{background:rgba(251,246,236,.92);backdrop-filter:blur(8px)}
.logo{display:block;flex:none;height:48px}
.logo img{display:block;height:100%;width:auto}
.nav{display:none}.hdr-sp{flex:1}
.ibj{flex:none;display:block;position:relative;width:102px;height:36px;border:1px solid rgba(176,138,62,.45);border-radius:6px;background:#fff}
.ibj img{display:block;width:100%;height:100%;object-fit:cover;border-radius:5px}
.ibj::after{content:"";position:absolute;inset:-7px -5px}
.hdr .cta-s{display:none}
.menu-btn{flex:none;width:48px;height:48px;border-radius:50%;border:1px solid rgba(117,90,34,.55);background:rgba(255,253,248,.8);display:grid;place-content:center;gap:6px;cursor:pointer;color:var(--cocoa-ink)}
.menu-btn i{display:block;width:20px;height:1.5px;background:currentColor;transition:transform .25s var(--ease)}
.menu-btn[aria-expanded=true] i:first-of-type{transform:translateY(3.75px) rotate(24deg)}
.menu-btn[aria-expanded=true] i:last-of-type{transform:translateY(-3.75px) rotate(-24deg)}
.menu{position:fixed;inset:0;z-index:30;background:var(--washi);padding:calc(var(--hh) + 28px) 24px 32px;overflow:auto;display:flex;flex-direction:column;gap:4px}
.menu[hidden]{display:none}
.menu{overscroll-behavior:contain}
html.menu-open,html.menu-open body{overflow:hidden}
.menu a.m{display:flex;align-items:center;min-height:56px;font:500 1.25rem var(--serif);letter-spacing:.1em;text-decoration:none;border-bottom:1px solid rgba(176,138,62,.3)}
.menu .cta{margin-top:24px;justify-content:center}
@media(min-width:64em){.logo{height:64px}.hdr{gap:20px;padding:0 64px}.ibj{width:125px;height:44px}.hdr .cta-s{display:inline-flex}.hdr-sp{display:none}.hdr .ibj{margin-left:auto}}
@media(min-width:68.75em){
 .nav{display:flex;flex:1;justify-content:center;gap:clamp(18px,2.2vw,34px)}
 .nav a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;color:var(--cocoa);text-decoration:none;letter-spacing:.08em;position:relative}
 .nav a::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1px;background:var(--gold-line);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
 .nav a:hover::after,.nav a:focus-visible::after{transform:scaleX(1)}
 .menu-btn{display:none}.hdr .ibj{margin-left:0}}
/* buttons */
.cta{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 24px;border-radius:999px;background:var(--cta);color:var(--shiro);font-weight:500;text-decoration:none;letter-spacing:.06em;transition:background-color .15s linear;white-space:nowrap}
.cta:hover{background:var(--cta-hover)}.cta svg{width:1em;height:1em;flex:none}
.cta-s{min-height:44px;font-size:14px;padding:0 22px}
.cta-main{justify-content:center;min-height:56px;font-size:17px;width:100%;white-space:normal;text-align:center;padding-block:10px}
@media(min-width:64em){.cta-main{width:auto;min-height:64px;padding:0 34px;font-size:18px}}
/* copy */
.eyebrow{font:500 12.5px/1.6 var(--serif);letter-spacing:.24em;color:var(--gold-ink)}
h1{font:500 var(--fs-h1)/1.5 var(--serif);letter-spacing:.02em}
.kn{display:inline-block;white-space:nowrap}
.ln{display:block;animation:rise .8s var(--ease) both}.ln1{animation-delay:.1s}.ln2{color:var(--cocoa-ink);animation-delay:.28s}
@keyframes rise{from{clip-path:inset(0 0 100% 0);translate:0 .28em}to{clip-path:inset(-12% -6% -12% -6%);translate:0 0}}
.en{font-size:1.2em;line-height:1;letter-spacing:0}
.an{display:inline-block;margin-left:.16em;translate:-.16em 0;animation:loosen .7s var(--ease) 1.9s forwards}
@keyframes loosen{to{translate:0 0}}
.sub{font-size:16px;line-height:1.8;color:var(--cocoa);letter-spacing:.06em}
.note{font-size:13px;line-height:1.7;color:var(--cocoa)}
.fn summary{position:relative;display:inline-flex;align-items:center;min-height:44px;font-size:13px;color:var(--cocoa-ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fn summary::after{content:"";position:absolute;inset:-3px -8px}
.fn p{font-size:13px;line-height:1.7;color:var(--cocoa)}
@media(min-width:64em){.sub{font-size:clamp(17px,.9rem + .55vw,22px)}.note,.fn summary,.fn p{font-size:14px}.eyebrow{font-size:16px;letter-spacing:.3em}}
/* mizuhiki = official logo artwork, revealed outward from the knot */
.miz{display:block;aspect-ratio:325/266;height:auto;pointer-events:none;
 -webkit-mask-image:radial-gradient(ellipse farthest-corner at 49% 72%,#000 var(--r),transparent calc(var(--r) + 14%));
 mask-image:radial-gradient(ellipse farthest-corner at 49% 72%,#000 var(--r),transparent calc(var(--r) + 14%));
 animation:unfurl 2.2s var(--ease) .35s both}
@keyframes unfurl{from{--r:-14%}to{--r:112%}}
/* fallback only when @property is unsupported (class set in <head>): same image, 2.2s, .35s delay, easing, origin 49%/72% */
.no-prop .miz{-webkit-mask-image:radial-gradient(ellipse closest-side at 49% 72%,#000 76%,transparent 100%);mask-image:radial-gradient(ellipse closest-side at 49% 72%,#000 76%,transparent 100%);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:49% 72%;mask-position:49% 72%;animation:unfurl-fb 2.2s var(--ease) .35s both}
@keyframes unfurl-fb{from{-webkit-mask-size:0 0;mask-size:0 0}to{-webkit-mask-size:340% 340%;mask-size:340% 340%}}
.ph{position:relative;overflow:hidden}
.ph img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph{animation:ph-in 1.1s var(--ease) both}
@keyframes ph-in{from{opacity:.0;scale:1.02}to{opacity:1;scale:1}}
.cap{z-index:3;position:absolute;right:10px;bottom:10px;font-size:13px;line-height:1.4;padding:2px 10px;border-radius:999px;background:rgba(255,253,248,.82);color:var(--cocoa-ink);letter-spacing:.05em}
.no-anim *{animation:none!important}
@media(prefers-reduced-motion:reduce){.ln,.an,.miz,.ph{animation:none!important}.an{translate:0 0}.miz,.no-prop .miz{-webkit-mask-image:none;mask-image:none}}
@media(forced-colors:active){.miz{forced-color-adjust:none}}
.dev{position:fixed;left:12px;bottom:12px;z-index:60;font-size:13px;border:1px solid var(--cocoa);background:var(--shiro);color:var(--cocoa-ink);border-radius:999px;min-height:36px;padding:0 14px;cursor:pointer}