:root{
  --bg:#f5f1ea;
  --ink:#171717;
  --muted:#625e58;
  --line:#d8d0c5;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family: "Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",Georgia,serif;
  line-height:1.8;
}
a{color:inherit;text-decoration:none}
img{display:block;width:100%}
.hero{
  position:relative;
  min-height:69vh;
  overflow:hidden;
  color:white;
  background:#222;
}
.hero-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.48) 0%,rgba(0,0,0,.18) 45%,rgba(0,0,0,.10) 100%);
}
.site-logo{
  position:absolute; top:24px; left:34px;
  z-index:2; display:block; width:92px;
}
.site-logo img{
  width:100%; height:auto; display:block;
}
.nav{
  position:absolute; top:28px; right:34px;
  z-index:2; display:flex; align-items:center; gap:30px;
  font-size:13px; letter-spacing:.08em;
}
.instagram-link,
.footer-instagram{
  display:inline-flex; align-items:center; justify-content:center;
}
.instagram-link svg{
  width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7;
}
.footer-instagram svg{
  width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6;
}
.hero-copy{
  position:absolute; left:10vw; top:50%; transform:translateY(-50%);
  z-index:2;
}
.hero-brand-logo{
  display:block;
  width:clamp(150px,17vw,250px);
  height:auto;
  margin:0 0 18px;
}
.hero-copy p{
  margin:0; font-size:clamp(20px,2.2vw,34px); letter-spacing:.02em;
}
.section{max-width:1180px;margin:0 auto;padding:55px 36px}
.about{
  display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:stretch;
}
.about-image-wrap{height:100%}
.about-image-wrap img{width:100%;height:100%;min-height:520px;object-fit:cover}
.about-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.eyebrow{
  display:block; font-size:12px; letter-spacing:.08em; margin-bottom:10px;
}
.about-copy h2{
  font-weight:400;font-size:clamp(28px,3vw,42px);margin:0 0 10px;line-height:1.25;
}
.about-copy h3{
  font-size:21px;line-height:1.45;margin:0 0 16px;
}
.about-copy p{
  margin:0 0 10px;font-size:14px;line-height:1.65;color:#2b2926;
}
.menu{border-top:1px solid var(--line)}
.section-heading{
  text-align:center;font-size:28px;letter-spacing:.08em;margin-bottom:24px;
}
.menu-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;
}
.menu-card img{
  aspect-ratio:4/3;object-fit:cover;background:#eee;
}
.menu-card h3{
  font-size:18px;font-weight:400;letter-spacing:.04em;margin:14px 0 0;
}
.access{
  display:grid;grid-template-columns:.8fr 1.4fr;gap:50px;align-items:center;border-top:1px solid var(--line);
}
.access-info h2{
  margin:0 0 28px;font-size:32px;font-weight:400;
}
dl{margin:0}
dl div{display:grid;grid-template-columns:95px 1fr;gap:12px;margin:0 0 14px}
dt{font-size:12px;letter-spacing:.08em;color:var(--muted)}
dd{margin:0;font-size:15px}
.access-instagram{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:24px;
  font-size:14px;
  letter-spacing:.02em;
}
.access-instagram svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
}
.map-wrap iframe{
  width:100%;height:100%;min-height:360px;border:0;filter:grayscale(.15) contrast(.95);
}
footer{
  position:relative;
  background:#1f1d1a;color:white;text-align:center;padding:18px 60px;
  font-size:12px;letter-spacing:.04em;
}
footer p{margin:0}
.footer-instagram{
  position:absolute; right:28px; top:50%; transform:translateY(-50%);
}
@media (max-width: 800px){
  .hero{min-height:58.5vh}
  .site-logo{top:16px;left:18px;width:68px}
  .nav{top:18px;right:18px;gap:14px;font-size:10px}
  .instagram-link svg{width:18px;height:18px}
  .hero-copy{left:7vw;top:58%}
  .section{padding:36px 20px}
  .about{grid-template-columns:1fr;gap:34px}
  .about-image-wrap img{height:auto;min-height:0;aspect-ratio:4/3}
  .menu-grid{grid-template-columns:1fr}
  .access{grid-template-columns:1fr}
  .map-wrap iframe{min-height:300px}
}

@media (max-width: 800px){
  .hero-brand-logo{width:130px;margin-bottom:12px}
}