:root{
  --kinari:#F7F4EA;
  --washi:#FCFAF3;
  --sage:#A8BCA4;
  --sage-pale:#E3EAE0;
  --sage-deep:#5F7A64;
  --sumi:#2B2B26;
  --sumi-soft:#55554D;
  --kincha:#BE9240;
  --shu:#D96C4A;
  --shu-deep:#B0492A;
  --sakura:#EFC5CB;
  --kids-bg:#FBF1E2;
  --mincho:'Shippori Mincho','Hiragino Mincho ProN',serif;
  --maru:'Zen Maru Gothic','Hiragino Maru Gothic ProN',sans-serif;
  --en:'Cormorant Garamond',serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--kinari);color:var(--sumi);font-family:var(--mincho);line-height:2;letter-spacing:.08em;overflow-x:hidden;text-wrap:pretty;}
::selection{background:var(--sage-pale);}
img{max-width:100%;}

.sp-only{display:none;}
@media(max-width:860px){.sp-only{display:inline;}}
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1.1s cubic-bezier(.22,.61,.36,1),transform 1.1s cubic-bezier(.22,.61,.36,1);}
.reveal.on{opacity:1;transform:none;}
.tate{writing-mode:vertical-rl;text-orientation:mixed;}

header.site{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:22px 44px;mix-blend-mode:multiply;transition:background .5s;}
header.site.scrolled{mix-blend-mode:normal;background:linear-gradient(to bottom,rgba(252,250,243,.97) 55%,rgba(252,250,243,.8) 80%,rgba(252,250,243,0));}
.logo{font-family:var(--mincho);font-size:17px;letter-spacing:.24em;font-weight:500;text-decoration:none;color:var(--sumi);}
.logo small{display:block;font-family:var(--en);font-size:10px;letter-spacing:.42em;color:var(--sumi-soft);margin-top:2px;}
nav.site{display:flex;gap:28px;align-items:center;font-size:13px;}
nav.site a{color:var(--sumi);text-decoration:none;position:relative;padding-bottom:4px;}
nav.site a::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:1px;background:var(--kincha);transition:.4s;transform:translateX(-50%);}
nav.site a:hover::after,nav.site a.here::after{width:100%;}
nav.site a.kids{color:var(--shu-deep);}
.cta-mini{border:1px solid var(--sumi);border-radius:999px;padding:9px 22px !important;transition:.4s;}
.cta-mini:hover{background:var(--sumi);color:var(--kinari) !important;}
.cta-mini::after{display:none !important;}

section{padding:130px 8vw;position:relative;}
.sec-label{display:flex;align-items:baseline;gap:18px;margin-bottom:64px;}
.sec-label .en{font-family:var(--en);font-size:12px;letter-spacing:.45em;color:var(--kincha);}
.sec-label h1,.sec-label h2{font-size:clamp(24px,3vw,34px);font-weight:500;letter-spacing:.22em;}
.sec-label::after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--sage),transparent);}

.btn{display:inline-block;font-size:13.5px;letter-spacing:.28em;color:var(--sumi);text-decoration:none;border:1px solid var(--sumi);border-radius:999px;padding:15px 52px;transition:.45s;background:transparent;font-family:var(--mincho);cursor:pointer;}
.btn:hover{background:var(--sumi);color:var(--kinari);}
.btn.fill{background:var(--sumi);color:var(--kinari);}
.btn.fill:hover{background:var(--kincha);border-color:var(--kincha);}

.page-hero{padding:190px 8vw 90px;}
.page-hero .en{font-family:var(--en);font-size:12px;letter-spacing:.5em;color:var(--kincha);}
.page-hero h1{font-size:clamp(30px,4.4vw,48px);font-weight:500;letter-spacing:.26em;margin:16px 0 22px;line-height:1.9;}
.page-hero p.lead{font-size:15px;color:var(--sumi-soft);max-width:60ch;}

footer.site{background:var(--sumi);color:var(--kinari);padding:70px 8vw 50px;font-size:12.5px;letter-spacing:.12em;}
.foot-grid{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:30px;}
.foot-logo{font-size:16px;letter-spacing:.24em;font-family:var(--mincho);}
.foot-logo small{display:block;font-family:var(--en);font-size:10px;letter-spacing:.4em;opacity:.6;margin-top:6px;}
.foot-links{display:flex;gap:24px;align-items:center;}
.foot-links a{color:var(--kinari);text-decoration:none;opacity:.75;transition:.3s;}
.foot-links a:hover{opacity:1;}
.sakura{cursor:pointer;font-size:15px;opacity:.35;transition:.4s;user-select:none;display:inline-block;}
.sakura:hover{opacity:1;transform:rotate(20deg) scale(1.2);}
.copyright{margin-top:44px;opacity:.5;font-family:var(--en);letter-spacing:.3em;font-size:10.5px;text-align:center;}

