/* ===== DESIGNER B: 炭火の迫力 ===== */
/* コンセプト: 写真が全てを語る。炭火の熱と煙を画面から感じさせる。 */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --fire: #c44a1a;
  --fire-bright: #e8722a;
  --ember-dark: #6b2008;
  --black: #080604;
  --off-black: #120c08;
  --charcoal: #1e1410;
  --smoke-white: rgba(255,255,255,0.72);
  --smoke-mid: rgba(255,255,255,0.45);
  --ash: rgba(255,255,255,0.15);
}

html { scroll-behavior: smooth; }
body { font-family: 'Noto Sans JP', sans-serif; color: white; background: var(--black); overflow-x: hidden; }

/* NAV */
nav {
  position: fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 48px; height:68px;
  background: linear-gradient(to bottom, rgba(8,6,4,0.9), transparent);
  transition: background 0.4s;
}
nav.solid { background: rgba(8,6,4,0.97); }
.nav-b-logo { font-family:'Noto Serif JP',serif; font-size:1.3rem; font-weight:300; color:white; text-decoration:none; letter-spacing:0.2em; display:flex; align-items:center; gap:12px; }
.nav-b-logo .fire-dot { width:8px; height:8px; border-radius:50%; background:var(--fire); }
.nav-b-links { display:flex; gap:32px; list-style:none; }
.nav-b-links a { font-size:0.78rem; font-weight:500; letter-spacing:0.08em; color:var(--smoke-white); text-decoration:none; transition:color .3s; }
.nav-b-links a:hover, .nav-b-links a.active { color:var(--fire-bright); }
.nav-b-reserve { font-size:0.75rem; font-weight:700; letter-spacing:0.1em; background:var(--fire); color:white; padding:10px 24px; text-decoration:none; transition:background .3s; }
.nav-b-reserve:hover { background:var(--fire-bright); }
.nav-burger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.nav-burger span { display:block; width:24px; height:1px; background:white; }
.mobile-menu { display:none; position:fixed; inset:0; background:var(--black); z-index:150; flex-direction:column; align-items:center; justify-content:center; gap:28px; }
.mobile-menu.open { display:flex; }
.mobile-menu a { font-size:1.8rem; font-weight:300; color:white; text-decoration:none; letter-spacing:0.15em; }
.mobile-menu .mob-res { font-size:1rem; font-weight:700; background:var(--fire); padding:12px 40px; }

/* HERO: 全画面写真 + 大きな文字 */
.hero-b {
  height:100vh; position:relative;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.hero-b-img {
  position:absolute; inset:0;
  background:url('https://images.unsplash.com/photo-1555939594-58d7cb561ad1?w=1800&auto=format&fit=crop') center/cover;
  transform:scale(1.08);
  animation:bHeroZoom 16s ease-out forwards;
  filter:brightness(0.6);
}
@keyframes bHeroZoom { to { transform:scale(1); } }
.hero-b-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(8,6,4,0.2) 0%, rgba(8,6,4,0.5) 100%);
}
.hero-b-content { position:relative; text-align:center; }
.hero-b-fire-label {
  font-size:0.65rem; font-weight:700; letter-spacing:0.6em;
  color:var(--fire-bright); margin-bottom:24px;
  animation:fadeIn .8s ease both;
}
.hero-b-title {
  font-family:'Noto Serif JP',serif;
  font-size:clamp(4rem,10vw,10rem);
  font-weight:300; letter-spacing:0.25em; line-height:1;
  color:white; margin-bottom:24px;
  animation:fadeIn 1s ease 0.3s both;
  text-shadow:0 4px 40px rgba(0,0,0,0.5);
}
.hero-b-sub {
  font-size:0.82rem; letter-spacing:0.3em; color:var(--smoke-mid);
  animation:fadeIn 1s ease 0.6s both;
  margin-bottom:48px;
}
.hero-b-btns { display:flex; gap:16px; justify-content:center; animation:fadeIn 1s ease 0.9s both; }
@keyframes fadeIn { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }

/* FULL BLEED IMAGE SECTIONS */
.fb-section { position:relative; overflow:hidden; }
.fb-section img { width:100%; display:block; }
.fb-overlay { position:absolute; inset:0; }
.fb-content { position:absolute; bottom:0; left:0; right:0; padding:60px; }

