:root{
  --cream:#f7f0e4;
  --cream-2:#f0e5d3;
  --paper:#fdf9f1;
  --ink:#3b3127;
  --ink-2:#7c6b58;
  --ink-3:#a8977f;
  --amber:#c9812a;
  --line:rgba(59,49,39,.13);
  --shadow:0 18px 40px -26px rgba(59,49,39,.5);
  --serif:'Gowun Batang','Nanum Myeongjo','Noto Serif KR',Batang,AppleMyungjo,serif;
  --sans:'Noto Sans KR',Pretendard,'Malgun Gothic','Apple SD Gothic Neo',system-ui,sans-serif;
  --gut:20px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--cream);color:var(--ink);
  font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.85;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;word-break:keep-all;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol,dl,dd{margin:0;padding:0;list-style:none}
h1,h2,p{margin:0}
.en{font-family:var(--sans);letter-spacing:.34em;text-transform:uppercase}

/* ── 상단 바 ───────────────────────── */
.bar{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;gap:18px;
  padding:0 var(--gut);height:56px;
  background:rgba(247,240,228,.78);
  -webkit-backdrop-filter:saturate(1.2) blur(14px);
  backdrop-filter:saturate(1.2) blur(14px);
  border-bottom:1px solid transparent;
  transform:translateY(-100%);transition:transform .45s ease,border-color .45s ease;
}
.bar.on{transform:none;border-bottom-color:var(--line)}
.bar-logo{font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:.06em}
.bar-nav{display:flex;gap:20px;margin-left:auto;font-size:13.5px;color:var(--ink-2)}
.bar-nav a:hover{color:var(--ink)}
.bar-cta{
  font-size:13px;padding:7px 15px;border-radius:99px;
  border:1px solid var(--line);background:var(--paper);white-space:nowrap;
}
.bar-cta:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
@media (max-width:640px){
  .bar-nav{display:none}
  .bar-cta{margin-left:auto}
}

