/* index.css — index.html 固有スタイル */

/* ローディング */
#loading{
  position:fixed;inset:0;background:var(--espresso);
  display:flex;align-items:center;justify-content:center;
  z-index:9999;transition:opacity 0.8s ease,visibility 0.8s ease;
}
#loading.hide{opacity:0;visibility:hidden;pointer-events:none;}
.ld-catch{
  font-family:'Shippori Mincho',serif;font-size:15px;font-weight:400;
  letter-spacing:0.32em;color:var(--gold);text-align:center;
  opacity:0;animation:ldUp 0.8s ease 0.1s forwards;
}
.ld-bar{
  width:0;height:1px;background:rgba(196,169,107,0.4);
  margin:20px auto;animation:ldBar 0.7s ease 0.6s forwards;
}
.ld-kanji{
  font-family:'Shippori Mincho',serif;font-size:60px;font-weight:700;
  color:var(--cream);letter-spacing:0.2em;text-align:center;
  opacity:0;animation:ldUp 0.8s ease 0.9s forwards;
}
@keyframes ldUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
@keyframes ldBar{0%{width:0;}100%{width:100px;}}

/* ヒーロー */
.hero{height:100vh;min-height:680px;position:relative;display:flex;align-items:center;overflow:hidden;}
.hero-bg{
  position:absolute;inset:0;
  background-position:center 35%;background-size:cover;background-repeat:no-repeat;
  transform:scale(1.07);animation:hZoom 9s ease forwards;
}
.hero-ov{
  position:absolute;inset:0;
  background:linear-gradient(140deg,rgba(44,31,21,0.78) 0%,rgba(44,31,21,0.42) 55%,rgba(44,31,21,0.65) 100%);
}
.hero-vline{
  position:absolute;left:64px;top:90px;bottom:90px;width:1px;
  background:linear-gradient(to bottom,transparent,rgba(196,169,107,0.45) 20%,rgba(196,169,107,0.45) 80%,transparent);
}
.hero-body{position:relative;z-index:2;padding-left:108px;max-width:660px;}
.hero-badge{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:12px;letter-spacing:0.42em;color:var(--gold);
  display:flex;align-items:center;gap:14px;margin-bottom:30px;
  opacity:0;animation:hUp 0.9s ease 2s forwards;
}
.hero-badge::before{content:'';width:38px;height:1px;background:var(--gold);}
.hero-ttl-wrap{overflow:hidden;margin-bottom:10px;}
.hero-ttl{
  font-family:'Shippori Mincho',serif;
  font-size:clamp(50px,7.5vw,90px);font-weight:700;
  letter-spacing:0.14em;line-height:1.1;color:var(--cream);display:block;
  opacity:0;transform:translateY(105%);
  animation:hSlide 1.1s cubic-bezier(0.16,1,0.3,1) 2.2s forwards;
}
.hero-sub{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:clamp(18px,2.6vw,30px);font-weight:300;
  letter-spacing:0.22em;color:var(--gold);margin-bottom:36px;
  opacity:0;animation:hUp 0.9s ease 2.7s forwards;
}
.hero-copy{
  font-size:13px;line-height:2.6;letter-spacing:0.08em;
  color:rgba(250,247,242,0.7);margin-bottom:48px;max-width:380px;
  opacity:0;animation:hUp 0.9s ease 2.9s forwards;
}
.hero-btns{display:flex;gap:14px;opacity:0;animation:hUp 0.9s ease 3.1s forwards;}
.btn-ghost{
  font-size:12px;letter-spacing:0.26em;color:var(--cream);
  background:transparent;border:1px solid rgba(255,255,255,0.38);
  padding:15px 40px;text-decoration:none;transition:all 0.3s;
}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);}
.scroll-ind{
  position:absolute;bottom:34px;right:52px;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  opacity:0;animation:fadeIn 1s ease 3.5s forwards;
}
.scroll-ind span{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:10px;letter-spacing:0.35em;color:rgba(250,247,242,0.45);writing-mode:vertical-rl;
}
.scroll-bar{width:1px;height:54px;background:linear-gradient(to bottom,rgba(196,169,107,0.8),transparent);animation:sPulse 2s ease infinite;}