.petal{position:fixed;z-index:99;pointer-events:none;font-size:18px;animation:fall 3.6s ease-in forwards;}
@keyframes fall{0%{transform:translateY(0) rotate(0);opacity:1;}100%{transform:translateY(90vh) rotate(340deg);opacity:0;}}
.click-ripple{position:fixed;z-index:98;border:1px solid var(--sage-deep);border-radius:50%;pointer-events:none;animation:rip 1s ease-out forwards;}
@keyframes rip{0%{opacity:.7;transform:scale(.2);}100%{opacity:0;transform:scale(1);}}

.kids-theme{font-family:var(--maru);letter-spacing:.06em;}
.kids-theme .sec-label .en{color:var(--shu);}
.kids-theme .sec-label h1,.kids-theme .sec-label h2{color:var(--shu-deep);font-family:var(--maru);font-weight:700;}
.kids-theme .sec-label::after{background:linear-gradient(to right,var(--shu),transparent);opacity:.5;}
.kid-panel{background:#FFFDF8;border-radius:32px;padding:46px 5vw;margin-bottom:60px;border:2px solid #F2DFC8;position:relative;overflow:hidden;}
.kid-panel h2{font-family:var(--maru);font-weight:700;color:var(--shu-deep);font-size:22px;letter-spacing:.08em;margin-bottom:6px;}
.kid-panel .how{font-size:13px;color:#8A6A52;margin-bottom:26px;}
.kid-btn{font-family:var(--maru);font-weight:700;font-size:14px;color:#fff;background:var(--shu);border:none;border-radius:999px;padding:12px 30px;cursor:pointer;transition:.3s;letter-spacing:.08em;}
.kid-btn:hover{background:var(--shu-deep);transform:translateY(-2px);}
.kid-btn.ghost{background:#fff;color:var(--shu-deep);border:2px solid var(--shu);}
.kid-btn:disabled{opacity:.4;cursor:default;transform:none;}

@keyframes floaty{0%,100%{transform:translateY(0);}50%{transform:translateY(-22px);}}
@keyframes pluckv{0%{transform:translateX(0);}20%{transform:translateX(4px);}45%{transform:translateX(-3px);}70%{transform:translateX(2px);}100%{transform:translateX(0);}}

.mnav-btn{display:none;background:none;border:none;cursor:pointer;width:44px;height:44px;position:relative;z-index:210;color:var(--sumi);}
.mnav-btn span{display:block;width:24px;height:1.5px;background:currentColor;margin:6px auto;transition:.4s;}
.mnav-btn:hover span{background:var(--kincha);}
.mnav-btn.x span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.mnav-btn.x span:nth-child(2){opacity:0;}
.mnav-btn.x span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}
.mnav-ov{position:fixed;inset:0;background:rgba(247,244,234,.97);z-index:200;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .45s;}
body.mnav-open .mnav-ov{opacity:1;pointer-events:auto;}
body.mnav-open{overflow:hidden;}
.mnav-links{display:flex;flex-direction:column;gap:26px;text-align:center;font-size:16px;letter-spacing:.2em;}
.mnav-links a{color:var(--sumi);text-decoration:none;opacity:0;transform:translateY(14px);transition:.5s;}
body.mnav-open .mnav-links a{opacity:1;transform:none;}
body.mnav-open .mnav-links a:nth-child(2){transition-delay:.06s;}
body.mnav-open .mnav-links a:nth-child(3){transition-delay:.12s;}
body.mnav-open .mnav-links a:nth-child(4){transition-delay:.18s;}
body.mnav-open .mnav-links a:nth-child(5){transition-delay:.24s;}
body.mnav-open .mnav-links a:nth-child(6){transition-delay:.3s;}
body.mnav-open .mnav-links a:nth-child(7){transition-delay:.36s;}
.mnav-links a.kids{color:var(--shu-deep);}
.mnav-links a.cta-mini{border:1px solid var(--sumi);border-radius:999px;padding:12px 34px;}

@media(max-width:1100px){
  nav.site{display:none;}
  header.site{mix-blend-mode:normal;}
  .mnav-btn{display:block;}
  .foot-grid{flex-direction:column;align-items:flex-start;}
  .foot-links{flex-wrap:wrap;row-gap:10px;}
}
@media(max-width:860px){
  header.site{padding:16px 22px;}
  section{padding:80px 6vw;}
  .page-hero{padding:130px 6vw 50px;}
  .sec-label{margin-bottom:44px;flex-wrap:wrap;}
  footer.site{padding:50px 6vw 40px;}
  .btn{padding:14px 38px;}
}