/* ── 1. 진입 ───────────────────────── */
.hero{position:relative;height:100svh;min-height:520px;display:grid;place-items:center;overflow:hidden}
.hero-img{position:absolute;inset:0}
.hero-img img{width:100%;height:100%;object-fit:cover}
.hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg,var(--cream) 0%,rgba(247,240,228,.1) 26%,rgba(247,240,228,0) 42%),
    linear-gradient(0deg,var(--cream) 0%,rgba(247,240,228,.86) 22%,rgba(247,240,228,0) 58%),
    radial-gradient(58% 42% at 50% 62%,rgba(247,240,228,.72),rgba(247,240,228,0) 70%);
}
.hero-in{position:relative;z-index:2;text-align:center;padding:0 var(--gut);transform:translateY(11vh)}
.logo{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(58px,15vw,104px);line-height:1;letter-spacing:.1em;
  text-indent:.1em;
  text-shadow:0 2px 26px rgba(247,240,228,.95),0 1px 3px rgba(247,240,228,.9);
}
.hero-in .en{margin-top:16px;font-size:clamp(10px,2.6vw,12px);color:var(--ink-2)}
.addr{margin-top:34px;font-size:15px;line-height:2.1;color:var(--ink-2)}
.addr span{font-size:13.5px;color:var(--ink-3)}
.scroll{
  position:absolute;left:50%;bottom:34px;z-index:2;
  width:1px;height:46px;background:linear-gradient(180deg,transparent,var(--ink-3));
  animation:sc 2.4s ease-in-out infinite;
}
@keyframes sc{0%,100%{opacity:.25;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}

/* ── 공통 ──────────────────────────── */
section{padding:clamp(56px,8vw,96px) var(--gut);max-width:1040px;margin:0 auto}
.head{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(23px,4.4vw,29px);letter-spacing:.08em;
  display:flex;align-items:baseline;gap:14px;margin-bottom:34px;
}
.head .en{font-size:10.5px;color:var(--ink-3);font-weight:300;letter-spacing:.3em}

/* ── 2. 오늘 ───────────────────────── */
.today{padding-top:clamp(40px,7vw,64px)}
.today-card{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  align-items:stretch;gap:0;overflow:hidden;
  background:var(--paper);border:1px solid var(--line);border-radius:3px;box-shadow:var(--shadow);
}
.today-img{margin:0}
.today-img img{width:100%;height:100%;object-fit:cover;min-height:240px}
.today-txt{padding:clamp(28px,5vw,44px);display:flex;flex-direction:column;justify-content:center}
.label{font-size:10.5px;letter-spacing:.3em;color:var(--ink-3)}
.state{font-family:var(--serif);font-weight:700;font-size:clamp(21px,4.2vw,27px);margin-top:12px;line-height:1.5}
.bread{margin-top:20px;font-size:15px;color:var(--ink-2)}
.bread b{font-weight:500;color:var(--ink);border-bottom:1px solid var(--amber);padding-bottom:1px}
.stamp{margin-top:22px;font-size:12px;color:var(--ink-3)}
@media (max-width:720px){
  .today-card{grid-template-columns:1fr}
  .today-img img{min-height:200px;max-height:38vh}
}

/* ── 3. 메뉴 ───────────────────────── */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:clamp(20px,3.4vw,34px)}
.grid li{position:relative}
.grid img{
  width:100%;aspect-ratio:1;object-fit:cover;border-radius:2px;
  background:var(--cream-2);
}
.grid .nm{margin-top:12px;font-size:15px;font-weight:400}
.grid .pr{font-size:13.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.grid .sub{font-size:12px;color:var(--ink-3);margin-top:2px}
.grid .soldout img{filter:grayscale(.55) opacity(.55)}
.grid .tag{
  position:absolute;top:9px;left:9px;z-index:2;
  font-size:11px;letter-spacing:.06em;padding:3px 9px;border-radius:99px;
  background:rgba(59,49,39,.82);color:var(--paper);
}
.grid .noimg img{display:none}
.grid .noimg{padding-top:0}
.grid .noimg::before{
  content:'';display:block;width:100%;aspect-ratio:1;border-radius:2px;
  background:repeating-linear-gradient(135deg,var(--cream-2) 0 9px,var(--paper) 9px 18px);
}
.special{
  margin-top:clamp(34px,6vw,54px);display:flex;align-items:center;gap:clamp(18px,3vw,28px);
  padding:clamp(18px,3vw,26px);border:1px solid var(--line);border-radius:3px;
  background:linear-gradient(100deg,var(--paper),#fbf3e4);
}
.special img{width:clamp(88px,17vw,124px);aspect-ratio:1;object-fit:cover;border-radius:2px;flex:none}
.special .nm{font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:.04em}
.special .sub{margin-top:6px;font-size:13.5px;color:var(--ink-2)}

/* ── 4. 가게 ───────────────────────── */
.shop{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:clamp(30px,6vw,64px);align-items:center}
.shop-img{margin:0}
.shop-img img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 10%;border-radius:2px;box-shadow:var(--shadow)}
.shop dl{display:grid;grid-template-columns:52px 1fr;gap:10px 18px;font-size:15px}
.shop dt{color:var(--ink-3);font-size:13px;padding-top:2px}
.shop dd{color:var(--ink-2)}
@media (max-width:720px){.shop{grid-template-columns:1fr}.shop-img{order:2}}

/* ── 5. 소식 ───────────────────────── */
.feed{border-top:1px solid var(--line)}
.feed li{display:flex;align-items:center;gap:clamp(16px,3vw,26px);padding:18px 0;border-bottom:1px solid var(--line)}
.feed img{width:clamp(64px,13vw,84px);aspect-ratio:1;object-fit:cover;object-position:center 16%;border-radius:2px;flex:none}
.feed .dt{font-size:12px;letter-spacing:.06em;color:var(--ink-3)}
.feed div p+p{margin-top:3px;font-size:15px}

/* ── 6. 방명록 ─────────────────────── */
.guest ul{display:grid;gap:14px}
.guest li{
  font-family:var(--serif);font-size:clamp(16px,3vw,19px);line-height:1.9;color:var(--ink-2);
  padding-left:20px;border-left:2px solid var(--cream-2);
}

/* ── 7. 하단 ───────────────────────── */
.visit{position:relative;max-width:none;padding-left:0;padding-right:0;overflow:hidden}
.visit-img{position:absolute;inset:0}
.visit-img img{width:100%;height:100%;object-fit:cover}
.visit::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--cream),rgba(247,240,228,.42) 42%,rgba(247,240,228,.55) 70%,var(--cream))}
.visit-in{
  position:relative;z-index:2;max-width:1040px;margin:0 auto;padding:0 var(--gut);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;
}
.box{
  background:rgba(253,249,241,.82);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:1px solid var(--line);border-radius:3px;
  padding:clamp(26px,4.4vw,38px);box-shadow:var(--shadow);
}
.box .nm{font-family:var(--serif);font-weight:700;font-size:clamp(19px,3.6vw,23px);letter-spacing:.04em}
.box .sub{margin-top:10px;font-size:14px;color:var(--ink-2);line-height:1.8}
.btn{
  display:inline-block;margin-top:24px;padding:12px 26px;border-radius:99px;
  background:var(--ink);color:var(--paper);font-size:14px;letter-spacing:.02em;
  transition:background .2s ease,transform .2s ease;
}
.btn:hover{background:var(--amber);transform:translateY(-1px)}

.foot{padding:40px var(--gut) 56px;text-align:center;font-size:12.5px;color:var(--ink-3);border-top:1px solid var(--line)}

/* ── 등장 ──────────────────────────── */
.rv{opacity:0;transform:translateY(16px);transition:opacity .8s ease,transform .8s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .scroll{animation:none}
}