/* ティッカー */
.ticker{background:var(--espresso);overflow:hidden;border-top:1px solid rgba(196,169,107,0.15);}
.ticker-wrap{display:flex;align-items:stretch;}
.ticker-lbl{
  background:var(--gold);padding:13px 28px;
  font-family:'Shippori Mincho',serif;font-size:11px;font-weight:600;
  letter-spacing:0.28em;color:var(--espresso);white-space:nowrap;
  flex-shrink:0;display:flex;align-items:center;
}
.ticker-track{overflow:hidden;flex:1;}
.ticker-row{display:inline-flex;animation:tick 30s linear infinite;white-space:nowrap;}
.ticker-row:hover{animation-play-state:paused;}
.ticker-it{display:inline-flex;align-items:center;gap:12px;padding:13px 52px;border-right:1px solid rgba(255,255,255,0.05);}
.t-date{font-family:'Cormorant Garamond',serif;font-size:11px;letter-spacing:0.18em;color:var(--gold);}
.t-txt a{font-size:12px;letter-spacing:0.06em;color:rgba(250,247,242,0.68);text-decoration:none;transition:color 0.3s;}
.t-txt a:hover{color:var(--gold);}

/* こだわり */
.philosophy{padding:115px 80px;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;max-width:1200px;margin:0 auto;}
.phil-imgs{position:relative;height:500px;}
.phil-main{position:absolute;top:0;right:0;width:84%;height:80%;object-fit:cover;object-position:center;}
.phil-sub{position:absolute;bottom:0;left:0;width:48%;height:42%;object-fit:cover;object-position:center top;border:4px solid var(--cream);}
.phil-dot{position:absolute;bottom:56px;right:-10px;width:44px;height:180px;background:repeating-linear-gradient(to bottom,var(--gold) 0,var(--gold) 2px,transparent 2px,transparent 8px);opacity:0.28;}

/* メニュー */
.menu-sec{background:var(--espresso);padding:115px 80px;position:relative;overflow:hidden;}
.menu-sec::before{content:'鰻';position:absolute;right:-1%;top:50%;transform:translateY(-50%);font-family:'Shippori Mincho',serif;font-size:360px;font-weight:700;color:rgba(255,255,255,0.02);line-height:1;pointer-events:none;}
.menu-in{max-width:1200px;margin:0 auto;}
.menu-hd{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px;}
.menu-sec .sec-lbl{color:var(--gold-l);}
.menu-sec .sec-lbl::before{background:var(--gold-l);}
.menu-sec .sec-ttl{color:var(--cream);}
.menu-more{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;letter-spacing:0.28em;color:var(--gold-l);text-decoration:none;display:flex;align-items:center;gap:12px;transition:gap 0.3s;}
.menu-more::after{content:'→';font-style:normal;}
.menu-more:hover{gap:18px;}
.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
.menu-card{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);overflow:hidden;transition:background 0.3s;}
.menu-card:hover{background:rgba(255,255,255,0.07);}
.menu-img{height:195px;overflow:hidden;}
.menu-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s;}
.menu-card:hover .menu-img img{transform:scale(1.05);}
.menu-bd{padding:34px 34px 38px;}
.menu-en{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:11px;letter-spacing:0.3em;color:var(--gold);margin-bottom:12px;}
.menu-nm{font-family:'Shippori Mincho',serif;font-size:21px;font-weight:600;letter-spacing:0.12em;color:var(--cream);margin-bottom:12px;}
.menu-dc{font-size:12px;line-height:2.1;letter-spacing:0.05em;color:rgba(250,247,242,0.48);margin-bottom:26px;}
.menu-pr{font-family:'Noto Serif JP',serif;font-size:19px;font-weight:300;letter-spacing:0.04em;color:var(--gold-l);}
.menu-pr small{font-size:11px;letter-spacing:0.14em;color:rgba(196,169,107,0.5);margin-left:4px;}

