.fv { position: relative; height: 95vh; min-height: 560px; }
.fv__frame {
  position: absolute; top: var(--nav-h); left: var(--gut); right: var(--gut); bottom: 80px;
  overflow: hidden;
  border-radius: var(--r-l) var(--r-l) 200px var(--r-l);
  background: var(--ph);
}
/* 写真は重ねて、ゆっくり入れ替える */
.fv__track { position: relative; height: 100%; }
.fv__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.6s ease; }
.fv__slide.is-current { opacity: 1; }
.fv__slide .ph { transform: scale(1.08); transition: transform 7s ease-out; }
.fv__slide.is-current .ph { transform: none; }
.ph--fv { width: 100%; height: 100%; }
.ph--fv::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top right, rgba(59, 42, 30, .62), rgba(59, 42, 30, .08) 60%); }

.fv__dots { position: absolute; right: 34px; bottom: 30px; z-index: 2; display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.fv__dots li { width: 26px; height: 2px; background: rgba(251, 247, 241, .4); transition: background .6s; }
.fv__dots li.is-current { background: var(--on-dark); }

/* 店名は左下に横へ並べる */
.fv__logo {
  position: absolute; left: calc(var(--gut) + 48px); bottom: 128px; z-index: 2;
  display: grid; grid-template-columns: auto auto; column-gap: 20px; align-items: end; justify-content: start;
  color: var(--on-dark);
  font-family: var(--ff-mincho); font-weight: 500;
  pointer-events: none;
  animation: fv-logo 1.6s var(--ease) .3s both;
}
.fv__mark { grid-row: 1 / span 2; width: 64px; height: 80px; }
.fv__sub { font-size: 14px; line-height: 1.4; letter-spacing: .5em; align-self: end; }
.fv__name { font-size: 52px; line-height: 1.2; letter-spacing: .24em; white-space: nowrap; }
@keyframes fv-logo { from { opacity: 0; transform: translateY(24px); } }
.is-capture .fv__logo { animation: none; }
.is-capture .fv__slide .ph { transform: none; transition: none; }

@media (max-width: 899px) {
  .fv__frame { top: 105px; bottom: 60px; border-radius: var(--r-l) var(--r-l) 120px var(--r-l); }
  .fv__logo { left: calc(var(--gut) + 24px); bottom: 100px; column-gap: 14px; }
  .fv__mark { width: 48px; height: 60px; }
  .fv__sub { font-size: 12px; }
  .fv__name { font-size: 36px; }
  .fv__dots { right: 44px; bottom: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .fv__logo { animation: none; }
  .fv__slide, .fv__slide .ph { transition: none; }
}