/* ant theme main stylesheet - assembled from the site design */


/* shared base (inlined) */
/* ============================================
   ant — shared stylesheet (subpages)
   ============================================ */
:root {
  --ink: #1C1A17;
  --ink-soft: #3A3733;
  --paper: #F4F1EA;
  --paper-deep: #EAE5DA;
  --white: #FBFAF6;
  --henna: #9A4B2E;
  --henna-soft: #B86A47;
  --moss: #4A5A3F;
  --moss-deep: #333E2B;
  --gold: #A88A4E;
  --line: rgba(28,26,23,0.12);
  --line-soft: rgba(28,26,23,0.06);
  --mute: #847D70;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
::selection { background: var(--henna); color: var(--white); }
body {
  font-family: 'Zen Kaku Gothic Antique', sans-serif;
  background: var(--paper); color: var(--ink);
  font-weight: 300; line-height: 1.95;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
a { color: inherit; }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 1.1s cubic-bezier(.16,1,.3,1), transform 1.1s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity:1; transform:none; transition:none; } }
.vert { writing-mode: vertical-rl; text-orientation: mixed; }

/* ── NAV (solid variant for subpages) ── */
nav {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 56px;
  background: rgba(244,241,234,.85); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line-soft);
  transition: padding .4s ease;
}
nav.scrolled { padding: 14px 56px; }
.brand { font-family: 'Cormorant', serif; font-size: 28px; font-weight: 300; letter-spacing: .18em; color: var(--ink); line-height: 1; text-decoration: none; }
.nav-right { display: flex; align-items: center; gap: 40px; }
.nav-links { display: flex; gap: 34px; list-style: none; }
.nav-links a { text-decoration: none; color: var(--ink-soft); font-size: 11px; letter-spacing: .2em; font-weight: 400; transition: color .3s; }
.nav-links a:hover, .nav-links a.active { color: var(--henna); }
.nav-reserve { color: #fff !important; text-decoration: none; font-size: 11px; letter-spacing: .2em; background: var(--henna); padding: 11px 22px; border-radius: 1px; transition: background .3s; }
.nav-reserve:hover { background: var(--henna-soft); }

/* ── PAGE HEADER ── */
.page-head {
  position: relative; padding: 180px 56px 90px;
  background: var(--moss-deep); color: var(--white); overflow: hidden;
}
.page-head-bg { position:absolute; inset:0;
  background:
    radial-gradient(120% 80% at 85% 0%, rgba(154,75,46,.26) 0%, transparent 55%),
    linear-gradient(160deg, #3a472f 0%, #2b341f 60%, #20281a 100%);
}
.page-head-grain { position:absolute; inset:0; opacity:.5; mix-blend-mode:overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
.page-head-inner { position: relative; max-width: 1280px; margin: 0 auto; }
.crumb { font-size: 11px; letter-spacing: .18em; color: rgba(255,255,255,.55); margin-bottom: 28px; }
.crumb a { text-decoration: none; color: rgba(255,255,255,.55); transition: color .3s; }
.crumb a:hover { color: #fff; }
.crumb .sep { margin: 0 12px; color: rgba(255,255,255,.3); }
.page-eyebrow { font-family: 'Cormorant', serif; font-style: italic; font-size: 18px; letter-spacing: .1em; color: var(--henna-soft); margin-bottom: 16px; }
.page-title { font-family: 'Shippori Mincho', serif; font-weight: 400; font-size: clamp(34px, 5vw, 64px); line-height: 1.3; letter-spacing: .03em; color: var(--white); }
.page-sub { font-size: 14.5px; color: rgba(244,241,234,.85); line-height: 2.1; margin-top: 24px; max-width: 600px; }

/* ── SHARED BITS ── */
.eyebrow { font-family: 'Cormorant', serif; font-style: italic; font-size: 17px; letter-spacing: .1em; color: var(--henna); margin-bottom: 22px; }
.eyebrow .num { font-style: normal; font-size: 11px; letter-spacing: .3em; color: var(--mute); margin-right: 16px; vertical-align: middle; }
.h-sec { font-family: 'Shippori Mincho', serif; font-weight: 400; font-size: clamp(30px, 4vw, 52px); line-height: 1.5; letter-spacing: .03em; color: var(--ink); }
.lead { font-size: 14.5px; color: var(--ink-soft); line-height: 2.2; max-width: 540px; }
.btn { display:inline-flex; align-items:center; gap:12px; background: var(--henna); color:#fff; text-decoration:none; padding: 18px 40px; border-radius:1px; font-size:12px; letter-spacing:.2em; transition: background .35s, transform .35s; }
.btn:hover { background: var(--henna-soft); transform: translateY(-2px); }
.btn .arrow { transition: transform .35s; }
.btn:hover .arrow { transform: translateX(5px); }
.btn-ghost { display:inline-flex; align-items:center; gap:10px; color: var(--henna); text-decoration:none; font-size:12px; letter-spacing:.16em; border-bottom:1px solid var(--henna); padding-bottom:3px; transition: opacity .3s; }
.btn-ghost:hover { opacity:.6; }

/* ── FOOTER ── */
footer { background: var(--ink); color: var(--paper); padding: 70px 56px 48px; border-top: 1px solid rgba(255,255,255,.08); }
.foot-top { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:40px; padding-bottom: 48px; border-bottom:1px solid rgba(255,255,255,.08); }
.foot-brand { font-family:'Cormorant',serif; font-size:44px; font-weight:300; letter-spacing:.16em; color:#fff; line-height:1; text-decoration:none; }
.foot-brand .jp { display:block; font-family:'Zen Kaku Gothic Antique',sans-serif; font-size:11px; letter-spacing:.28em; color:var(--mute); margin-top:14px; }
.foot-cols { display:flex; gap:80px; flex-wrap:wrap; }
.foot-col h4 { font-size:10px; letter-spacing:.24em; color:var(--henna-soft); margin-bottom:18px; font-weight:500; font-family:'Cormorant',serif; font-style:italic; }
.foot-col a, .foot-col p { display:block; text-decoration:none; color:rgba(244,241,234,.6); font-size:12px; letter-spacing:.1em; line-height:2.2; transition:color .3s; }
.foot-col a:hover { color:#fff; }
.foot-bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; padding-top: 32px; }
.foot-bottom p { font-size:10.5px; letter-spacing:.12em; color:rgba(255,255,255,.3); }

/* ── RESPONSIVE shared ── */
@media (max-width: 680px) {
  nav { padding: 16px 22px; }
  nav.scrolled { padding: 12px 22px; }
  .nav-links { display:none; }
  .page-head { padding: 140px 24px 70px; }
  footer { padding: 56px 24px 40px; }
  .foot-cols { gap: 40px; }
}



  
/* == front page nav (transparent) == */
  /* NAV */
  body.is-front nav {
    position: fixed; inset: 0 0 auto 0; z-index: 100;
    display: flex; align-items: center; justify-content: space-between;
    padding: 28px 56px; mix-blend-mode: difference; transition: padding .4s ease;
  }
  body.is-front nav.scrolled { padding: 18px 56px; }
  body.is-front .brand { font-family: 'Cormorant', serif; font-size: 30px; font-weight: 300; letter-spacing: .18em; color: #fff; line-height: 1; text-decoration: none; }
  body.is-front .nav-right { display: flex; align-items: center; gap: 44px; }
  body.is-front .nav-links { display: flex; gap: 36px; list-style: none; }
  body.is-front .nav-links a { text-decoration: none; color: #fff; font-size: 11px; letter-spacing: .22em; font-weight: 400; opacity: .85; transition: opacity .3s; }
  body.is-front .nav-links a:hover { opacity: 1; }
  body.is-front .nav-reserve { color: #fff; text-decoration: none; font-size: 11px; letter-spacing: .22em; border: 1px solid rgba(255,255,255,.5); padding: 11px 22px; border-radius: 1px; }

/* == front page sections == */
  /* HERO */
  .hero { position: relative; min-height: 100vh; display: flex; align-items: flex-end; padding: 0 56px 64px; background: var(--moss-deep); overflow: hidden; }
  .hero-bg { position: absolute; inset: 0;
    background:
      radial-gradient(120% 80% at 80% 10%, rgba(154,75,46,.28) 0%, transparent 55%),
      radial-gradient(100% 90% at 10% 100%, rgba(20,26,16,.7) 0%, transparent 60%),
      linear-gradient(160deg, #3a472f 0%, #2b341f 55%, #20281a 100%);
  }
  .hero-scrim { position:absolute; inset:0; background: linear-gradient(to top, rgba(20,26,16,.78) 0%, rgba(20,26,16,.25) 38%, transparent 62%); pointer-events:none; }
  .hero-grain { position: absolute; inset: 0; opacity: .5; mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  }
  .hero-botanical { position: absolute; top: 50%; right: -60px; transform: translateY(-50%); width: 620px; height: 880px; opacity: .14; pointer-events: none; }
  .hero-vert-label { position: absolute; top: 130px; right: 60px; color: rgba(255,255,255,.55); font-size: 11px; letter-spacing: .5em; font-weight: 400; font-family: 'Cormorant', serif; font-style: italic; }
  .hero-inner { position: relative; max-width: 1100px; }
  .hero-eyebrow { display: flex; align-items: center; gap: 18px; color: var(--henna-soft); font-size: 11px; letter-spacing: .34em; font-weight: 500; margin-bottom: 36px; }
  .hero-eyebrow::before { content:''; width: 52px; height: 1px; background: var(--henna-soft); display:block; }
  .hero h1 { font-family: 'Shippori Mincho', serif; color: var(--white); font-weight: 400; font-size: clamp(44px, 7.2vw, 116px); line-height: 1.12; letter-spacing: .02em; margin-bottom: 40px; }
  .hero h1 .accent { color: var(--henna-soft); font-style: normal; }
  .hero h1 .thin { display: block; font-size: .42em; letter-spacing: .12em; color: rgba(255,255,255,.78); margin-top: 26px; font-weight: 400; line-height: 1.9; }
  .hero-foot { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 28px; margin-top: 8px; }
  .hero-cta { display: inline-flex; align-items: center; gap: 14px; background: var(--henna); color: var(--white); text-decoration: none; padding: 19px 40px; border-radius: 1px; font-size: 12px; letter-spacing: .22em; font-weight: 400; transition: background .35s, transform .35s; }
  .hero-cta:hover { background: var(--henna-soft); transform: translateY(-2px); }
  .hero-cta .arrow { transition: transform .35s; }
  .hero-cta:hover .arrow { transform: translateX(5px); }
  .hero-meta { color: rgba(255,255,255,.6); font-size: 11px; letter-spacing: .16em; line-height: 2.2; text-align: right; }
  .hero-meta b { color: rgba(255,255,255,.9); font-weight: 500; }

  /* STRIP */
  .strip { background: var(--ink); color: var(--paper); padding: 22px 0; overflow: hidden; white-space: nowrap; border-bottom: 1px solid rgba(255,255,255,.08); }
  .strip-track { display: inline-flex; gap: 60px; animation: slide 38s linear infinite; font-family: 'Cormorant', serif; font-style: italic; font-size: 18px; letter-spacing: .14em; color: rgba(244,241,234,.7); }
  .strip-track span { display:inline-flex; align-items:center; gap:60px; }
  .strip-track .dot { color: var(--henna-soft); font-style: normal; }
  @keyframes slide { to { transform: translateX(-50%); } }

  /* SECTION SHELL */
  body.is-front section { padding: 150px 56px; position: relative; }
  .eyebrow { font-family: 'Cormorant', serif; font-style: italic; font-size: 17px; letter-spacing: .1em; color: var(--henna); margin-bottom: 22px; }
  .eyebrow .num { font-style: normal; font-size: 11px; letter-spacing: .3em; color: var(--mute); margin-right: 16px; vertical-align: middle; }
  .h-sec { font-family: 'Shippori Mincho', serif; font-weight: 400; font-size: clamp(30px, 4vw, 52px); line-height: 1.5; letter-spacing: .03em; color: var(--ink); }
  .lead { font-size: 14.5px; color: var(--ink-soft); line-height: 2.2; max-width: 540px; }

  /* PHILOSOPHY */
  .philo { background: var(--paper); }
  .philo-grid { display: grid; grid-template-columns: 1fr auto; gap: 80px; align-items: start; max-width: 1280px; margin: 0 auto; }
  .philo-body { font-family: 'Shippori Mincho', serif; font-size: clamp(20px, 2.1vw, 27px); line-height: 2.5; letter-spacing: .04em; color: var(--ink); font-weight: 400; max-width: 760px; }
  .philo-body .em { color: var(--henna); }
  .philo-side { border-left: 1px solid var(--line); padding-left: 32px; height: 320px; display: flex; align-items: center; }
  .philo-side .vert { font-family: 'Shippori Mincho', serif; font-size: 14px; letter-spacing: .42em; color: var(--mute); height: 100%; }

  /* SPECIALTY */
  .spec { background: var(--white); }
  .spec-head { max-width: 1280px; margin: 0 auto 90px; }
  .spec-list { max-width: 1280px; margin: 0 auto; }
  .spec-row { display: grid; grid-template-columns: 90px 1fr 1.1fr; gap: 56px; align-items: start; padding: 64px 0; border-top: 1px solid var(--line); }
  .spec-row:last-child { border-bottom: 1px solid var(--line); }
  .spec-no { font-family: 'Cormorant', serif; font-size: 56px; font-weight: 300; line-height: 1; -webkit-text-stroke: 1px var(--gold); color: transparent; }
  .spec-title { font-family: 'Shippori Mincho', serif; font-size: clamp(24px, 2.6vw, 34px); font-weight: 500; line-height: 1.55; color: var(--ink); letter-spacing: .03em; }
  .spec-title .en { display: block; font-family: 'Cormorant', serif; font-style: italic; font-size: 15px; letter-spacing: .12em; color: var(--henna); margin-top: 14px; font-weight: 400; }
  .spec-desc { font-size: 14px; color: var(--ink-soft); line-height: 2.3; }
  .spec-tags { margin-top: 26px; display: flex; gap: 10px; flex-wrap: wrap; }
  .spec-tags span { font-size: 10px; letter-spacing: .2em; color: var(--moss); border: 1px solid var(--line); padding: 7px 16px; border-radius: 1px; }

  /* ATMOSPHERE */
  .atm { background: var(--moss-deep); color: var(--paper); padding: 0; }
  .atm-grid { display: grid; grid-template-columns: 1.15fr 1fr; min-height: 92vh; }
  .atm-copy { padding: 150px 64px; display: flex; flex-direction: column; justify-content: center; }
  .atm-copy .eyebrow { color: var(--henna-soft); }
  .atm-copy .h-sec { color: var(--white); }
  .atm-copy .lead { color: rgba(244,241,234,.72); margin-top: 24px; }
  .atm-figs { display: grid; grid-template-rows: 1fr 1fr; }
  .fig { position: relative; display: flex; align-items: flex-end; padding: 36px; overflow: hidden; }
  .fig + .fig { border-top: 1px solid rgba(255,255,255,.1); }
  .fig-1 { background: linear-gradient(150deg,#5a6347,#46503a); }
  .fig-2 { background: linear-gradient(150deg,#7a4733,#5e3526); }
  .fig-grain { position:absolute; inset:0; opacity:.4; mix-blend-mode:overlay;
    background-image: 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='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  .fig-cap { position: relative; }
  .fig-cap .k { font-family:'Cormorant',serif; font-style:italic; font-size: 14px; letter-spacing:.1em; color: rgba(255,255,255,.6); margin-bottom: 6px; }
  .fig-cap .t { font-family:'Shippori Mincho',serif; font-size: 16px; color:#fff; letter-spacing:.05em; }

  /* MENU */
  .menu { background: var(--paper); }
  .menu-head { max-width:1280px; margin:0 auto 80px; display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px; }
  .menu-wrap { max-width: 1280px; margin: 0 auto; }
  .m-row { display:grid; grid-template-columns: 1.4fr 2fr auto; gap: 48px; align-items: baseline; padding: 38px 0; border-top: 1px solid var(--line); transition: padding-left .4s ease; }
  .m-row:hover { padding-left: 14px; }
  .m-row:last-child { border-bottom: 1px solid var(--line); }
  .m-name { font-family:'Shippori Mincho',serif; font-size: 20px; font-weight:500; color: var(--ink); letter-spacing:.04em; line-height:1.5; }
  .m-name .sub { display:block; font-size:11px; letter-spacing:.18em; color:var(--henna); font-family:'Cormorant',serif; font-style:italic; margin-top:6px; font-weight:400; }
  .m-desc { font-size: 13px; color: var(--ink-soft); line-height: 2.1; }
  .m-price { font-family:'Cormorant',serif; font-size: 30px; font-weight:400; color: var(--ink); white-space: nowrap; text-align:right; }
  .m-price small { font-family:'Zen Kaku Gothic Antique',sans-serif; font-size:11px; color:var(--mute); letter-spacing:.1em; margin-left:6px; }
  .menu-note { max-width:1280px; margin: 44px auto 0; font-size:11.5px; color:var(--mute); letter-spacing:.08em; line-height:2.1; }

  /* INFO */
  .info { padding: 0; background: var(--white); }
  .info-grid { display:grid; grid-template-columns: 1fr 1fr; }
  .info-map { position:relative; min-height: 600px; overflow:hidden; background: linear-gradient(150deg,#3a472f,#252e1c); display:flex; align-items:center; justify-content:center; }
  .info-map .grain { position:absolute; inset:0; opacity:.4; mix-blend-mode:overlay;
    background-image: 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='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  .map-card { position:relative; text-align:center; color:#fff; }
  .map-card .pin { width: 56px; height: 56px; border-radius: 50%; border: 1px solid rgba(255,255,255,.5); display:flex; align-items:center; justify-content:center; margin: 0 auto 22px; font-size: 22px; animation: pulse 2.6s ease-in-out infinite; }
  @keyframes pulse { 0%,100%{box-shadow:0 0 0 0 rgba(184,106,71,.5);} 50%{box-shadow:0 0 0 18px rgba(184,106,71,0);} }
  .map-card .addr { font-family:'Shippori Mincho',serif; font-size:16px; letter-spacing:.08em; }
  .map-card .acc { font-size:11px; letter-spacing:.16em; color:rgba(255,255,255,.6); margin-top:10px; }
  .info-detail { padding: 120px 64px; display:flex; flex-direction:column; justify-content:center; background: var(--paper); }
  .info-detail .h-sec { font-size: clamp(26px,3vw,38px); margin-bottom: 48px; }
  .itab { width:100%; border-collapse: collapse; }
  .itab tr { border-bottom: 1px solid var(--line); }
  .itab td { padding: 20px 0; font-size: 13.5px; vertical-align: top; line-height:1.9; }
  .itab td:first-child { width: 130px; color: var(--mute); font-size: 11px; letter-spacing:.18em; padding-top: 23px; font-family:'Cormorant',serif; font-style:italic; }
  .itab b { color: var(--moss-deep); font-weight:500; }
  .pay { display:inline-flex; gap:8px; }
  .pay span { font-size:10px; letter-spacing:.12em; border:1px solid var(--moss); color:var(--moss); padding:5px 14px; border-radius:1px; }

  /* CTA */
  .cta { background: var(--ink); color: var(--paper); text-align:center; padding: 160px 56px; position:relative; overflow:hidden; }
  .cta-ghost { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-family:'Cormorant',serif; font-size: clamp(180px,32vw,460px); color: rgba(255,255,255,.035); letter-spacing:.06em; line-height:1; pointer-events:none; user-select:none; }
  .cta-inner { position:relative; }
  .cta .eyebrow { color: var(--henna-soft); justify-content:center; text-align:center; }
  .cta h2 { font-family:'Shippori Mincho',serif; font-weight:400; font-size: clamp(30px,4.4vw,58px); line-height:1.5; color:var(--white); letter-spacing:.04em; margin-bottom: 28px; }
  .cta p { color: rgba(244,241,234,.6); font-size:14px; line-height:2.1; margin-bottom: 50px; }
  .cta-btn { display:inline-flex; align-items:center; gap:14px; background: var(--henna); color:#fff; text-decoration:none; padding: 22px 56px; border-radius:1px; font-size:13px; letter-spacing:.2em; transition: background .35s, transform .35s; }
  .cta-btn:hover { background: var(--henna-soft); transform: translateY(-2px); }
  .cta-tel { margin-top: 36px; font-size:12px; letter-spacing:.14em; color:rgba(255,255,255,.4); }
  .cta-tel a { color:rgba(255,255,255,.75); text-decoration:none; font-family:'Cormorant',serif; font-size:22px; letter-spacing:.08em; margin-left:10px; }

/* == front responsive == */
  /* RESPONSIVE */
  @media (max-width: 1000px) {
    .philo-grid { grid-template-columns: 1fr; gap: 48px; }
    .philo-side { display:none; }
    .spec-row { grid-template-columns: 1fr; gap: 20px; padding: 48px 0; }
    .spec-no { font-size: 40px; }
    .atm-grid { grid-template-columns: 1fr; }
    .atm-copy { padding: 100px 32px; }
    .atm-figs { min-height: 560px; }
    .m-row { grid-template-columns: 1fr; gap: 12px; }
    .m-price { text-align:left; }
    .info-grid { grid-template-columns: 1fr; }
    .info-detail { padding: 80px 32px; }
    .info-map { min-height: 380px; }
  }
  @media (max-width: 680px) {
    nav { padding: 20px 24px; }
    nav.scrolled { padding: 14px 24px; }
    .nav-links { display:none; }
    .hero { padding: 0 24px 48px; }
    body.is-front section { padding: 100px 24px; }
    .strip-track { font-size: 15px; }
    .cta { padding: 110px 24px; }
    footer { padding: 56px 24px 40px; }
    .foot-cols { gap: 40px; }
  }

/* == menu page == */
.menu-page { max-width: 1080px; margin: 0 auto; padding: 120px 56px 80px; }
  .mcat { margin-bottom: 90px; }
  .mcat-head { display: flex; align-items: baseline; gap: 24px; margin-bottom: 36px; padding-bottom: 20px; border-bottom: 2px solid var(--ink); }
  .mcat-head .no { font-family:'Cormorant',serif; font-size: 22px; color: var(--gold); font-style:italic; }
  .mcat-head h2 { font-family:'Shippori Mincho',serif; font-weight: 500; font-size: 28px; color: var(--ink); letter-spacing:.04em; }
  .mcat-head .en { font-family:'Cormorant',serif; font-style:italic; font-size: 15px; color: var(--henna); letter-spacing:.1em; margin-left: auto; }

  .mitem { display: grid; grid-template-columns: 1fr auto; gap: 32px; padding: 28px 0; border-bottom: 1px solid var(--line); align-items: start; }
  .mitem .mi-name { font-family:'Shippori Mincho',serif; font-size: 19px; font-weight: 500; color: var(--ink); letter-spacing:.03em; }
  .mitem .mi-badge { display:inline-block; font-size: 9px; letter-spacing:.12em; color: var(--henna); border: 1px solid var(--henna-soft); padding: 3px 10px; border-radius: 1px; margin-left: 12px; vertical-align: middle; }
  .mitem .mi-desc { font-size: 12.5px; color: var(--ink-soft); line-height: 2; margin-top: 8px; max-width: 560px; }
  .mitem .mi-price { font-family:'Cormorant',serif; font-size: 28px; color: var(--ink); white-space: nowrap; text-align: right; }
  .mitem .mi-price small { font-family:'Zen Kaku Gothic Antique',sans-serif; font-size: 11px; color: var(--mute); letter-spacing:.1em; margin-left: 5px; }
  .mitem .mi-time { font-size: 11px; color: var(--mute); margin-top: 4px; text-align: right; font-family:'Cormorant',serif; font-style:italic; }

  .menu-notes { background: var(--white); border: 1px solid var(--line); padding: 40px 44px; margin-top: 40px; }
  .menu-notes h3 { font-family:'Cormorant',serif; font-style:italic; font-size: 17px; color: var(--henna); margin-bottom: 18px; }
  .menu-notes ul { list-style: none; }
  .menu-notes li { font-size: 12.5px; color: var(--ink-soft); line-height: 2.2; padding-left: 20px; position: relative; }
  .menu-notes li::before { content:'—'; position: absolute; left: 0; color: var(--gold); }

  .menu-cta { background: var(--moss-deep); color: var(--white); text-align: center; padding: 90px 56px; margin-top: 0; }
  .menu-cta h2 { font-family:'Shippori Mincho',serif; font-weight: 400; font-size: clamp(26px,3.4vw,40px); line-height: 1.5; margin-bottom: 22px; letter-spacing:.04em; }
  .menu-cta p { color: rgba(244,241,234,.65); font-size: 13.5px; line-height: 2; margin-bottom: 40px; }

  @media (max-width: 680px) {
    .menu-page { padding: 70px 24px 60px; }
    .mitem { grid-template-columns: 1fr; gap: 12px; }
    .mitem .mi-price, .mitem .mi-time { text-align: left; }
    .mcat-head .en { display: none; }
    .menu-cta { padding: 70px 24px; }
  }


/* == stylist page == */
.sty-wrap { max-width: 1180px; margin: 0 auto; padding: 120px 56px 140px; }
  .sty { display: grid; grid-template-columns: 1fr 1.2fr; gap: 0; margin-bottom: 100px; border: 1px solid var(--line); background: var(--white); overflow: hidden; }
  .sty:nth-child(even) { grid-template-columns: 1.2fr 1fr; }
  .sty:nth-child(even) .sty-photo { order: 2; }
  .sty-photo { position: relative; min-height: 480px; overflow: hidden; }
  .sty-photo .g { position:absolute; inset:0; opacity:.4; mix-blend-mode:overlay;
    background-image: 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='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  .sty-photo .num { position: absolute; top: 28px; left: 28px; font-family:'Cormorant',serif; font-size: 64px; color: rgba(255,255,255,.5); line-height: 1; }
  .bg-henna { background: linear-gradient(150deg,#7a4733,#5e3526); }
  .bg-moss { background: linear-gradient(150deg,#5a6347,#46503a); }
  .sty-body { padding: 64px 56px; display: flex; flex-direction: column; justify-content: center; }
  .sty-role { font-family:'Cormorant',serif; font-style:italic; font-size: 16px; color: var(--henna); letter-spacing:.08em; margin-bottom: 14px; }
  .sty-name { font-family:'Shippori Mincho',serif; font-weight: 500; font-size: 34px; color: var(--ink); letter-spacing:.04em; margin-bottom: 6px; }
  .sty-name .en { display: block; font-family:'Cormorant',serif; font-style:italic; font-size: 15px; color: var(--mute); letter-spacing:.1em; margin-top: 8px; font-weight: 400; }
  .sty-quote { font-family:'Shippori Mincho',serif; font-size: 17px; line-height: 2; color: var(--henna); margin: 28px 0; padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); letter-spacing:.03em; }
  .sty-bio { font-size: 13.5px; color: var(--ink-soft); line-height: 2.2; margin-bottom: 28px; }
  .sty-tags { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 32px; }
  .sty-tags span { font-size: 10px; letter-spacing: .16em; color: var(--moss); border: 1px solid var(--line); padding: 7px 16px; border-radius: 1px; }
  .sty-detail { display: flex; gap: 40px; flex-wrap: wrap; }
  .sty-detail div .k { font-family:'Cormorant',serif; font-style:italic; font-size: 12px; color: var(--mute); letter-spacing:.1em; }
  .sty-detail div .v { font-size: 13px; color: var(--ink); margin-top: 4px; }

  @media (max-width: 900px) {
    .sty, .sty:nth-child(even) { grid-template-columns: 1fr; }
    .sty:nth-child(even) .sty-photo { order: 0; }
    .sty-photo { min-height: 320px; }
    .sty-body { padding: 48px 32px; }
  }
  @media (max-width: 680px) {
    .sty-wrap { padding: 70px 24px 100px; }
    .sty { margin-bottom: 60px; }
  }


/* == blog list == */
.blog-wrap { max-width: 1280px; margin: 0 auto; padding: 110px 56px 140px; }
  .blog-layout { display: grid; grid-template-columns: 1fr 280px; gap: 80px; align-items: start; }

  /* filter */
  .cats { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 56px; }
  .cats button { font-family:'Zen Kaku Gothic Antique',sans-serif; background: none; border: 1px solid var(--line); color: var(--ink-soft); font-size: 11px; letter-spacing: .14em; padding: 9px 20px; border-radius: 1px; cursor: pointer; transition: all .3s; }
  .cats button:hover { border-color: var(--henna); color: var(--henna); }
  .cats button.active { background: var(--henna); border-color: var(--henna); color: #fff; }

  /* feature card */
  .feat { display: grid; grid-template-columns: 1.3fr 1fr; gap: 0; margin-bottom: 64px; border: 1px solid var(--line); background: var(--white); overflow: hidden; }
  .feat-img { position: relative; min-height: 340px; overflow: hidden; }
  .feat-grain, .card-grain { position:absolute; inset:0; opacity:.4; mix-blend-mode:overlay;
    background-image: 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='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  .feat-img .tag, .card-img .tag { position: absolute; top: 20px; left: 20px; z-index:2; font-size: 11px; letter-spacing: .14em; background: rgba(28,26,23,.82); color: #fff; padding: 7px 16px; border-radius: 1px; }
  .feat-body { padding: 52px 48px; display: flex; flex-direction: column; justify-content: center; }
  .feat-body .date { font-family:'Cormorant',serif; font-style:italic; font-size: 16px; color: var(--henna); letter-spacing:.1em; margin-bottom: 16px; font-weight:500; }
  .feat-body h2 { font-family:'Shippori Mincho',serif; font-weight:500; font-size: 27px; line-height: 1.55; letter-spacing: .03em; color: var(--ink); margin-bottom: 20px; }
  .feat-body p { font-size: 14px; color: var(--ink); line-height: 1.95; margin-bottom: 28px; }

  /* grid cards */
  .cards { display: grid; grid-template-columns: 1fr 1fr; gap: 48px 40px; }
  .card { background: var(--white); border: 1px solid var(--line); overflow: hidden; text-decoration: none; display: flex; flex-direction: column; transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
  .card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(28,26,23,.1); }
  .card-img { position: relative; height: 200px; overflow: hidden; }
  .card-body { padding: 28px 28px 32px; flex: 1; display: flex; flex-direction: column; }
  .card-body .date { font-family:'Cormorant',serif; font-style:italic; font-size: 15px; color: var(--henna); letter-spacing:.08em; margin-bottom: 12px; }
  .card-body h3 { font-family:'Shippori Mincho',serif; font-weight:500; font-size: 19px; line-height: 1.6; letter-spacing:.02em; color: var(--ink); margin-bottom: 14px; }
  .card-body p { font-size: 13.5px; color: var(--ink); line-height: 1.85; flex: 1; }
  .card-more { margin-top: 18px; font-family:'Cormorant',serif; font-style:italic; font-size: 15px; color: var(--henna); letter-spacing:.06em; font-weight:500; }

  /* image palettes */
  .bg-henna { background: linear-gradient(150deg,#7a4733,#5e3526); }
  .bg-moss { background: linear-gradient(150deg,#5a6347,#46503a); }
  .bg-ink { background: linear-gradient(150deg,#3a3733,#1f1d1a); }
  .bg-gold { background: linear-gradient(150deg,#a88a4e,#6e5a30); }
  .bg-deep { background: linear-gradient(150deg,#3a472f,#252e1c); }

  /* sidebar */
  .side-box { border: 1px solid var(--line); background: var(--white); padding: 32px 28px; margin-bottom: 32px; }
  .side-box h4 { font-family:'Cormorant',serif; font-style:italic; font-size: 16px; color: var(--henna); letter-spacing:.06em; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
  .side-cat { display: flex; justify-content: space-between; align-items: center; padding: 11px 0; font-size: 13.5px; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line-soft); transition: color .3s; letter-spacing:.04em; }
  .side-cat:last-child { border-bottom: none; }
  .side-cat:hover { color: var(--henna); }
  .side-cat span { font-family:'Cormorant',serif; font-size: 12px; color: var(--mute); }
  .side-recent { display: flex; gap: 14px; padding: 14px 0; text-decoration: none; border-bottom: 1px solid var(--line-soft); }
  .side-recent:last-child { border-bottom: none; }
  .side-recent .thumb { width: 56px; height: 56px; flex-shrink: 0; border-radius: 1px; }
  .side-recent .meta .d { font-family:'Cormorant',serif; font-style:italic; font-size: 12px; color: var(--henna); font-weight:500; }
  .side-recent .meta .t { font-size: 13px; color: var(--ink); line-height: 1.6; margin-top: 4px; font-family:'Shippori Mincho',serif; transition: color .3s; }
  .side-recent:hover .meta .t { color: var(--henna); }

  /* pagination */
  .pager { display: flex; justify-content: center; gap: 10px; margin-top: 80px; }
  .pager a { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--line); text-decoration: none; color: var(--ink-soft); font-family:'Cormorant',serif; font-size: 15px; transition: all .3s; }
  .pager a:hover, .pager a.active { background: var(--henna); border-color: var(--henna); color: #fff; }

  @media (max-width: 1000px) {
    .blog-layout { grid-template-columns: 1fr; gap: 60px; }
    .feat { grid-template-columns: 1fr; }
    .feat-img { min-height: 240px; }
  }
  @media (max-width: 680px) {
    .blog-wrap { padding: 70px 24px 100px; }
    .cards { grid-template-columns: 1fr; gap: 36px; }
    .feat-body { padding: 36px 28px; }
  }


/* == article == */
/* article hero */
  .art-head { position: relative; padding: 170px 56px 80px; background: var(--moss-deep); color: var(--white); overflow: hidden; }
  .art-head-bg { position:absolute; inset:0; background: radial-gradient(120% 80% at 80% 0%, rgba(154,75,46,.3) 0%, transparent 55%), linear-gradient(150deg,#7a4733 0%, #3a2a20 50%, #20281a 100%); }
  .art-head-grain { position:absolute; inset:0; opacity:.5; mix-blend-mode:overlay;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  }
  .art-head-inner { position: relative; max-width: 820px; margin: 0 auto; }
  .art-meta { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
  .art-meta .cat { font-size: 10px; letter-spacing: .16em; background: var(--henna); color:#fff; padding: 6px 14px; border-radius: 1px; }
  .art-meta .date { font-family:'Cormorant',serif; font-style:italic; font-size: 14px; color: rgba(255,255,255,.7); letter-spacing:.1em; }
  .art-title { font-family:'Shippori Mincho',serif; font-weight: 500; font-size: clamp(28px, 4vw, 46px); line-height: 1.5; letter-spacing: .03em; color: var(--white); }

  /* article body */
  .art-wrap { max-width: 820px; margin: 0 auto; padding: 90px 56px 120px; }
  .art-body { font-size: 16px; line-height: 2.05; color: var(--ink); letter-spacing: .02em; }
  .art-body p { margin-bottom: 30px; color: #2c2924; }
  .art-lead { font-family:'Shippori Mincho',serif; font-size: 20px; line-height: 1.95; color: var(--ink); margin-bottom: 48px; padding-bottom: 48px; border-bottom: 1px solid var(--line); }
  .art-body h2 { font-family:'Shippori Mincho',serif; font-weight: 500; font-size: 26px; line-height: 1.6; color: var(--ink); letter-spacing:.03em; margin: 64px 0 28px; padding-left: 20px; border-left: 3px solid var(--henna); }
  .art-body h3 { font-family:'Shippori Mincho',serif; font-weight: 500; font-size: 19px; color: var(--henna); margin: 44px 0 18px; letter-spacing:.03em; }
  .art-body strong { color: var(--ink); font-weight: 500; }
  .art-figure { margin: 48px 0; }
  .art-figure .ph { height: 380px; border-radius: 2px; position: relative; overflow: hidden; }
  .art-figure .ph .g { position:absolute; inset:0; opacity:.4; mix-blend-mode:overlay;
    background-image: 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='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  .art-figure figcaption { font-size: 11.5px; color: var(--mute); letter-spacing: .08em; margin-top: 12px; text-align: center; font-style: italic; font-family:'Cormorant',serif; font-size:13px; }
  .pull { font-family:'Shippori Mincho',serif; font-size: 22px; line-height: 1.9; color: var(--henna); text-align: center; padding: 40px 20px; margin: 56px 0; letter-spacing:.04em; }
  .pull::before, .pull::after { content:'—'; color: var(--gold); margin: 0 12px; }
  .bg-henna { background: linear-gradient(150deg,#7a4733,#5e3526); }
  .bg-moss { background: linear-gradient(150deg,#5a6347,#46503a); }

  /* share + tags */
  .art-foot { max-width: 820px; margin: 0 auto; padding: 0 56px 100px; }
  .art-tags { display: flex; gap: 10px; flex-wrap: wrap; padding-top: 40px; border-top: 1px solid var(--line); }
  .art-tags span { font-size: 11px; letter-spacing: .1em; color: var(--moss); border: 1px solid var(--line); padding: 7px 16px; border-radius: 1px; }

  /* author */
  .author { display: flex; gap: 24px; align-items: center; background: var(--white); border: 1px solid var(--line); padding: 32px; margin-top: 48px; }
  .author .ava { width: 72px; height: 72px; border-radius: 50%; flex-shrink: 0; background: linear-gradient(150deg,#7a4733,#46503a); }
  .author .a-name { font-family:'Shippori Mincho',serif; font-size: 16px; color: var(--ink); }
  .author .a-role { font-family:'Cormorant',serif; font-style:italic; font-size: 13px; color: var(--henna); margin: 4px 0 10px; }
  .author .a-bio { font-size: 13px; color: var(--ink); line-height: 1.95; }

  /* related */
  .related { background: var(--white); border-top: 1px solid var(--line); padding: 100px 56px; }
  .related-inner { max-width: 1280px; margin: 0 auto; }
  .related h2 { font-family:'Shippori Mincho',serif; font-weight: 400; font-size: 28px; color: var(--ink); margin-bottom: 48px; letter-spacing:.03em; }
  .rel-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 36px; }
  .rel-card { text-decoration: none; border: 1px solid var(--line); overflow: hidden; transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
  .rel-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(28,26,23,.1); }
  .rel-card .ri { height: 170px; position: relative; }
  .rel-card .ri .g { position:absolute; inset:0; opacity:.4; mix-blend-mode:overlay;
    background-image: 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='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  .rel-card .rb { padding: 24px; }
  .rel-card .rb .d { font-family:'Cormorant',serif; font-style:italic; font-size: 13px; color: var(--henna); margin-bottom: 10px; font-weight:500; }
  .rel-card .rb .t { font-family:'Shippori Mincho',serif; font-size: 16px; line-height: 1.6; color: var(--ink); }
  .bg-deep { background: linear-gradient(150deg,#3a472f,#252e1c); }
  .bg-gold { background: linear-gradient(150deg,#a88a4e,#6e5a30); }
  .bg-ink { background: linear-gradient(150deg,#3a3733,#1f1d1a); }

  .back-link { max-width: 820px; margin: 0 auto; padding: 40px 56px 0; }

  @media (max-width: 680px) {
    .art-head { padding: 130px 24px 60px; }
    .art-wrap { padding: 60px 24px 80px; }
    .art-foot, .back-link { padding-left: 24px; padding-right: 24px; }
    .related { padding: 70px 24px; }
    .rel-cards { grid-template-columns: 1fr; gap: 28px; }
    .art-figure .ph { height: 240px; }
  }

/* ============================================
   ant theme — WordPress additions
   (mobile nav / FAQ / block editor mapping)
   ============================================ */

/* ---------- Accessibility / WP core ---------- */
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute; word-wrap: normal !important;
}
.alignleft { float: left; margin: 6px 28px 20px 0; }
.alignright { float: right; margin: 6px 0 20px 28px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
img { max-width: 100%; height: auto; }

/* admin bar offset for fixed nav */
body.admin-bar nav#site-nav { top: 32px; }
@media (max-width: 782px) { body.admin-bar nav#site-nav { top: 46px; } }

/* ---------- Mobile drawer nav ---------- */
.nav-toggle {
  display: none; background: none; border: 0; cursor: pointer;
  width: 40px; height: 40px; position: relative; z-index: 210; padding: 0;
}
.nav-toggle span {
  display: block; width: 24px; height: 1px; background: var(--ink);
  margin: 4px auto; transition: transform .35s, opacity .35s, background .35s;
}
body.is-front .nav-toggle span { background: #fff; }
body.drawer-open .nav-toggle span { background: #fff; }
body.drawer-open .nav-toggle span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
body.drawer-open .nav-toggle span:nth-child(2) { opacity: 0; }
body.drawer-open .nav-toggle span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

.drawer {
  position: fixed; inset: 0; z-index: 200; background: var(--moss-deep);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s;
}
body.drawer-open .drawer { opacity: 1; visibility: visible; }
.drawer a {
  font-family: 'Shippori Mincho', serif; color: var(--white);
  text-decoration: none; font-size: 20px; letter-spacing: .14em;
  padding: 12px 0; opacity: .9; transition: color .3s;
}
.drawer a:hover { color: var(--henna-soft); }
.drawer .drawer-reserve {
  margin-top: 24px; font-family: 'Zen Kaku Gothic Antique', sans-serif;
  font-size: 12px; letter-spacing: .22em; background: var(--henna);
  padding: 16px 44px; border-radius: 1px;
}
.drawer .drawer-en {
  font-family: 'Cormorant', serif; font-style: italic; font-size: 12px;
  letter-spacing: .3em; color: rgba(255,255,255,.4); margin-bottom: 20px;
}
@media (max-width: 680px) {
  .nav-toggle { display: block; }
  .nav-reserve { display: none; }
}
body.drawer-open { overflow: hidden; }
body.drawer-open nav#site-nav { mix-blend-mode: normal; background: none; border-bottom: 0; backdrop-filter: none; z-index: 300; }
body.drawer-open .brand { color: #fff; }

/* front page: transparent nav (reset solid base styles) */
body.is-front nav#site-nav { background: none; border-bottom: 0; backdrop-filter: none; }
body.is-front .nav-reserve { background: none; }
body.is-front .nav-reserve:hover { background: rgba(255,255,255,.12); }

/* ---------- FAQ (Q&A) page ---------- */
.faq-wrap { max-width: 860px; margin: 0 auto; padding: 110px 56px 120px; }
.faq-cat { margin-bottom: 72px; }
.faq-cat-head {
  display: flex; align-items: baseline; gap: 20px;
  margin-bottom: 28px; padding-bottom: 18px; border-bottom: 2px solid var(--ink);
}
.faq-cat-head h2 { font-family: 'Shippori Mincho', serif; font-weight: 500; font-size: 24px; color: var(--ink); letter-spacing: .04em; }
.faq-cat-head .en { font-family: 'Cormorant', serif; font-style: italic; font-size: 14px; color: var(--henna); letter-spacing: .1em; margin-left: auto; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-q {
  width: 100%; display: flex; align-items: flex-start; gap: 20px; text-align: left;
  background: none; border: 0; cursor: pointer; padding: 26px 44px 26px 0;
  font-family: 'Shippori Mincho', serif; font-size: 16.5px; line-height: 1.8;
  color: var(--ink); letter-spacing: .03em; position: relative; transition: color .3s;
}
.faq-q:hover { color: var(--henna); }
.faq-q .qm {
  font-family: 'Cormorant', serif; font-style: italic; font-size: 22px;
  color: var(--henna); line-height: 1.3; flex-shrink: 0;
}
.faq-q::after {
  content: ''; position: absolute; right: 8px; top: 36px;
  width: 10px; height: 10px; border-right: 1px solid var(--mute); border-bottom: 1px solid var(--mute);
  transform: rotate(45deg); transition: transform .35s;
}
.faq-item.open .faq-q::after { transform: rotate(225deg) translate(-4px,-4px); }
.faq-a {
  display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s cubic-bezier(.16,1,.3,1);
}
.faq-item.open .faq-a { grid-template-rows: 1fr; }
.faq-a-inner { overflow: hidden; }
.faq-a-body {
  display: flex; gap: 20px; padding: 4px 0 34px;
  font-size: 14px; line-height: 2.15; color: var(--ink-soft);
}
.faq-a-body .am {
  font-family: 'Cormorant', serif; font-style: italic; font-size: 22px;
  color: var(--moss); line-height: 1.3; flex-shrink: 0;
}
.faq-a-body p { margin-bottom: 14px; }
.faq-a-body p:last-child { margin-bottom: 0; }
.faq-a-body a { color: var(--henna); }
.faq-contact {
  background: var(--white); border: 1px solid var(--line);
  padding: 48px 44px; margin-top: 60px; text-align: center;
}
.faq-contact h3 { font-family: 'Shippori Mincho', serif; font-weight: 500; font-size: 20px; color: var(--ink); margin-bottom: 14px; letter-spacing: .04em; }
.faq-contact p { font-size: 13px; color: var(--ink-soft); line-height: 2; margin-bottom: 28px; }
@media (max-width: 680px) {
  .faq-wrap { padding: 70px 24px 90px; }
  .faq-q { font-size: 15px; padding-right: 36px; }
}

/* ---------- Blog list: WP pagination ---------- */
.pager .page-numbers {
  width: 42px; height: 42px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); text-decoration: none; color: var(--ink-soft);
  font-family: 'Cormorant', serif; font-size: 15px; transition: all .3s;
}
.pager .page-numbers:hover, .pager .page-numbers.current { background: var(--henna); border-color: var(--henna); color: #fff; }
.pager .page-numbers.dots { border: 0; }

/* category filter as links */
.cats a {
  font-family: 'Zen Kaku Gothic Antique', sans-serif; background: none;
  border: 1px solid var(--line); color: var(--ink-soft); text-decoration: none;
  font-size: 11px; letter-spacing: .14em; padding: 9px 20px; border-radius: 1px;
  transition: all .3s;
}
.cats a:hover { border-color: var(--henna); color: var(--henna); }
.cats a.active { background: var(--henna); border-color: var(--henna); color: #fff; }

/* thumbnails inside cards use <img> now */
.feat-img img, .card-img img, .side-recent .thumb img, .rel-card .ri img,
.sty-photo img, .art-figure .ph img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.feat-img, .card-img, .side-recent .thumb, .rel-card .ri, .sty-photo, .art-figure .ph { position: relative; }

/* ---------- Article body: block editor mapping ---------- */
.art-body > p:first-child {
  font-family: 'Shippori Mincho', serif; font-size: 20px; line-height: 1.95;
  color: var(--ink); margin-bottom: 48px; padding-bottom: 48px; border-bottom: 1px solid var(--line);
}
.art-body ul, .art-body ol { margin: 0 0 30px 4px; padding-left: 22px; }
.art-body li { margin-bottom: 10px; line-height: 2; color: #2c2924; }
.art-body ul li::marker { color: var(--gold); }
.art-body blockquote {
  font-family: 'Shippori Mincho', serif; font-size: 22px; line-height: 1.9;
  color: var(--henna); text-align: center; padding: 40px 20px; margin: 56px 0;
  letter-spacing: .04em; border: 0;
}
.art-body blockquote p { margin: 0; color: var(--henna); }
.art-body blockquote::before, .art-body blockquote::after { content: '—'; color: var(--gold); margin: 0 12px; }
.art-body figure.wp-block-image, .art-body .wp-caption { margin: 48px 0; max-width: 100%; }
.art-body figure.wp-block-image img, .art-body .wp-caption img {
  width: 100%; height: auto; border-radius: 2px; display: block;
}
.art-body figcaption, .art-body .wp-caption-text {
  font-family: 'Cormorant', serif; font-style: italic; font-size: 13px;
  color: var(--mute); letter-spacing: .08em; margin-top: 12px; text-align: center;
}
.art-body hr { border: 0; border-top: 1px solid var(--line); margin: 56px 0; }
.art-body table { width: 100%; border-collapse: collapse; margin: 0 0 30px; font-size: 13.5px; }
.art-body th, .art-body td { border: 1px solid var(--line); padding: 12px 16px; text-align: left; }
.art-body th { background: var(--paper-deep); font-weight: 500; }
.art-body a { color: var(--henna); }
.art-body .wp-block-embed { margin: 48px 0; }
.art-body .wp-block-embed iframe { max-width: 100%; }
.art-body .wp-block-button__link {
  display: inline-flex; align-items: center; gap: 12px; background: var(--henna);
  color: #fff; text-decoration: none; padding: 16px 36px; border-radius: 1px;
  font-size: 12px; letter-spacing: .2em;
}

/* generic page content */
.page-content-wrap { max-width: 820px; margin: 0 auto; padding: 90px 56px 120px; }
@media (max-width: 680px) { .page-content-wrap { padding: 60px 24px 80px; } }

/* 404 */
.err-wrap { text-align: center; padding: 200px 24px 160px; }
.err-wrap .code { font-family: 'Cormorant', serif; font-size: 120px; color: var(--henna); line-height: 1; font-style: italic; }
.err-wrap h1 { font-family: 'Shippori Mincho', serif; font-weight: 400; font-size: 24px; margin: 24px 0 16px; }
.err-wrap p { font-size: 13.5px; color: var(--ink-soft); margin-bottom: 40px; }

/* front page: no-image fallbacks keep original gradients (already in base) */
.hero-photo, .info-map-photo, .fig-photo, .page-head-photo {
  position: absolute; inset: 0; background-size: cover; background-position: center;
}

/* hero: exterior photo mode */
.hero-photo-overlay {
  position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(to right, rgba(28,26,23,.62) 0%, rgba(28,26,23,.34) 55%, rgba(28,26,23,.46) 100%),
    linear-gradient(rgba(43,48,34,.4), rgba(43,48,34,.4));
}

/* ============================================
   Responsive overhaul
   (appended last: wins the cascade)
   ============================================ */

/* 横スクロール防止ガード */
html, body { overflow-x: clip; }

/* iOSのアドレスバーを考慮したヒーロー高さ */
@supports (min-height: 100svh) {
  .hero { min-height: 100svh; }
}

/* ---------- 〜1024px: ナビはハンバーガーに切替 ---------- */
@media (max-width: 1024px) {
  .nav-links { display: none !important; }
  .nav-toggle { display: block; }
  .nav-right { gap: 20px; }

  /* 縦書き英語ラベルは非表示(コンテンツと干渉するため) */
  .hero-vert-label { display: none; }

  /* atm: コピー側の余白を圧縮 */
  .atm-grid { min-height: 0; }
}

/* ---------- 〜680px: モバイル最適化 ---------- */
@media (max-width: 680px) {

  /* ナビ */
  nav { padding: 18px 20px; }
  nav.scrolled { padding: 12px 20px; }
  body.is-front nav { padding: 20px 20px; }
  body.is-front nav.scrolled { padding: 14px 20px; }
  .brand, body.is-front .brand { font-size: 24px; }
  .nav-reserve { display: none; }

  /* ヒーロー */
  .hero { padding: 0 22px 88px; }
  .hero h1 { font-size: clamp(31px, 9.4vw, 44px); line-height: 1.25; margin-bottom: 30px; }
  .hero h1 .thin { font-size: .48em; letter-spacing: .06em; line-height: 2; margin-top: 20px; }
  .hero-eyebrow { font-size: 10px; letter-spacing: .26em; margin-bottom: 26px; }
  .hero-eyebrow::before { width: 34px; }
  .hero-foot { flex-direction: column; align-items: flex-start; gap: 24px; }
  .hero-cta { padding: 18px 40px; }
  .hero-meta { text-align: left; }

  /* 帯 */
  .strip { padding: 16px 0; }
  .strip-track { font-size: 13px; gap: 36px; }

  /* 見出し・リード */
  .h-sec { font-size: clamp(25px, 7.2vw, 30px); line-height: 1.6; }
  .eyebrow { font-size: 15px; margin-bottom: 16px; }
  .lead { font-size: 13.5px; }

  /* philo */
  .philo-body { font-size: 17.5px; line-height: 2.35; }

  /* spec */
  .spec-row { padding: 40px 0; gap: 16px; }
  .spec-no { font-size: 32px; }
  .spec-title { font-size: 21px; }
  .spec-desc { font-size: 13px; line-height: 2.1; }

  /* atm */
  .atm-copy { padding: 80px 24px; }
  .atm-figs { min-height: 0; grid-template-rows: 240px 240px; }
  .fig { padding: 22px; }
  .fig-cap .t { font-size: 14px; }

  /* menu(トップ) */
  .menu-head { margin-bottom: 48px; }
  .m-row { padding: 26px 0; gap: 8px; }
  .m-name { font-size: 18px; }
  .m-price { font-size: 18px; }

  /* info */
  .info-map { min-height: 300px; }
  .map-card .pin { width: 46px; height: 46px; font-size: 18px; margin-bottom: 16px; }
  .map-card .addr { font-size: 14px; }
  .info-detail { padding: 70px 24px; }
  .itab td { padding: 16px 0; font-size: 13px; }
  .itab td:first-child { width: 86px; font-size: 10px; letter-spacing: .12em; padding-top: 19px; }

  /* cta */
  .cta-ghost { font-size: clamp(110px, 40vw, 180px); }
  .cta h2 { font-size: clamp(26px, 7.6vw, 32px); }
  .cta p { font-size: 13px; }

  /* page-head(下層共通) */
  .page-head { padding: 120px 22px 60px; }
  .page-title { font-size: clamp(28px, 8vw, 36px); }
  .page-sub { font-size: 13px; line-height: 2; margin-top: 18px; }

  /* menu page */
  .mcat { margin-bottom: 64px; }
  .mcat-head { gap: 14px; margin-bottom: 28px; }
  .mcat-head h2 { font-size: 22px; }
  .mcat-head .no { font-size: 17px; }
  .mitem { padding: 22px 0; }
  .mitem .mi-name { font-size: 17px; }
  .mitem .mi-price { font-size: 18px; }

  /* stylist page */
  .sty-photo { min-height: 280px; }
  .sty-photo .num { top: 18px; left: 18px; font-size: 44px; }
  .sty-body { padding: 40px 24px; }
  .sty-name { font-size: 26px; }
  .sty-quote { font-size: 15px; margin: 22px 0; padding: 16px 0; }
  .sty-bio { font-size: 13px; }
  .sty-detail { gap: 24px; }

  /* blog */
  .cats { gap: 8px; margin-bottom: 40px; }
  .cats a { padding: 8px 16px; font-size: 10px; }
  .feat-body { padding: 32px 24px; }
  .feat-body h2 { font-size: 20px; }
  .side-box { padding: 28px 24px; }
  .pager { margin-top: 56px; }
  .pager .page-numbers { width: 38px; height: 38px; }

  /* article */
  .art-title { font-size: clamp(24px, 6.6vw, 30px); }
  .art-body { font-size: 15px; line-height: 2; }
  .art-body > p:first-child { font-size: 17.5px; line-height: 1.9; margin-bottom: 36px; padding-bottom: 36px; }
  .art-body h2 { font-size: 22px; margin: 48px 0 22px; padding-left: 16px; }
  .art-body h3 { font-size: 17px; }
  .art-body blockquote { font-size: 18px; padding: 28px 8px; margin: 40px 0; }
  .author { gap: 18px; }
  .author .ava { width: 52px; height: 52px; flex-shrink: 0; }

  /* faq */
  .faq-cat { margin-bottom: 56px; }
  .faq-cat-head h2 { font-size: 20px; }
  .faq-a-body { font-size: 13.5px; line-height: 2; }
  .faq-q .qm, .faq-a-body .am { font-size: 19px; }
  .faq-contact { padding: 38px 24px; margin-top: 44px; }

  /* footer */
  .foot-top { flex-direction: column; gap: 44px; }
  .foot-brand { font-size: 36px; }
  .foot-cols { gap: 36px 56px; }
  .foot-bottom { flex-direction: column; gap: 8px; align-items: flex-start; }

  /* 汎用: セクション内の余白圧縮 */
  .menu-notes { padding: 32px 24px; }
  .err-wrap { padding: 160px 22px 120px; }
  .err-wrap .code { font-size: 88px; }
}

/* ---------- 〜380px: 極小画面の微調整 ---------- */
@media (max-width: 380px) {
  .hero h1 { font-size: 29px; }
  .h-sec { font-size: 23px; }
  .page-title { font-size: 26px; }
  .hero-cta { padding: 16px 32px; font-size: 12px; }
  .itab td:first-child { width: 74px; }
}

/* ============================================
   PC/SP 出し分け画像(CSS変数ベース)
   --img-pc / --img-sp をインラインで受け取る
   ============================================ */
.hero-photo, .page-head-photo {
  background-image: var(--img-pc);
  background-size: cover;
  background-position: center;
}
@media (max-width: 680px) {
  .hero-photo, .page-head-photo {
    background-image: var(--img-sp, var(--img-pc));
  }
}