/* 店舗 */
.stores-sec{padding:115px 80px;max-width:1200px;margin:0 auto;}
.stores-hd{text-align:center;margin-bottom:64px;}
.stores-hd .sec-lbl{justify-content:center;}
.stores-hd .sec-lbl::before{display:none;}
.stores-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.store-card{border:1px solid var(--sand);overflow:hidden;transition:transform 0.3s,box-shadow 0.3s;text-decoration:none;color:inherit;display:block;}
.store-card:hover{transform:translateY(-4px);box-shadow:0 18px 56px rgba(44,31,21,0.1);}
.store-thumb{height:215px;overflow:hidden;position:relative;}
.store-thumb img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform 0.6s;}
.store-card:hover .store-thumb img{transform:scale(1.04);}
.store-tag{position:absolute;top:16px;left:16px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:10px;letter-spacing:0.3em;color:var(--cream);background:var(--espresso);padding:5px 13px;}
.store-info{padding:24px 26px 28px;background:var(--cream);}
.store-nm{font-family:'Shippori Mincho',serif;font-size:17px;font-weight:600;letter-spacing:0.12em;color:var(--espresso);margin-bottom:8px;}
.store-addr{font-size:12px;line-height:1.8;letter-spacing:0.05em;color:var(--text-l);margin-bottom:12px;}
.store-hrs{font-size:11px;letter-spacing:0.05em;color:var(--text-m);padding-top:12px;border-top:1px solid var(--sand);display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px;}

/* ご予約 */
.reserve-sec{background:var(--warm);border-top:1px solid var(--sand);padding:100px 80px;text-align:center;position:relative;overflow:hidden;}
.reserve-sec::before{content:'予約';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:'Shippori Mincho',serif;font-size:260px;font-weight:700;color:rgba(196,169,107,0.05);pointer-events:none;white-space:nowrap;}
.res-ttl{font-family:'Shippori Mincho',serif;font-size:clamp(26px,3.5vw,44px);font-weight:600;letter-spacing:0.1em;color:var(--espresso);margin-bottom:16px;position:relative;}
.res-desc{font-size:13px;line-height:2.4;letter-spacing:0.07em;color:var(--text-m);margin-bottom:52px;position:relative;}
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:860px;margin:0 auto;position:relative;}
.res-card{border:1px solid var(--tan);padding:30px 22px 26px;text-align:center;text-decoration:none;color:inherit;transition:all 0.3s;background:var(--cream);}
.res-card:hover{background:var(--espresso);border-color:var(--espresso);}
.res-card:hover .rc-nm,.res-card:hover .rc-en,.res-card:hover .rc-hrs{color:var(--cream);}
.res-card:hover .rc-btn{background:var(--gold);color:var(--espresso);border-color:var(--gold);}
.rc-en{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:11px;letter-spacing:0.3em;color:var(--gold);margin-bottom:8px;transition:color 0.3s;}
.rc-nm{font-family:'Shippori Mincho',serif;font-size:17px;font-weight:600;letter-spacing:0.12em;color:var(--espresso);margin-bottom:8px;transition:color 0.3s;}
.rc-hrs{font-size:11px;letter-spacing:0.05em;color:var(--text-l);margin-bottom:18px;line-height:1.9;transition:color 0.3s;}
.rc-btn{display:inline-block;font-size:11px;letter-spacing:0.2em;color:var(--espresso);border:1px solid var(--tan);padding:9px 22px;transition:all 0.3s;text-decoration:none;}
.rc-takeout{display:inline-block;font-size:10px;letter-spacing:0.18em;color:var(--text-l);border:1px solid var(--sand);padding:7px 18px;transition:all 0.3s;margin-top:8px;text-decoration:none;}
.rc-tel{display:inline-block;font-size:11px;letter-spacing:0.1em;color:var(--text-m);text-decoration:none;margin-top:8px;transition:color 0.3s;}
.rc-tel:hover{color:var(--gold);}
.res-card:hover .rc-takeout{border-color:rgba(196,169,107,0.5);color:var(--gold);}
.res-card:hover .rc-tel{color:var(--cream);}

