/* 窓のある小さなアトリエ：墨色と真鍮、写真を大きく見せる */
:root {
  --bg:#F4F2EF; --paper:#FFFFFF; --ink:#1E1E1F; --muted:#6B6A68; --line:#DDD9D3;
  --dark:#1E1E1F; --brass:#B38B4D; --soft:#ECE8E1;
  --display:"Zen Old Mincho","Yu Mincho",serif;
  --latin:"Italiana","Times New Roman",serif;
  --body:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--body); font-size:15.5px; line-height:1.9; }
.in { max-width:1000px; margin:0 auto; padding-left:max(20px, env(safe-area-inset-left, 0px)); padding-right:max(20px, env(safe-area-inset-right, 0px)); }
a { color:var(--brass); }
h1,h2,h3 { margin:0; font-family:var(--display); font-weight:600; text-wrap:balance; }
p { margin:0; }
.ribbon { background:var(--brass); color:#fff; font-size:13px; text-align:center; padding:8px 16px; }
.ribbon a { color:#fff; }
header.top { background:var(--dark); color:#fff; padding-block:16px; position:sticky; top:0; z-index:5; }
header.top .in { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.logo { font-family:var(--latin); font-size:28px; letter-spacing:.14em; color:#fff; text-decoration:none; }
.logo small { font-family:var(--body); font-size:11px; letter-spacing:.14em; color:#BDB8AF; margin-left:8px; }
nav { display:flex; gap:20px; font-size:13.5px; letter-spacing:.08em; flex-wrap:wrap; }
nav a { color:#D9D5CE; text-decoration:none; padding-bottom:3px; border-bottom:1px solid transparent; }
nav a[aria-current="page"] { color:#fff; border-color:var(--brass); }
.hero { position:relative; min-height:520px; display:grid; align-items:end; color:#fff; background:var(--dark); overflow:hidden; }
.hero img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(30,30,31,.82) 0%, rgba(30,30,31,.45) 55%, rgba(30,30,31,.1) 100%); }
.hero .in { z-index:1; }
.hero .in { position:relative; width:100%; padding-block:64px; display:grid; gap:18px; }
.hero .en { font-family:var(--latin); font-size:20px; letter-spacing:.3em; color:#E9D9B8; }
.hero h1 { font-size:clamp(30px, 5.4vw, 50px); line-height:1.5; }
.hero p { max-width:30em; color:#EEE; }
.pagehead { background:var(--dark); color:#fff; padding-block:56px 48px; }
.pagehead .in { display:grid; gap:6px; }
.pagehead .en { font-family:var(--latin); font-size:18px; letter-spacing:.3em; color:#E9D9B8; }
.pagehead h1 { font-size:clamp(26px, 4.4vw, 36px); }
.btn { display:inline-block; text-decoration:none; font-weight:700; font-size:14px; padding:12px 26px; border:1px solid currentColor; }
.btn.main { background:var(--brass); border-color:var(--brass); color:#fff; }
.btn.line { color:var(--ink); }
.hero .btn.line { color:#fff; }
.row { display:flex; gap:10px; flex-wrap:wrap; }
section.block { padding-block:64px; }
section.block .in { display:grid; gap:26px; }
.head { display:grid; gap:4px; }
.head .en { font-family:var(--latin); font-size:16px; letter-spacing:.3em; color:var(--brass); }
.head h2 { font-size:clamp(22px, 3.6vw, 28px); }
.split { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:44px; align-items:center; }
.split figure, .wide { margin:0; overflow:hidden; max-width:100%; }
.split figure { aspect-ratio:4/5; }
.wide { aspect-ratio:21/9; }
.photo { width:100%; height:100%; object-fit:cover; display:block; }
.split p + p { margin-top:12px; }
.cards { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; }
.cards a { display:grid; gap:6px; padding:22px; background:var(--paper); border:1px solid var(--line); color:var(--ink); text-decoration:none; }
.cards a .en { font-family:var(--latin); letter-spacing:.24em; color:var(--brass); font-size:14px; }
.cards a h3 { font-size:18px; }
.cards a p { font-size:14px; color:var(--muted); }
.news div { display:grid; grid-template-columns:110px 1fr; gap:12px; padding:14px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
.news time { color:var(--muted); font-variant-numeric:tabular-nums; }
.menu-group { display:grid; gap:4px; }
.menu-group h3 { font-size:18px; padding-bottom:6px; border-bottom:2px solid var(--ink); }
.menu-group dl { margin:0; display:flex; justify-content:space-between; gap:12px; padding-block:12px; border-bottom:1px solid var(--line); }
.menu-group dd { margin:0; font-variant-numeric:tabular-nums; white-space:nowrap; }
.menu-group dt small { display:block; font-size:12.5px; color:var(--muted); }
.menus { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:36px 48px; }
.note { font-size:13px; color:var(--muted); }
.gallery { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.gallery figure { margin:0; display:grid; gap:8px; }
.gallery .ph { aspect-ratio:4/5; overflow:hidden; max-width:100%; }
.gallery figcaption { font-size:14px; }
.gallery figcaption small { display:block; color:var(--muted); font-size:12.5px; }
.staff { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:28px; }
.person { display:grid; gap:6px; padding:22px; background:var(--paper); border:1px solid var(--line); }
.person .role { font-family:var(--latin); letter-spacing:.2em; color:var(--brass); font-size:13px; }
.person p { font-size:14.5px; color:var(--muted); }
.info { width:100%; border-collapse:collapse; font-size:14.5px; }
.info th, .info td { text-align:left; padding:12px 0; border-bottom:1px solid var(--line); vertical-align:top; }
.info th { width:7em; color:var(--muted); font-weight:500; }
.cta { background:var(--dark); color:#fff; text-align:center; }
.cta .in { justify-items:center; }
.cta .btn.line { color:#fff; }
footer { padding-block:28px 40px; font-size:13px; color:var(--muted); text-align:center; display:grid; gap:4px; }
@media (max-width:700px) {
  .split, .cards, .menus, .staff { grid-template-columns:1fr; }
  .gallery { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .news div { grid-template-columns:1fr; gap:2px; }
  .hero { min-height:440px; }
  nav { gap:14px; }
}