:root{
  --bg:#faf7f2;
  --bg-alt:#f2ede4;
  --ink:#3a3a34;
  --ink-soft:#6b6b62;
  --line:#e3ddd1;
  --accent:#8a9a7b;      /* olive */
  --accent-dark:#6d7d5f;
  --gold:#b89968;
  --line-green:#06c755;
  --shadow:0 10px 30px rgba(60,55,40,.08);
  --radius:14px;
  --serif-jp:"Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --serif-en:"Cormorant Garamond", "Noto Serif JP", serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:var(--bg);
  font-family:var(--serif-jp);
  font-weight:300;
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent-dark);text-decoration:none;transition:opacity .2s}
a:hover{opacity:.75}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

.container{width:min(1080px,92%);margin-inline:auto}
.container.narrow{max-width:720px}
.center{text-align:center}

.skip-link{position:absolute;left:-9999px;top:0;background:#fff;padding:.5rem 1rem}
.skip-link:focus{left:1rem;top:1rem;z-index:100}

/* Header */
.site-header{
  position:sticky;top:0;z-index:20;
  background:rgba(250,247,242,.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:.9rem 0;gap:1rem;flex-wrap:nowrap;min-width:0}
.brand{display:flex;flex-direction:column;line-height:1;color:var(--ink);flex-shrink:0;min-width:0}
.brand-en{font-family:var(--serif-en);font-size:1.35rem;letter-spacing:.18em;white-space:nowrap}
.brand-jp{font-size:.7rem;color:var(--ink-soft);margin-top:.35rem;letter-spacing:.2em;white-space:nowrap}
.site-nav{min-width:0}
.site-nav ul{display:flex;gap:1.5rem;list-style:none;margin:0;padding:0;flex-wrap:nowrap}
.site-nav a{color:var(--ink);font-size:.9rem;letter-spacing:.1em;white-space:nowrap}
@media (max-width:720px){
  .header-inner{gap:.6rem}
  .site-nav ul{gap:.9rem}
  .site-nav a{font-size:.78rem;letter-spacing:.05em}
  .brand-en{font-size:1.05rem;letter-spacing:.12em}
  .brand-jp{display:none}
}
@media (max-width:400px){
  .site-nav ul{gap:.65rem}
  .site-nav a{font-size:.72rem}
  .brand-en{font-size:.95rem}
}

/* Hero */
.hero{position:relative;min-height:78vh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hero-media{
  position:absolute;inset:0;z-index:-1;
  background-image:linear-gradient(rgba(250,247,242,.15),rgba(250,247,242,.55)), url("../images/hero.jpg?v=20260809f");
  background-size:cover;background-position:center;
}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 60%,var(--bg) 100%)}
.hero-inner{padding:6rem 0 5rem}
.hero-en{font-family:var(--serif-en);letter-spacing:.3em;color:var(--gold);margin:0 0 1rem;font-size:1rem}
.hero-title{
  font-family:var(--serif-jp);font-weight:400;
  font-size:clamp(2rem,5vw,3.2rem);
  line-height:1.5;margin:0 0 1.2rem;color:var(--ink);
}
.hero-lead{font-size:1.02rem;color:var(--ink-soft);margin:0 0 2rem;line-height:2}
.hero-cta{display:flex;gap:1rem;flex-wrap:wrap}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.85rem 1.6rem;border-radius:999px;
  font-size:.95rem;letter-spacing:.08em;font-family:var(--serif-jp);
  transition:transform .2s, box-shadow .2s, background .2s, color .2s;
  border:1px solid transparent;cursor:pointer;
}
.btn-primary{background:var(--accent);color:#fff;box-shadow:var(--shadow)}
.btn-primary:hover{background:var(--accent-dark);opacity:1;transform:translateY(-1px)}
.btn-outline{
  border-color:var(--accent);
  color:var(--accent-dark);
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(4px);
  box-shadow:var(--shadow);
}
.btn-outline:hover{background:var(--accent);color:#fff;opacity:1;border-color:var(--accent)}
.btn-line{background:var(--line-green);color:#fff;box-shadow:var(--shadow)}
.btn-line:hover{opacity:1;filter:brightness(.95)}
.btn-ig{
  color:#fff;
  background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
  box-shadow:var(--shadow);
}
.btn-ig:hover{opacity:.95;filter:brightness(1.02)}

/* Icons (pure CSS/SVG masks would need images; use inline unicode as decorative) */
.ico{width:1.1em;height:1.1em;display:inline-block;background:currentColor;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:contain;mask-size:contain;
}
.ico-line{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 3C6.48 3 2 6.7 2 11.2c0 2.9 2.02 5.44 5.06 6.9-.14.5-.87 3-.99 3.47 0 0-.02.15.08.2.1.05.22.01.22.01.31-.04 3.53-2.31 4.1-2.7.5.07 1.02.12 1.53.12 5.52 0 10-3.7 10-8.2C22 6.7 17.52 3 12 3z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 3C6.48 3 2 6.7 2 11.2c0 2.9 2.02 5.44 5.06 6.9-.14.5-.87 3-.99 3.47 0 0-.02.15.08.2.1.05.22.01.22.01.31-.04 3.53-2.31 4.1-2.7.5.07 1.02.12 1.53.12 5.52 0 10-3.7 10-8.2C22 6.7 17.52 3 12 3z'/></svg>");
}
.ico-ig{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='18' height='18' rx='5'/><circle cx='12' cy='12' r='4'/><circle cx='17.5' cy='6.5' r='1' fill='black'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='18' height='18' rx='5'/><circle cx='12' cy='12' r='4'/><circle cx='17.5' cy='6.5' r='1' fill='black'/></svg>");
}

/* Sections */
.section{padding:5.5rem 0}
.section-alt{background:var(--bg-alt)}
.section-en{font-family:var(--serif-en);letter-spacing:.3em;color:var(--gold);margin:0 0 .5rem;text-align:center;font-size:.95rem}
.section-title{
  text-align:center;font-family:var(--serif-jp);font-weight:400;
  font-size:clamp(1.5rem,3.4vw,2rem);margin:0 0 2.5rem;line-height:1.6;
  position:relative;
}
.section-title::after{
  content:"";display:block;width:38px;height:1px;background:var(--gold);
  margin:1.2rem auto 0;
}
.lead{font-size:1rem;line-height:2.1;color:var(--ink-soft);margin:0 0 1.2rem}

/* Concept */
.concept-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;align-items:center;max-width:1040px;margin-inline:auto}
.concept-text .section-en,.concept-text .concept-title{text-align:left}
.concept-text .section-title::after{margin-left:0}
.concept-figure{margin:0}
.concept-figure img{
  width:100%;height:auto;
  border-radius:var(--radius);box-shadow:var(--shadow);
  object-fit:cover;display:block;
}
@media (max-width:720px){
  .concept-grid{grid-template-columns:1fr;gap:2rem}
  .concept-text .section-en,.concept-text .concept-title{text-align:center}
  .concept-text .section-title::after{margin-left:auto}
  .concept-figure{order:-1}
}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}
.card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.card-media{aspect-ratio:4/3;overflow:hidden;background:var(--bg-alt)}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.card:hover .card-media img{transform:scale(1.04)}
.card-body{padding:1.6rem 1.5rem 1.8rem}
.card-title{font-family:var(--serif-jp);font-weight:500;font-size:1.2rem;margin:0 0 .8rem;letter-spacing:.05em}
.card-body p{margin:0;color:var(--ink-soft);font-size:.95rem;line-height:1.9}
.menu-note{text-align:center;margin-top:2.5rem;color:var(--ink-soft);font-size:.9rem}

/* Access */
.access-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:2.5rem;align-items:start}
@media (max-width:720px){.access-grid{grid-template-columns:1fr}}
.access-info{margin:0;background:#fff;padding:1.8rem 2rem;border-radius:var(--radius);box-shadow:var(--shadow)}
.access-info dt{font-family:var(--serif-en);letter-spacing:.2em;color:var(--gold);font-size:.85rem;margin-top:1rem}
.access-info dt:first-child{margin-top:0}
.access-info dd{margin:.4rem 0 0;color:var(--ink);line-height:1.8;font-size:.95rem}
.access-map{aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#eee}
.access-map iframe{width:100%;height:100%;border:0;display:block}

/* SNS */
.sns-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin:2rem 0 1.5rem}
.tel-line{color:var(--ink-soft);font-size:.95rem;margin-top:1.5rem}
.tel-line a{color:var(--ink);font-family:var(--serif-en);font-size:1.1rem;letter-spacing:.05em}

/* Footer */
.site-footer{background:#2f2e29;color:#dcd8ce;padding:2.5rem 0;text-align:center}
.footer-brand{font-family:var(--serif-en);letter-spacing:.3em;font-size:1.2rem;margin:0 0 .6rem}
.footer-addr{font-size:.85rem;color:#a9a49a;margin:0 0 1rem}
.footer-copy{font-family:var(--serif-en);font-size:.8rem;color:#8b867d;margin:0;letter-spacing:.15em}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;scroll-behavior:auto!important;animation:none!important}
}
