@charset "UTF-8";
/* 炭火焼肉 燠火 — 架空店舗のサイト（ポートフォリオ用） */

:root{
  --sumi:#14110F;        /* 墨（濃色ベース） */
  --sumi-2:#1C1815;      /* 墨のカード面 */
  --kinari:#F5F0E6;      /* 生成り（明色ブロック） */
  --shu:#C7522A;         /* 炭火の朱 */
  --kin:#C0A167;         /* 金（濃色地の数字・ラベル） */
  --kin-d:#8C6B2F;       /* 金（明色地の数字・記号） */
  --ink:#14110F;         /* 明色地の文字 */
  --ink-2:#5B534A;       /* 明色地の副文字 */
  --paper:#F5F0E6;       /* 濃色地の文字 */
  --paper-2:#A9A096;     /* 濃色地の副文字 */
  --line-d:rgba(245,240,230,.18);
  --line-l:rgba(20,17,15,.16);
  --sans:"Noto Sans JP",-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --en:"Cormorant Garamond","Times New Roman",serif;
  --pad:clamp(1.25rem,5vw,4.5rem);
  --sec:clamp(4rem,11vw,11rem);   /* 大きい節間 176px */
  --sec-s:clamp(3rem,7vw,8rem);   /* 小さい節間 128px */
  --max:1240px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--sumi);color:var(--paper);
  font-family:var(--sans);font-size:1rem;font-weight:400;line-height:1.95;
  letter-spacing:.04em;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.35;letter-spacing:.06em;margin:0}
p,dd,li,figcaption{margin:0;text-wrap:pretty}
ul,ol,dl,dd{margin:0;padding:0}
li{list-style:none}
button{font:inherit;color:inherit}

.label{
  font-family:var(--en);font-size:.875rem;font-weight:500;
  letter-spacing:.42em;color:var(--kin);margin:0 0 1.1rem;text-transform:uppercase;
}

/* ---------- ヘッダー ---------- */
.hd{background:transparent;padding-block:1.1rem;isolation:isolate}
/* 上端では背景写真に文字が溶けるので、薄い墨を敷いて分離する */
.hd:not(.is-scrolled)::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,17,15,.78),rgba(20,17,15,0));
}
/* motion.css の既定（白地）を上書きする。詳細度を上げないと白地×白文字になる */
.hd[data-motion="scroll-header"].is-scrolled{
  background:rgba(20,17,15,.95);backdrop-filter:blur(8px);
  box-shadow:none;border-bottom:1px solid var(--line-d);padding-block:.55rem;
}
.hd[data-motion="scroll-header"].is-scrolled .logo__ja{font-size:1rem}
.hd__inner{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);
  display:flex;align-items:center;gap:1.5rem;
}
.logo{text-decoration:none;display:flex;align-items:center;gap:.7rem;margin-right:auto}
.logo__mark{width:2rem;height:2rem;color:var(--kin);flex:none}
.logo__ja{display:block;font-family:var(--serif);font-size:1.125rem;font-weight:500;letter-spacing:.14em}
.logo__en{display:block;font-family:var(--en);font-size:.625rem;letter-spacing:.3em;color:var(--paper-2);margin-top:.15rem}
.hd__nav{display:none}
.hd__tel{display:none}
/* 予約ボタンは、ヘッダーもヒーローも同じ「朱の塗り」で統一する */
.hd__tel-label{
  display:inline-block;font-size:.6875rem;letter-spacing:.24em;
  background:var(--shu);border:1px solid var(--shu);color:#fff;
  padding:.28rem .8rem;margin-right:.7rem;
}
.hd__tel-num{font-family:var(--en);font-size:1.25rem;letter-spacing:.06em}

.nav-toggle{
  width:2.75rem;height:2.75rem;border:1px solid var(--line-d);background:transparent;
  display:grid;place-content:center;gap:.32rem;cursor:pointer;padding:0;
}
.nav-toggle span{display:block;width:1.15rem;height:1px;background:var(--paper);transition:transform .3s,opacity .3s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(.41rem) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-.41rem) rotate(-45deg)}