/* SECTION */
.sec-b { padding:100px 0; }
.sec-b.sm { padding:60px 0; }
.container-b { max-width:1160px; margin:0 auto; padding:0 60px; }
.container-b.narrow { max-width:760px; }

/* BG */
.bg-b-black { background:var(--black); }
.bg-b-charcoal { background:var(--charcoal); }
.bg-b-off { background:var(--off-black); }

/* TYPOGRAPHY */
.label-b { font-size:0.6rem; font-weight:700; letter-spacing:0.55em; color:var(--fire-bright); margin-bottom:12px; display:block; text-transform:uppercase; }
.h2-b { font-family:'Noto Serif JP',serif; font-size:clamp(2rem,4vw,4rem); font-weight:300; letter-spacing:0.15em; color:white; line-height:1.3; margin-bottom:32px; }
.body-b { font-size:0.93rem; line-height:2.3; color:var(--smoke-white); font-weight:300; }

/* BUTTONS */
.btn-b-fire { display:inline-block; font-size:0.78rem; font-weight:700; letter-spacing:0.12em; background:var(--fire); color:white; padding:14px 40px; text-decoration:none; transition:background .3s; }
.btn-b-fire:hover { background:var(--fire-bright); }
.btn-b-outline { display:inline-block; font-size:0.78rem; font-weight:500; letter-spacing:0.12em; color:white; border:1px solid var(--ash); padding:13px 36px; text-decoration:none; transition:all .3s; }
.btn-b-outline:hover { border-color:white; background:rgba(255,255,255,0.08); }

/* GRID */
.grid-b-2 { display:grid; grid-template-columns:1fr 1fr; }
.grid-b-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.grid-b-text { padding:80px; display:flex; flex-direction:column; justify-content:center; }

/* MENU CARDS: 写真 + テキストオーバーレイ */
.menu-b-grid { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.menu-b-card { position:relative; overflow:hidden; cursor:pointer; }
.menu-b-card img { width:100%; height:480px; object-fit:cover; display:block; transition:transform .8s; filter:brightness(0.75); }
.menu-b-card:hover img { transform:scale(1.06); filter:brightness(0.6); }
.menu-b-card-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(8,6,4,0.92) 0%, transparent 50%); display:flex; flex-direction:column; justify-content:flex-end; padding:48px; }
.menu-b-card-name { font-family:'Noto Serif JP',serif; font-size:2rem; font-weight:300; color:white; letter-spacing:0.15em; margin-bottom:8px; }
.menu-b-card-price { font-size:0.82rem; font-weight:700; color:var(--fire-bright); letter-spacing:0.12em; }
.menu-b-card-desc { font-size:0.8rem; color:var(--smoke-mid); line-height:1.8; margin-top:10px; }

/* SINGLE MENU */
.single-b-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(255,255,255,0.06); }
.single-b-item { background:var(--off-black); padding:24px 32px; display:flex; justify-content:space-between; align-items:center; transition:background .3s; }
.single-b-item:hover { background:var(--charcoal); }
.single-b-name { font-family:'Noto Serif JP',serif; font-size:1rem; font-weight:300; color:white; letter-spacing:0.1em; }
.single-b-price { font-size:0.85rem; font-weight:700; color:var(--fire-bright); flex-shrink:0; margin-left:20px; }

/* COMMIT */
.commit-b-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.commit-b-card { position:relative; overflow:hidden; height:380px; }
.commit-b-card img { width:100%; height:100%; object-fit:cover; display:block; filter:brightness(0.4); transition:filter .5s; }
.commit-b-card:hover img { filter:brightness(0.3); }
.commit-b-overlay { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:36px; }
.commit-b-num { font-size:3.5rem; font-weight:300; color:var(--fire); opacity:0.4; line-height:1; margin-bottom:8px; }
.commit-b-title { font-family:'Noto Serif JP',serif; font-size:1.3rem; font-weight:300; color:white; letter-spacing:0.15em; margin-bottom:10px; }
.commit-b-body { font-size:0.8rem; color:var(--smoke-mid); line-height:1.9; }

