:root{
  --paper:#f8f8f8;
  --ink:#1c1c1a;
  --green:#2a4326;
  --muted:#b3b2ad;
  --noise:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.045'/></svg>");
}
*{margin:0;padding:0;box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; }
body{ background:var(--noise) 0 0/220px 220px, #f8f8f8; color:var(--ink); font-family:"Zen Old Mincho",serif; line-height:1.6; overflow-x:hidden; }
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
.serif{ font-family:"Cormorant Garamond",serif; }
.wrap{ position:relative; width:100%; overflow:hidden; }

/* ===== reveal utilities ===== */
.rv-img{ clip-path:inset(100% 0 0 0); opacity:0; transition:clip-path 1.7s cubic-bezier(.19,1,.22,1), opacity 1.7s cubic-bezier(.19,1,.22,1); }
.rv-img.is-in{ clip-path:inset(0 0 0 0); opacity:1; }
.rl{ display:block; overflow:hidden; }
.rl > span{ display:block; transform:translateY(115%); transition:transform 1.5s cubic-bezier(.19,1,.22,1); }
.rl.is-in > span,.is-in .rl > span{ transform:translateY(0); }
.rv-fade{ opacity:0; transform:translateY(24px); transition:opacity 1.5s ease, transform 1.5s cubic-bezier(.19,1,.22,1); }
.rv-fade.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .rv-img,.rl>span,.rv-fade{ transition:none; opacity:1; transform:none; clip-path:none; } }