.drawer{
  position:fixed;inset:0;z-index:99;background:var(--sumi);
  display:flex;flex-direction:column;justify-content:center;
  padding:5rem var(--pad) 3rem;
}
.drawer__list li+li{border-top:1px solid var(--line-d)}
.drawer__list a{
  display:block;padding:1.05rem 0;text-decoration:none;
  font-family:var(--serif);font-size:1.375rem;letter-spacing:.1em;
}
.drawer__tel{
  margin-top:2.5rem;font-family:var(--en);font-size:2rem;letter-spacing:.05em;
  color:var(--kin);text-decoration:none;display:block;
}
.drawer__tel span{display:block;font-family:var(--sans);font-size:.75rem;letter-spacing:.16em;color:var(--paper-2)}

/* ---------- ヒーロー ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;margin-top:-5.2rem}
.hero__media{position:absolute;inset:0}
.hero__media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(20,17,15,.72) 0%,rgba(20,17,15,.42) 38%,rgba(20,17,15,.92) 100%);
}
.hero__img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  animation:heroFade 21s infinite;
}
.hero__img.is-a{animation-delay:0s;opacity:1}
.hero__img.is-b{animation-delay:7s}
.hero__img.is-c{animation-delay:14s}
@keyframes heroFade{
  0%{opacity:0}4%{opacity:1}28%{opacity:1}34%{opacity:0}100%{opacity:0}
}
.hero__body{position:relative;width:100%;max-width:var(--max);margin-inline:auto;padding:9rem var(--pad) 4.5rem}
.hero__eyebrow{
  font-size:.75rem;letter-spacing:.28em;color:var(--kin);
  padding-left:2.6rem;position:relative;margin-bottom:1.4rem;
}
.hero__eyebrow::before{content:"";position:absolute;left:0;top:.7em;width:2rem;height:1px;background:var(--kin)}
.hero__title{font-size:clamp(2.5rem,5.3vw,4.75rem);letter-spacing:.1em;font-weight:500;margin-bottom:1.6rem}
.hero__lead{
  font-family:var(--serif);font-size:clamp(1.25rem,2.4vw,1.875rem);
  line-height:1.75;letter-spacing:.08em;margin-bottom:1rem;
}
.hero__actions{display:flex;flex-wrap:wrap;gap:1rem 1.75rem;align-items:center;margin:2.6rem 0}
.hero__meta{
  display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:.75rem 2rem;
  background:rgba(20,17,15,.62);backdrop-filter:blur(3px);
  border-left:2px solid var(--shu);padding:1.15rem 1.4rem;max-width:40rem;
}
.hero__meta div{display:flex;gap:.9rem;align-items:baseline}
.hero__meta dt{font-size:.6875rem;letter-spacing:.2em;color:var(--kin);flex:none;width:2.6rem}
.hero__meta dd{font-size:.8125rem;letter-spacing:.06em;color:var(--paper);line-height:1.6}
.hero__scroll{
  display:none;position:absolute;right:calc(var(--pad) - .4rem);bottom:0;
  writing-mode:vertical-rl;font-family:var(--en);font-size:.75rem;letter-spacing:.4em;
  color:var(--paper-2);padding-bottom:5.5rem;
}
.hero__scroll::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:4.5rem;background:linear-gradient(var(--kin),transparent)}

/* ---------- ボタン ---------- */
.btn{
  display:inline-block;text-decoration:none;font-size:.875rem;letter-spacing:.18em;
  padding:1.05rem 2.4rem;border:1px solid transparent;text-align:center;
}
.btn--fill{background:var(--shu);color:#fff;font-weight:500}
.btn--fill:hover{background:#9E3A17}
.btn--line{border-color:var(--line-d);color:var(--paper);background:transparent;background-image:none}
.btn--line:hover{border-color:var(--kin);color:var(--kin)}
/* ヘッダーの予約ボタンは、カーソルで色が反転する */
.hd__tel:hover .hd__tel-label{background:#9E3A17;border-color:#9E3A17}
.hd__tel:hover .hd__tel-num{color:var(--kin)}
.hd__tel-label,.hd__tel-num{transition:background-color .3s,color .3s}
.btn--submit{width:100%;border:0;cursor:pointer;padding-block:1.15rem}

/* ---------- 共通の見出し ---------- */
.sec-head{max-width:var(--max);margin:0 auto var(--sec-s);padding-inline:var(--pad)}
.sec-head--center{text-align:center}
.sec-head--center .sec-head__lead{margin-inline:auto}
.sec-head__ja{font-size:clamp(1.75rem,3.4vw,2.75rem);letter-spacing:.12em;margin-bottom:1.2rem}
.sec-head__lead{font-size:.9375rem;line-height:2.1;max-width:38rem;color:var(--paper-2)}

/* 明色ブロック内の見出し色 */
.light .sec-head__lead,.light .label+.sec-head__ja{color:inherit}

/* ---------- 店主より ---------- */
.message{
  max-width:var(--max);margin-inline:auto;padding:var(--sec) var(--pad);
  display:grid;gap:3rem;
}
.message__head{font-size:clamp(1.625rem,3.2vw,2.5rem);margin-bottom:2rem;letter-spacing:.1em}
.message__text p{margin-bottom:1.5rem;font-size:.9375rem;line-height:2.25;color:#DCD5CA}
.message__sign{font-family:var(--serif);font-size:1.0625rem;letter-spacing:.14em;color:var(--paper);margin-top:2.2rem!important}
.message__fig figcaption{font-size:.75rem;letter-spacing:.1em;color:var(--paper-2);margin-top:.9rem}

/* ---------- 数値 ---------- */
.stats{border-block:1px solid var(--line-d)}
.stats__list{
  max-width:var(--max);margin-inline:auto;padding:clamp(2.5rem,5vw,4rem) var(--pad);
  display:grid;grid-template-columns:repeat(2,1fr);gap:2.5rem 1rem;
}
.stats__num{
  display:block;font-family:var(--en);font-size:clamp(2.5rem,5vw,3.75rem);
  font-weight:500;line-height:1;color:var(--kin);letter-spacing:.02em;
}
.stats__cap{display:block;font-size:.75rem;letter-spacing:.1em;color:var(--paper-2);margin-top:.9rem;line-height:1.7}

/* ---------- 燠火の三つ ---------- */
/* 明色ブロックでは、朱は「押せるもの」だけに使う（ラベル・数字は金／墨） */
.about .label,.course .label,.flow .label,.access .label{color:var(--ink-2)}

.about{background:var(--kinari);color:var(--ink);padding-block:var(--sec)}
.about .sec-head__lead{color:var(--ink-2)}
.tri{
  max-width:var(--max);margin:0 auto var(--sec-s);padding-inline:var(--pad);
  display:grid;gap:2.2rem;
}
.tri:last-child{margin-bottom:0}
.tri__no{
  font-family:var(--serif);font-size:1.5rem;color:var(--kin-d);letter-spacing:.2em;
  margin-bottom:.7rem;
}
.tri__head{font-size:clamp(1.25rem,2.6vw,1.875rem);margin-bottom:1.2rem;letter-spacing:.08em}
.tri__body p{font-size:.9375rem;line-height:2.15;color:var(--ink-2)}
.tri__list{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.tri__list li{
  font-size:.75rem;letter-spacing:.12em;border:1px solid var(--line-l);
  padding:.4rem .9rem;color:var(--ink);
}
.tri__fig img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tri__fig--arch img{aspect-ratio:3/4;border-radius:14rem 14rem 0 0}

/* ---------- お品書き ---------- */
.menu{padding-block:var(--sec)}
.menu__grid{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);
  display:grid;grid-template-columns:repeat(2,1fr);gap:2rem 1.25rem;
}
.dish{margin:0;display:block;background:var(--sumi-2)}
.dish img{width:100%;aspect-ratio:1/1;object-fit:cover}
.dish figcaption{padding:1.15rem 1.1rem 1.4rem;display:block}
.dish__name{display:block;font-family:var(--serif);font-size:1rem;letter-spacing:.08em;line-height:1.6}
.dish__price{display:block;font-family:var(--en);font-size:1.375rem;color:var(--kin);margin-top:.35rem;letter-spacing:.03em}
.dish__note{display:block;font-size:.75rem;line-height:1.85;color:var(--paper-2);margin-top:.7rem}
.menu__note{
  max-width:var(--max);margin:2.6rem auto 0;padding-inline:var(--pad);
  font-size:.8125rem;color:var(--paper-2);letter-spacing:.06em;
}
.menu__note a{color:var(--kin)}

/* ---------- コース ---------- */
.course{background:var(--kinari);color:var(--ink);padding-block:var(--sec)}
.course .sec-head__lead{color:var(--ink-2)}
.course__fig{max-width:var(--max);margin:0 auto clamp(2rem,4vw,3.5rem);padding-inline:var(--pad)}
.course__fig img{width:100%;aspect-ratio:16/9;object-fit:cover}
@media (min-width:768px){
  .course__fig img{aspect-ratio:24/9}
}
.course__fig figcaption{font-size:.75rem;color:var(--ink-2);margin-top:.9rem;letter-spacing:.08em}
.course__wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.course__yomi{display:block;font-family:var(--sans);font-size:.6875rem;letter-spacing:.16em;color:var(--ink-2);margin-top:.35rem}
.course__for{
  display:inline-block;font-family:var(--sans);font-size:.6875rem;font-weight:400;
  letter-spacing:.12em;color:var(--ink-2);border:1px solid var(--line-l);
  padding:.15rem .6rem;margin-top:.9rem;white-space:normal;
}
.course__for--rec{background:var(--ink);border-color:var(--ink);color:var(--kinari)}
.course__table tbody tr.is-rec{background:rgba(20,17,15,.045)}
.course__table tbody tr.is-rec .course__price{font-size:2rem}
.course__table{width:100%;border-collapse:collapse;font-size:.875rem;text-align:left}
.course__table caption{
  text-align:left;font-size:.75rem;letter-spacing:.16em;color:var(--ink-2);
  padding-bottom:1rem;border-bottom:1px solid var(--ink);
}
.course__table th,.course__table td{padding:1.4rem .9rem;border-bottom:1px solid var(--line-l);vertical-align:top;line-height:1.85}
.course__table thead th{
  font-family:var(--sans);font-weight:500;font-size:.6875rem;letter-spacing:.2em;
  color:var(--ink-2);padding-block:1rem;
}
.course__table tbody th{font-family:var(--serif);font-size:1.25rem;font-weight:500;letter-spacing:.1em;white-space:nowrap}
.course__table tbody th span{display:block;font-family:var(--sans);font-size:.6875rem;letter-spacing:.16em;color:var(--ink-2);margin-top:.35rem}
.course__price{font-family:var(--en);font-size:1.75rem;color:var(--ink);white-space:nowrap}
.course__time{font-size:.75rem;color:var(--ink-2);letter-spacing:.1em}
/* スマホでは表を1コースずつのかたまりに組み替える（横スクロールさせない） */
@media (max-width:767px){
  .course__table,.course__table caption,.course__table tbody,
  .course__table tr,.course__table th,.course__table td{display:block;width:100%}
  .course__table thead{display:none}
  .course__table tbody tr{padding:1.6rem 0;border-bottom:1px solid var(--line-l)}
  .course__table tbody th{padding:0 0 1rem;border:0;font-size:1.375rem}
  .course__table td{padding:.55rem 0;border:0}
  .course__table td::before{
    content:attr(data-label);display:block;font-size:.6875rem;letter-spacing:.18em;
    color:var(--ink-2);margin-bottom:.2rem;
  }
  .course__price::before{margin-bottom:0!important}
}

.course__opt{margin-top:2.4rem;display:grid;gap:.9rem}
.course__opt li{font-size:.8125rem;color:var(--ink-2);padding-left:1.2rem;position:relative;line-height:1.9}
.course__opt li::before{content:"";position:absolute;left:0;top:.85em;width:.5rem;height:1px;background:var(--kin-d)}
.course__opt strong{font-weight:500;color:var(--ink);margin-right:.7rem}

/* ---------- 席 ---------- */
.seat{padding-block:var(--sec)}
.seat__grid{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);
  display:grid;gap:2rem;
}
.seat__card{background:var(--sumi-2);display:block}
.seat__card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.seat__body{padding:1.5rem 1.4rem 1.8rem}
.seat__body h3{font-size:1.25rem;letter-spacing:.1em;display:flex;align-items:baseline;gap:.9rem;margin-bottom:.9rem}
.seat__body h3 span{font-family:var(--en);font-size:1rem;color:var(--kin);letter-spacing:.06em}
.seat__body p{font-size:.8125rem;line-height:2;color:var(--paper-2)}

/* ---------- 流れ ---------- */
.flow{background:var(--kinari);color:var(--ink);padding-block:var(--sec)}
.flow .sec-head__lead{color:var(--ink-2)}
.flow__list{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);
  display:grid;gap:0;
}
.flow__list li{padding:1.9rem 0;border-top:1px solid var(--line-l);display:grid;gap:.6rem}
.flow__list li:last-child{border-bottom:1px solid var(--line-l)}
.flow__no{font-family:var(--en);font-size:1.75rem;color:var(--kin-d);line-height:1}
.flow__list h3{font-size:1.125rem;letter-spacing:.1em}
.flow__list p{font-size:.8125rem;line-height:2;color:var(--ink-2)}

/* ---------- お知らせ ---------- */
.news{padding-block:var(--sec-s)}
.news__inner{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);display:grid;gap:2.5rem}
.news__list div{padding:1.4rem 0;border-top:1px solid var(--line-d)}
.news__list div:last-child{border-bottom:1px solid var(--line-d)}
.news__list dt{display:flex;align-items:center;gap:1rem;margin-bottom:.6rem}
.news__list time{font-family:var(--en);font-size:1rem;letter-spacing:.08em;color:var(--kin)}
.news__tag{font-size:.6875rem;letter-spacing:.14em;border:1px solid var(--line-d);padding:.1rem .6rem;color:var(--paper-2)}
.news__list dd{font-size:.875rem;line-height:2;color:#DCD5CA}

/* ---------- アクセス・予約 ---------- */
.access{background:var(--kinari);color:var(--ink);padding-block:var(--sec)}
.access__cols{margin-top:var(--sec-s)}
.access .sec-head__lead{color:var(--ink-2)}
.access__cols{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);display:grid;gap:2.5rem}
.access__fig figcaption{font-size:.75rem;color:var(--ink-2);margin-top:.9rem;letter-spacing:.08em}
.info div{display:grid;grid-template-columns:5.5rem 1fr;gap:1rem;padding:.95rem 0;border-bottom:1px solid var(--line-l)}
.info div:first-child{border-top:1px solid var(--line-l)}
.info dt{font-size:.75rem;letter-spacing:.14em;color:var(--ink-2);padding-top:.25rem}
.info dd{font-size:.875rem;line-height:1.9}
.info a{color:var(--shu)}

.faq{max-width:var(--max);margin:var(--sec-s) auto 0;padding-inline:var(--pad)}
.faq__head{font-size:1.375rem;letter-spacing:.1em;margin-bottom:1.6rem}
.faq details{border-top:1px solid var(--line-l)}
.faq details:last-of-type{border-bottom:1px solid var(--line-l)}
.faq summary{
  cursor:pointer;list-style:none;padding:1.25rem 2.5rem 1.25rem 1.6rem;
  font-size:.9375rem;letter-spacing:.06em;position:relative;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";position:absolute;left:0;font-family:var(--en);font-size:1rem;color:var(--kin-d)}
.faq summary::after{
  content:"";position:absolute;right:.5rem;top:1.75rem;width:.75rem;height:1px;
  background:var(--ink);transition:transform .3s;
}
.faq details[open] summary::after{transform:rotate(90deg)}
.faq details p{padding:0 1.6rem 1.5rem;font-size:.8125rem;line-height:2.1;color:var(--ink-2)}

/* 予約ブロックだけ濃色に落とし、写真を敷いて“夜の店”に戻す */
.reserve{
  max-width:var(--max);margin:var(--sec-s) auto 0;
  padding:clamp(2.5rem,6vw,4.25rem) var(--pad);
  display:grid;gap:2.5rem;position:relative;isolation:isolate;
  background:var(--sumi);color:var(--paper);
}
.reserve::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:url("/assets/img/reserve-bg.webp") center/cover no-repeat;opacity:.34;
}
.reserve .label{color:var(--kin)}
.reserve__lead h3{font-size:1.75rem;letter-spacing:.1em;margin-bottom:1.2rem}
.reserve__lead p{font-size:.8125rem;line-height:2.1;color:#CFC7BB}
.reserve__tel{
  display:inline-block;font-family:var(--en);font-size:clamp(2.25rem,5vw,3.25rem);
  letter-spacing:.04em;color:var(--paper);text-decoration:none;margin-top:1.6rem;
  border-bottom:2px solid var(--shu);padding-bottom:.2rem;
}
.reserve__tel:hover{color:var(--kin);border-bottom-color:var(--kin)}
.reserve__tel-note{margin-top:.9rem!important;font-size:.75rem;letter-spacing:.1em}
.reserve .field label{color:#CFC7BB}
.reserve__form{display:grid;grid-template-columns:repeat(2,1fr);gap:1.1rem}
.field{display:grid;gap:.5rem}
.field--wide{grid-column:1/-1}
.field label{font-size:.75rem;letter-spacing:.14em;color:var(--ink-2)}
.field input,.field select,.field textarea{
  font:inherit;font-size:.875rem;padding:.85rem .9rem;border:1px solid var(--line-l);
  background:#FFFCF6;color:var(--ink);border-radius:0;width:100%;
}
.field textarea{resize:none;min-height:6.5rem}
.reserve__form .btn--submit{grid-column:1/-1;margin-top:.5rem}

/* ---------- フッター ---------- */
.ft{padding:var(--sec-s) 0 2.5rem;border-top:1px solid var(--line-d)}
.ft__inner{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);display:grid;gap:2.5rem}
.ft__mark{width:2.25rem;height:2.25rem;color:var(--kin);margin-bottom:1rem}
.ft__ja{font-family:var(--serif);font-size:1.375rem;letter-spacing:.16em}
.ft__en{font-family:var(--en);font-size:.75rem;letter-spacing:.24em;color:var(--paper-2);line-height:2;margin-top:.6rem}
.ft__addr p{font-size:.8125rem;line-height:2;color:var(--paper-2)}
.ft__addr p+p{margin-top:1rem}
.ft__nav{display:flex;flex-wrap:wrap;gap:1.6rem}
.ft__nav a{font-size:.8125rem;letter-spacing:.12em;text-decoration:none}
.ft__copy{
  max-width:var(--max);margin:3rem auto 0;padding-inline:var(--pad);
  font-size:.6875rem;letter-spacing:.16em;color:var(--paper-2);
}

/* ---------- 動きを減らす設定 ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero__img{animation:none}
  .hero__img.is-a{opacity:1}
  .hero__img.is-b,.hero__img.is-c{opacity:0}
}

/* ---------- 768px以上 ---------- */
@media (min-width:768px){
  .hero__meta{grid-template-columns:repeat(3,minmax(0,1fr));padding:1.4rem 1.8rem}
  .hero__meta div{display:block}
  .hero__meta dt{display:block;margin-bottom:.5rem;width:auto}
  .stats__list{grid-template-columns:repeat(4,1fr)}
  .message{grid-template-columns:1.15fr .85fr;gap:4rem;align-items:center}
  .tri{grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
  .tri--rev .tri__fig{order:2}
  .menu__grid{grid-template-columns:repeat(3,1fr);gap:2.5rem 1.75rem}
  .seat__grid{grid-template-columns:repeat(3,1fr)}
  .flow__list li{grid-template-columns:5rem 14rem 1fr;gap:1.5rem;align-items:baseline}
  .news__inner{grid-template-columns:16rem 1fr;gap:3.5rem}
  .tri{grid-template-columns:1.05fr .95fr}
  .tri--rev{grid-template-columns:.95fr 1.05fr}
  .access__cols{grid-template-columns:.9fr 1.1fr;gap:3.5rem;align-items:start}
  .reserve{grid-template-columns:.85fr 1.15fr;gap:4rem;align-items:start}
  .ft__inner{grid-template-columns:1fr 1fr auto;gap:3rem}
}

/* ---------- 1024px以上 ---------- */
@media (min-width:1024px){
  .hd__nav{display:flex;gap:2rem}
  .hd__nav a{font-size:.8125rem;letter-spacing:.14em;text-decoration:none}
  .hd__tel{display:flex;align-items:center;text-decoration:none}
  .nav-toggle{display:none}
  .drawer{display:none!important}
  .hero__scroll{display:block}
  .seat__card img{aspect-ratio:3/4}
  .message__fig img{aspect-ratio:4/5;object-fit:cover}
}