/* ACCESS */
.access-b-table { width:100%; border-collapse:collapse; }
.access-b-table tr { border-bottom:1px solid rgba(255,255,255,0.06); }
.access-b-table td { padding:18px 0; font-size:0.9rem; vertical-align:top; }
.access-b-table td:first-child { width:80px; font-size:0.6rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--fire-bright); }
.access-b-table td:last-child { color:var(--smoke-white); line-height:1.9; }

/* FORM */
.form-b { display:flex; flex-direction:column; gap:16px; }
.row-b-2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-b-group { display:flex; flex-direction:column; gap:8px; }
.form-b-label { font-size:0.6rem; font-weight:700; letter-spacing:0.25em; color:var(--fire-bright); }
.form-b input, .form-b select, .form-b textarea {
  width:100%; padding:15px 18px;
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1);
  color:white; font-family:'Noto Sans JP',sans-serif; font-size:0.88rem;
  transition:border-color .3s;
}
.form-b input:focus, .form-b select:focus, .form-b textarea:focus { outline:none; border-color:var(--fire); }
.form-b input::placeholder, .form-b textarea::placeholder { color:rgba(255,255,255,0.2); }
.form-b select { color:rgba(255,255,255,0.6); }
.form-b option { background:var(--off-black); }
.form-b textarea { height:110px; resize:vertical; }
.form-b-btn { padding:18px; background:var(--fire); color:white; border:none; cursor:pointer; font-size:0.82rem; font-weight:700; letter-spacing:0.12em; transition:background .3s; margin-top:8px; }
.form-b-btn:hover { background:var(--fire-bright); }

/* NEWS */
.news-b-list { display:flex; flex-direction:column; }
.news-b-item { display:flex; gap:24px; align-items:baseline; padding:18px 0; border-bottom:1px solid rgba(255,255,255,0.06); cursor:pointer; }
.news-b-item:first-child { border-top:1px solid rgba(255,255,255,0.06); }
.news-b-date { font-size:0.68rem; color:rgba(255,255,255,0.3); flex-shrink:0; }
.news-b-cat { font-size:0.58rem; font-weight:700; letter-spacing:0.15em; color:var(--fire-bright); border:1px solid rgba(196,74,26,0.4); padding:2px 8px; flex-shrink:0; }
.news-b-title { font-size:0.9rem; color:var(--smoke-white); }
.news-b-item:hover .news-b-title { color:var(--fire-bright); }

/* FOOTER */
.footer-b { background:var(--off-black); border-top:1px solid rgba(255,255,255,0.05); padding:72px 60px 36px; display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px; }
.footer-b-logo { font-family:'Noto Serif JP',serif; font-size:2.5rem; font-weight:300; color:white; letter-spacing:0.2em; display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.footer-b-logo .dot { width:12px; height:12px; border-radius:50%; background:var(--fire); }
.footer-b-info { font-size:0.72rem; color:rgba(255,255,255,0.3); line-height:1.9; }
.footer-b-col h4 { font-size:0.6rem; font-weight:700; letter-spacing:0.35em; text-transform:uppercase; color:var(--fire-bright); margin-bottom:18px; }
.footer-b-col ul { list-style:none; }
.footer-b-col li { margin-bottom:9px; }
.footer-b-col a { font-size:0.75rem; color:rgba(255,255,255,0.35); text-decoration:none; transition:color .3s; }
.footer-b-col a:hover { color:white; }
.footer-b-bottom { border-top:1px solid rgba(255,255,255,0.05); padding:20px 60px; text-align:center; font-size:0.62rem; color:rgba(255,255,255,0.18); }

/* ANIM */
.reveal { opacity:0; transform:translateY(16px); transition:opacity .8s ease, transform .8s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

@media (max-width:900px) {
  nav { padding:0 20px; height:60px; }
  .nav-b-links, .nav-b-reserve { display:none; }
  .nav-burger { display:flex; }
  .grid-b-2, .menu-b-grid, .grid-b-3, .commit-b-grid { grid-template-columns:1fr; }
  .grid-b-text { padding:48px 22px; }
  .single-b-grid { grid-template-columns:1fr; }
  .container-b { padding:0 22px; }
  .sec-b { padding:64px 0; }
  .footer-b { grid-template-columns:1fr; padding:48px 22px 24px; }
  .footer-b-bottom { padding:16px 22px; }
  .row-b-2 { grid-template-columns:1fr; }
}