:root{
  --sumi:#1F1A17;      /* ロゴのダークブラウン */
  --sumi-2:#2E2723;
  --kinari:#FAF8F4;    /* 生成り */
  --usu:#F0ECE5;       /* 淡い砂色 */
  --kin:#A8842C;       /* 金茶(CTA・アクセント) */
  --kin-d:#8C6C21;
  --moji:#33302C;
  --hai:#8B857D;
  --line:#DDD8D0;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .fade{transition:none!important;opacity:1!important;transform:none!important}
}
body{
  font-family:'Zen Kaku Gothic New',sans-serif;
  color:var(--moji);background:var(--kinari);
  line-height:1.95;font-size:15.5px;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,.mincho{font-family:'Shippori Mincho',serif;font-weight:600;letter-spacing:.06em;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--kin);outline-offset:3px}
.wrap{max-width:1060px;margin:0 auto;padding:0 22px}

/* ---------- header ---------- */
header{position:sticky;top:0;z-index:60;background:rgba(250,248,244,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px;gap:20px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0}
.brand img{width:36px;height:36px}
.brand .txt{font-family:'Shippori Mincho',serif;font-weight:700;font-size:16px;letter-spacing:.1em;color:var(--sumi);white-space:nowrap}
.brand .txt small{display:block;font-family:'Zen Kaku Gothic New',sans-serif;font-weight:400;font-size:8.5px;letter-spacing:.26em;color:var(--hai)}
.nav ul{display:flex;align-items:center;gap:24px;list-style:none;font-size:13.5px}
.nav a{text-decoration:none}
.nav a:hover{color:var(--kin)}
.nav .cta-mini{background:var(--sumi);color:#fff;padding:10px 20px;border-radius:2px;letter-spacing:.08em;font-size:12.5px}
.nav .cta-mini:hover{background:var(--kin);color:#fff}
@media(max-width:860px){.nav ul li:not(:last-child){display:none}}

/* ---------- buttons ---------- */
.btn{display:inline-block;text-decoration:none;font-weight:700;letter-spacing:.1em;
     padding:16px 38px;border-radius:2px;transition:.2s;font-size:14.5px}
.btn-kin{background:var(--kin);color:#fff}
.btn-kin:hover{background:var(--kin-d);color:#fff}
.btn-line{border:1px solid var(--sumi);color:var(--sumi)}
.btn-line:hover{background:var(--sumi);color:#fff}
.btn-wht{border:1px solid rgba(255,255,255,.55);color:#fff}
.btn-wht:hover{background:#fff;color:var(--sumi)}

/* ---------- section ---------- */
section{padding:88px 0}
.sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:46px}
.sec-kanji{writing-mode:vertical-rl;font-family:'Shippori Mincho',serif;font-size:14px;
           letter-spacing:.4em;color:var(--kin);border-left:1px solid var(--kin);padding-left:10px;min-height:70px}
.sec-head h2{font-size:clamp(21px,3vw,27px);color:var(--sumi)}
.sec-head p{font-size:11.5px;color:var(--hai);letter-spacing:.24em}
.alt{background:var(--usu)}
.note{font-size:12.5px;color:var(--hai)}

/* ---------- footer ---------- */
footer{background:var(--sumi);color:#B9B2A8;padding:56px 0 30px;font-size:13px}
.f-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px;padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.13)}
.f-brand{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.f-brand img{width:40px;height:40px}
.f-brand span{font-family:'Shippori Mincho',serif;font-size:16px;letter-spacing:.1em;color:#fff}
footer h4{font-size:12px;letter-spacing:.2em;color:#fff;margin-bottom:14px;font-weight:700}
footer ul{list-style:none;font-size:13px}
footer li{margin-bottom:9px}
footer a{text-decoration:none}
footer a:hover{color:var(--kin)}
.f-btm{padding-top:24px;font-size:11.5px;color:#8A8279;text-align:center;letter-spacing:.06em}
@media(max-width:760px){.f-top{grid-template-columns:1fr;gap:26px}}

/* ---------- fade ---------- */
.fade{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.fade.in{opacity:1;transform:none}