/* お知らせ */
.news-sec{padding:100px 80px;border-top:1px solid var(--sand);max-width:1200px;margin:0 auto;}
.news-hd{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:44px;}
.news-more{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;letter-spacing:0.25em;color:var(--text-m);text-decoration:none;display:flex;align-items:center;gap:10px;transition:color 0.3s;}
.news-more::after{content:'→';}
.news-more:hover{color:var(--gold);}
.news-list{display:flex;flex-direction:column;}
.news-item{display:grid;grid-template-columns:130px 90px 1fr;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--sand);text-decoration:none;color:inherit;transition:opacity 0.3s;}
.news-item:hover{opacity:0.65;}
.n-date{font-family:'Cormorant Garamond',serif;font-size:13px;letter-spacing:0.14em;color:var(--text-l);}
.n-cat{font-size:10px;letter-spacing:0.2em;color:var(--gold);background:rgba(196,169,107,0.1);padding:4px 11px;text-align:center;}
.n-ttl{font-size:13px;letter-spacing:0.07em;color:var(--text);line-height:1.6;}

/* フッター（index独自のグリッドレイアウト） */
footer{padding:64px 80px 40px;}
.foot-in{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,0.07);margin-bottom:30px;}
.foot-logo{font-family:'Shippori Mincho',serif;font-size:18px;font-weight:600;letter-spacing:0.14em;color:var(--cream);text-decoration:none;display:inline-block;margin-bottom:16px;}
.foot-logo small{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:11px;font-weight:300;letter-spacing:0.24em;color:var(--gold);display:block;margin-top:2px;}
.foot-desc{font-size:12px;line-height:2.2;letter-spacing:0.05em;color:rgba(250,247,242,0.32);}
.foot-col-ttl{font-family:'Shippori Mincho',serif;font-size:13px;font-weight:600;letter-spacing:0.16em;color:var(--cream);margin-bottom:16px;}
.foot-links{list-style:none;display:flex;flex-direction:column;gap:10px;}
.foot-links a{font-size:12px;letter-spacing:0.09em;color:rgba(250,247,242,0.32);text-decoration:none;transition:color 0.3s;}
.foot-links a:hover{color:var(--gold-l);}
.foot-btm{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;}
.foot-copy{font-family:'Cormorant Garamond',serif;font-size:11px;letter-spacing:0.18em;color:rgba(250,247,242,0.18);}

/* アニメーション */
@keyframes hZoom{from{transform:scale(1.07);}to{transform:scale(1.0);}}
@keyframes hUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}
@keyframes hSlide{from{opacity:0;transform:translateY(105%);}to{opacity:1;transform:translateY(0);}}
@keyframes tick{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@keyframes sPulse{0%,100%{opacity:0.45;}50%{opacity:1;}}

@media(max-width:900px){
  .hero-body{padding-left:36px;padding-right:20px;}
  .hero-vline{left:18px;}
  .philosophy{grid-template-columns:1fr;padding:72px 32px;gap:44px;}
  .phil-imgs{height:300px;}
  .menu-sec{padding:72px 32px;}.menu-grid{grid-template-columns:1fr;}
  .stores-sec{padding:72px 32px;}.stores-grid{grid-template-columns:1fr;}
  .reserve-sec{padding:72px 32px;}.res-grid{grid-template-columns:1fr;}
  .news-sec{padding:72px 32px;}
  .news-item{grid-template-columns:110px 70px 1fr;gap:12px;}
  footer{padding:48px 32px 32px;}
  .foot-in{grid-template-columns:1fr 1fr;gap:28px;}
  .foot-btm{flex-direction:column;gap:10px;text-align:center;}
}