/* ============ HEADER (common) ============ */
.hdr{ position:fixed; top:0; left:0; width:100%; z-index:60; display:flex; align-items:flex-start; justify-content:space-between; padding:22px 20px; }
.hdr-logo{ display:block; overflow:hidden; }
.hdr-logo img{ width:118px; height:auto; mix-blend-mode:multiply; animation:logoReveal 1.2s cubic-bezier(.16,.84,.36,1) .25s both; transition:filter .45s ease; }
@keyframes logoReveal{ from{ clip-path:inset(105% 0 0 0); } to{ clip-path:inset(0 0 0 0); } }
.hdr-nav{ display:none; }
.hdr-contact{ display:none; }
.burger{ width:42px; height:30px; display:flex; flex-direction:column; justify-content:center; gap:8px; cursor:pointer; background:none; border:none; }
.burger span{ display:block; height:1.5px; width:38px; background:var(--ink); transition:.35s; }
.hdr-nav,.hdr-contact{ transition:color .45s ease; }
.hdr-nav::before{ transition:background .45s ease; }
.hdr.on-dark .hdr-nav,.hdr.on-dark .hdr-contact{ color:#fff; }
.hdr.on-dark .hdr-nav::before{ background:#fff; }
.hdr.on-dark .burger span{ background:#fff; }
.hdr.on-dark .hdr-logo img{ mix-blend-mode:normal; filter:brightness(0) invert(1); }
.burger.open span:nth-child(1){ transform:translateY(9.5px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-9.5px) rotate(-45deg); }
.hdr-contact.is-active{ font-style:italic; }

.menu{ position:fixed; inset:0; background:var(--paper); z-index:55; display:flex; flex-direction:column; justify-content:center; padding:0 36px; gap:6px; transform:translateY(-100%); opacity:0; pointer-events:none; transition:.5s cubic-bezier(.7,0,.2,1); }
.menu.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
.menu a{ font-family:"Cormorant Garamond",serif; font-size:34px; letter-spacing:.08em; padding:12px 0; border-bottom:1px solid rgba(0,0,0,.12); display:flex; align-items:baseline; gap:14px; }
.menu a .jp{ font-family:"Zen Old Mincho",serif; font-size:13px; color:#7a7a74; letter-spacing:.1em; }

@media (min-width:1025px){
  .hdr{ padding:30px 40px; }
  .hdr-logo img{ width:150px; }
  .hdr-nav{ display:flex; gap:46px; margin-left:auto; margin-right:60px; padding-top:14px; position:relative; }
  .hdr-nav::before{ content:""; position:absolute; left:-34px; top:21px; width:24px; height:1px; background:var(--ink); }
  .hdr-nav .col{ display:flex; flex-direction:column; gap:14px; font-family:"Cormorant Garamond",serif; font-size:15px; letter-spacing:.14em; }
  .hdr-nav a{ position:relative; }
  .hdr-nav a::after{ content:""; position:absolute; left:0; bottom:-3px; width:100%; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .4s cubic-bezier(.7,0,.2,1); }
  .hdr-nav a:hover::after{ transform:scaleX(1); transform-origin:left; }
  .hdr-contact{ display:block; font-family:"Cormorant Garamond",serif; font-style:italic; font-size:30px; letter-spacing:.06em; padding-top:8px; }
  .burger{ display:none; }
  .menu{ display:none; }
}

/* ============ side vertical texts ============ */
.v-left{ position:fixed; left:16px; top:44%; transform:translateY(-50%); writing-mode:vertical-rl; font-family:"Cormorant Garamond",serif; font-style:italic; letter-spacing:.28em; font-size:13px; color:var(--ink); z-index:40; }
.v-left::after{ content:""; position:absolute; left:50%; bottom:-150px; width:1px; height:120px; background:var(--ink); }
.v-right{ display:none; }
.v-right .vr-bracket{ display:block; width:24px; height:24px; font-family:"Zen Old Mincho",serif; font-size:15px; line-height:24px; text-align:center; color:#3a3a36; transform:rotate(90deg); }
.v-right .vr-window{ position:relative; width:28px; height:360px; overflow:hidden; }
.v-right .vr-track{ position:relative; display:block; width:100%; height:100%; }
.v-right .vr-track > span{ position:absolute; top:0; left:50%; display:block; writing-mode:vertical-rl; white-space:nowrap; line-height:1.9; animation:vrScroll 24s linear infinite -8s; }
.v-right .vr-track > span[aria-hidden="true"]{ display:none; }
@keyframes vrScroll{ from{ transform:translate(-50%,380px); } to{ transform:translate(-50%,-110%); } }
@media (prefers-reduced-motion:reduce){ .v-right .vr-track > span{ animation:none; transform:translateX(-50%); } }

@media (min-width:1025px){
  .v-right{ display:flex; flex-direction:column; align-items:center; gap:8px; position:fixed; right:20px; top:42%; width:32px; transform:translateY(-50%); writing-mode:horizontal-tb; font-family:"Zen Old Mincho",serif; font-size:13px; letter-spacing:.14em; line-height:2.1; color:#3a3a36; z-index:40; }
}

/* ============ FV ============ */
.fv{ position:relative; padding:140px 22px 50px; }
.fv-quote{ font-family:"Cormorant Garamond",serif; font-size:150px; line-height:.5; color:rgba(0,0,0,.08); display:block; height:70px; }
.fv-head{ margin:20px 0 8px; }
.fv-head .en{ display:block; font-family:"Cormorant Garamond",serif; font-weight:500; font-size:16vw; line-height:.92; letter-spacing:.01em; }
.fv-head .jp{ display:block; font-family:"Zen Old Mincho",serif; font-size:15px; letter-spacing:.18em; color:#3a3a36; margin-top:18px; }
.fv-lead{ font-family:"Zen Old Mincho",serif; font-size:15px; line-height:2.0; margin-top:24px; }
.fv-lead .en{ display:block; font-family:"Jost",sans-serif; font-weight:300; font-size:12.5px; color:var(--muted); line-height:1.9; margin-top:16px; letter-spacing:.02em; }
.fv-photo{ margin-top:36px; overflow:hidden; }
.fv-photo img{ width:100%; aspect-ratio:16/9; object-fit:cover; }

@media (min-width:1025px){
  .fv{ padding:200px 7% 80px; display:grid; grid-template-columns:42% 58%; column-gap:5%; align-items:end; }
  .fv-quote{ font-size:220px; height:110px; }
  .fv-head{ margin:24px 0 0; }
  .fv-head .en{ font-size:118px; }
  .fv-head .jp{ font-size:16px; margin-top:24px; }
  .fv-lead{ font-size:16px; max-width:30em; }
  .fv-photo{ grid-column:2; grid-row:1 / span 3; margin-top:0; align-self:stretch; display:flex; }
  .fv-photo img{ aspect-ratio:auto; height:100%; min-height:560px; }
}

/* ============ FORM ============ */
.formsec{ position:relative; padding:40px 22px 110px; }
.form-inner{ max-width:880px; margin:0 auto; }
.form-rule{ height:1px; background:rgba(0,0,0,.16); margin-bottom:54px; }
.fld{ margin-bottom:42px; }
.fld-label{ display:flex; align-items:baseline; gap:12px; margin-bottom:14px; }
.fld-label .ja{ font-family:"Zen Old Mincho",serif; font-size:16px; letter-spacing:.04em; }
.fld-label .en{ font-family:"Cormorant Garamond",serif; font-style:italic; font-size:14px; color:#9a9a92; }
.fld-label .req{ font-family:"Jost",sans-serif; font-size:10px; letter-spacing:.12em; color:#fff; background:var(--green); padding:3px 8px; border-radius:2px; align-self:center; }
.fld-label .opt{ font-family:"Jost",sans-serif; font-size:10px; letter-spacing:.12em; color:#9a9a92; border:1px solid #cfcfc8; padding:2px 8px; border-radius:2px; align-self:center; }
.fld input,.fld textarea{ width:100%; border:none; border-bottom:1px solid rgba(0,0,0,.28); background:transparent; font-family:"Zen Old Mincho",serif; font-size:16px; color:var(--ink); padding:10px 2px; transition:border-color .35s ease; }
.fld input::placeholder,.fld textarea::placeholder{ color:#c1c1ba; }
.fld input:focus,.fld textarea:focus{ outline:none; border-bottom-color:var(--green); }
.fld textarea{ resize:vertical; min-height:140px; line-height:1.9; }
.form-row{ display:block; }
.form-foot{ margin-top:56px; text-align:center; }
.privacy{ font-family:"Zen Old Mincho",serif; font-size:12.5px; color:#7a7a74; line-height:1.9; margin-bottom:30px; }
.privacy a{ text-decoration:underline; text-underline-offset:3px; }
.submit{ position:relative; display:inline-flex; align-items:center; justify-content:center; gap:16px; min-width:300px; padding:20px 40px; border:1px solid var(--ink); background:transparent; cursor:pointer; font-family:"Cormorant Garamond",serif; font-size:18px; letter-spacing:.14em; color:var(--ink); overflow:hidden; transition:color .45s ease; }
.submit .lbl,.submit .arr{ position:relative; z-index:1; }
.submit .ja{ font-family:"Zen Old Mincho",serif; font-size:15px; letter-spacing:.1em; margin-left:4px; }
.submit::before{ content:""; position:absolute; inset:0; background:var(--ink); transform:scaleX(0); transform-origin:right; transition:transform .5s cubic-bezier(.7,0,.2,1); z-index:0; }
.submit:hover{ color:#fff; }
.submit:hover::before{ transform:scaleX(1); transform-origin:left; }

@media (min-width:769px){
  .form-row{ display:grid; grid-template-columns:1fr 1fr; column-gap:48px; }
  .form-row .fld{ margin-bottom:42px; }
}
@media (min-width:1025px){
  .formsec{ padding:20px 7% 140px; }
}

/* ============ THANK YOU ============ */
.thanks{ display:none; text-align:center; padding:30px 0 10px; }
.thanks.show{ display:block; animation:thankIn 1.1s cubic-bezier(.19,1,.22,1) both; }
@keyframes thankIn{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:none; } }
.thanks .q{ font-family:"Cormorant Garamond",serif; font-size:120px; line-height:.5; color:rgba(0,0,0,.1); display:block; height:56px; }
.thanks h3{ font-family:"Cormorant Garamond",serif; font-weight:500; font-size:46px; letter-spacing:.04em; margin:18px 0 22px; }
.thanks p{ font-family:"Zen Old Mincho",serif; font-size:15px; line-height:2.0; color:#3a3a36; }
.thanks a.home{ display:inline-block; margin-top:34px; border:1px solid var(--ink); padding:16px 44px; font-family:"Cormorant Garamond",serif; font-size:16px; letter-spacing:.12em; transition:.35s; }
.thanks a.home:hover{ background:var(--ink); color:#fff; }

/* ============ FOOTER (common) ============ */
.foot-band{ position:relative; overflow:visible; }
.foot-imgs{ display:flex; flex-direction:column; }
.foot-imgs img{ width:100%; height:300px; object-fit:cover; }
.foot-imgs img.f3{ display:none; }
.foot-overlay{ position:absolute; top:54%; left:22px; transform:translateY(-50%); color:#f4f2ec; z-index:3; }
.foot-overlay .big{ font-family:"Zen Old Mincho",serif; font-size:30px; line-height:1.5; letter-spacing:.04em; text-shadow:0 1px 14px rgba(0,0,0,.3); }
.foot-overlay .ig{ font-family:"Cormorant Garamond",serif; font-style:italic; font-size:21px; margin-top:34px; text-shadow:0 1px 14px rgba(0,0,0,.3); }
.foot-overlay .ig img{ width:30px; margin-top:14px; }
.foot-circle-wrap{ position:absolute; top:-60px; right:-150px; width:460px; height:460px; z-index:2; will-change:transform; }
.foot-circle{ width:100%; height:100%; animation:spin 50s linear infinite; opacity:.92; }
.foot-circle text{ font-family:"Cormorant Garamond",serif; fill:rgba(255,255,255,.9); font-size:16px; letter-spacing:3px; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.foot-bottom{ background:transparent; padding:54px 22px 40px; text-align:center; }
.foot-bottom .flogo{ width:150px; margin:0 auto; mix-blend-mode:multiply; }
.foot-nav{ display:none; }
.foot-copy{ font-family:"Cormorant Garamond",serif; font-style:italic; font-size:12px; color:#555; letter-spacing:.06em; margin-top:18px; }

@media (min-width:769px){
  .foot-imgs{ flex-direction:row; }
  .foot-imgs img{ width:33.333%; height:520px; }
  .foot-imgs img.f3{ display:block; }
  .foot-overlay{ left:7%; top:50%; }
  .foot-overlay .big{ font-size:36px; }
  .foot-circle-wrap{ width:720px; height:720px; right:3%; top:-120px; left:auto; }
  .foot-bottom{ display:flex; align-items:center; justify-content:space-between; padding:60px 6% 50px; text-align:left; position:relative; }
  .foot-bottom .flogo{ margin:0; }
  .foot-nav{ display:flex; gap:50px; position:relative; }
  .foot-nav::before{ content:""; position:absolute; left:-34px; top:9px; width:24px; height:1px; background:var(--ink); }
  .foot-nav .col{ display:flex; flex-direction:column; gap:12px; font-family:"Cormorant Garamond",serif; font-size:14px; letter-spacing:.12em; }
  .foot-copy{ position:absolute; left:6%; bottom:24px; margin:0; }
}
