/* ==============================
   Base Reset & Typography
============================== */
body {
  font-family: 'Poppins', sans-serif;
  background-color: #0d0d0d;
  color: #fff;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

a {
  color: #d4af37;
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: #fff;
}

/* ==============================
   Navbar
============================== */
.navbar-premium {
  background-color: rgba(0, 0, 0, 0.85);
  border-bottom: 1px solid rgba(212, 175, 55, 0.3);
  backdrop-filter: blur(8px);
}

.navbar-premium .navbar-brand {
  font-weight: 700;
  letter-spacing: 1px;
  color: #d4af37;
}

.navbar-premium .nav-link {
  color: #fff;
  margin-right: 20px;
  transition: all 0.3s ease;
}

.navbar-premium .nav-link:hover,
.navbar-premium .nav-link.active {
  color: #d4af37;
}

/* ==============================
   Carousel Section
============================== */
.carousel-premium {
  margin-top: 0;
}

.carousel-premium .carousel-item img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
  filter: brightness(70%);
}

.carousel-premium .carousel-caption {
  bottom: 20%;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
}

.carousel-premium h5 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #fff;
}

.carousel-premium p {
  color: #d4af37;
  font-size: 1.1rem;
}

/* ==============================
   Section Titles
============================== */
.section-title {
  font-size: 2rem;
  font-weight: 700;
  color: #d4af37;
  text-transform: uppercase;
  margin-bottom: 1rem;
  text-align: center;
}

/* ==============================
   Footer
============================== */
.footer-premium {
  background: #000;
  padding: 30px 0;
  text-align: center;
  border-top: 1px solid rgba(212, 175, 55, 0.2);
}

.footer-premium p {
  color: #aaa;
  margin: 0;
}

.footer-premium a {
  color: #d4af37;
  margin: 0 10px;
}

.footer-premium a:hover {
  color: #fff;
}

/* ==============================
   Animations
============================== */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ==============================
   Responsive
============================== */
@media (max-width: 768px) {
  .hero-premium h1 {
    font-size: 2.4rem;
  }

  .hero-premium .subheading {
    font-size: 1rem;
  }

  .carousel-premium .carousel-caption {
    bottom: 15%;
  }
}




/* Logo Styling */
.logo-img {
  height: 200px;
  width: auto;
  transition: transform 0.3s ease, opacity 0.3s ease;
  filter: brightness(90%) contrast(110%);
}

.navbar.scrolled .logo-img {
  height: 200px; /* slightly smaller when scrolling */
  opacity: 0.9;
}

.logo-img:hover {
  transform: scale(1.05);
  filter: brightness(100%) contrast(115%);
}


/* Premium Dropdown */
.dropdown-menu-premium {
  background-color: #000;
  border: none;
  border-radius: 0;
  padding: 10px 0;
  min-width: 220px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.dropdown-menu-premium .dropdown-item {
  color: #fff;
  font-weight: 700;
  padding: 10px 20px;
  transition: background 0.3s ease, color 0.3s ease;
}

.dropdown-menu-premium .dropdown-item:hover {
  background-color: #d4af37;
  color: #000;
}

.navbar .dropdown-toggle::after {
  display: none; /* hide default caret if you want cleaner look */
}


.modal-content {
  background: rgba(20, 20, 20, 0.95);
  border-radius: 1rem;
  overflow: hidden;
}
.modal-body img {
  object-fit: cover;
  max-height: 450px;
  width: 100%;
}
.btn-outline-light:hover {
  background-color: #fff;
  color: #000;
}


.hover-zoom {
  transition: transform 0.4s ease, opacity 0.4s ease;
  cursor: pointer;
}
.hover-zoom:hover {
  transform: scale(1.03);
  opacity: 0.9;
}

.about-izumiya {
  background: radial-gradient(circle at top left, #141414, #0b0b0b 80%);
  font-family: 'Poppins', sans-serif;
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.about-izumiya h2 {
  font-family: 'Playfair Display', serif;
  font-size: 2.5rem;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.about-izumiya .intro-text {
  color: #e0e0e0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.7;
  max-width: 80%;        /* 🔹 narrower width */
  margin: 0 0 0 auto;    /* 🔹 pushes text to the right */
  text-align: left;      /* keep readable alignment */
}

.about-izumiya .description {
  color: #bfbfbf;
  font-size: 1rem;
  line-height: 1.9;
  margin-top: 1rem;
}

.about-izumiya h5 {
  letter-spacing: 0.5px;
  font-size: 1.1rem;
}

.text-gold {
  color: #d4af37;
}

.about-chef-img {
  border: 2px solid rgba(212, 175, 55, 0.25);
  transition: all 0.4s ease;
}

.about-chef-img:hover {
  transform: scale(1.03);
  box-shadow: 0 0 20px rgba(212, 175, 55, 0.3);
}


.single-line-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.1rem; /* smaller and balanced */
  color: #fff;
  letter-spacing: 1px;
  line-height: 1.3;
  text-transform: uppercase;
  margin-bottom: 1rem;
  border-left: 3px solid #d4af37; /* optional subtle accent line */
  padding-left: 10px;
}





/* --- Sushi animation wrapper --- */
.sushi-hero-wrap {
  position: relative;
  display: inline-block;
  z-index: 2;
  margin-bottom: clamp(16px, 5vh, 40px);
  opacity: 0;
  transform: translateY(15px) scale(.98);
  animation: entrance 500ms cubic-bezier(.25,.8,.25,1) forwards 100ms;
}

/* Image motion — quicker and slightly larger swing */
.sushi-hero-img {
  width: min(90vw, 780px);
  height: auto;
  will-change: transform, filter;
  filter: drop-shadow(0 10px 30px rgba(0,0,0,.4));
  animation:
    floatLoop 3.5s ease-in-out infinite,
    slowRotate 10s ease-in-out infinite alternate;
  transform-origin: 50% 55%;
}

/* Aura pulse faster and more subtle */
.sushi-hero-wrap::after {
  content: "";
  position: absolute;
  left: 50%; top: 54%;
  width: 65%; aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle at 50% 50%, rgba(255,215,0,.22), rgba(255,215,0,0) 60%);
  filter: blur(24px) saturate(120%);
  z-index: -1;
  animation: auraPulse 2.5s ease-in-out infinite;
}

/* --- Faster Keyframes --- */
@keyframes entrance {
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes floatLoop {
  0%, 100% { transform: translateY(0); }
  25% { transform: translateY(-12px); }
  50% { transform: translateY(0); }
  75% { transform: translateY(12px); }
}
@keyframes slowRotate {
  0%   { transform: rotate(-2deg) }
  100% { transform: rotate(15deg) }
}
@keyframes auraPulse {
  0%, 100% { opacity: .6; transform: translate(-50%, -50%) scale(1); }
  50%      { opacity: .95; transform: translate(-50%, -50%) scale(1.1); }
}


#hero { position: relative; overflow: hidden; }

.hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.hero-bg .bg-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 0;
  transform: scale(1.05);
  will-change: opacity, transform;
}

/* --- Fade timing ---
   Each slide runs the same animation but starts later.
   The total duration = number_of_slides × 6 s (here 3 × 6 s = 18 s)
*/
.hero-bg .bg-slide:nth-child(1) {
  animation: bgFade 18s linear infinite, bgKenBurns 18s ease-in-out infinite;
  animation-delay: 0s, 0s;
}
.hero-bg .bg-slide:nth-child(2) {
  animation: bgFade 18s linear infinite, bgKenBurns 18s ease-in-out infinite;
  animation-delay: 6s, 6s;
}
.hero-bg .bg-slide:nth-child(3) {
  animation: bgFade 18s linear infinite, bgKenBurns 18s ease-in-out infinite;
  animation-delay: 12s, 12s;
}

/* --- Cross-fade visibility --- */
@keyframes bgFade {
  0%, 100%   { opacity: 0; }
  8%, 30%    { opacity: 1; }   /* fade in, stay visible */
  33%, 99%   { opacity: 0; }   /* fade out, stay hidden until next turn */
}

/* --- Gentle Ken Burns zoom/pan --- */
@keyframes bgKenBurns {
  0%   { transform: scale(1.05) translate3d(0,0,0); }
  50%  { transform: scale(1.12) translate3d(0,-1.5%,0); }
  100% { transform: scale(1.05) translate3d(0,0,0); }
}

/* --- Vignette overlay for contrast --- */
#hero .hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1; /* above bg, below content */
  pointer-events: none;
  background: radial-gradient(
    1200px 600px at 50% 35%,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.6) 5%,
    rgba(0,0,0,.85) 100%
  );
}

/* --- Content sits above bg + overlay --- */
.hero-premium .container { position: relative; z-index: 2; }
#hero .hero-text { position: relative; z-index: 2; margin-top: clamp(12px, 3vh, 28px); }


/* Accessibility: respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hero-bg .bg-slide { animation: none; opacity: 0; }
  .hero-bg .bg-slide:nth-child(1) { opacity: 1; } /* show first image only */
}


/* HERO base */
#hero.hero-premium{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
  overflow:hidden;
}

/* Sushi animation */
.sushi-hero-wrap{
  position:relative;
  display:inline-block;
  z-index:2;
  margin-bottom:clamp(16px,5vh,40px);
  opacity:0;
  transform:translateY(15px) scale(.98);
  animation:entrance .5s cubic-bezier(.25,.8,.25,1) forwards .1s;
}
.sushi-hero-img{
  width:min(90vw,780px);
  height:auto;
  will-change:transform,filter;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.4));
  animation:
    floatLoop 3.5s ease-in-out infinite,
    slowRotate 8s ease-in-out infinite alternate;
  transform-origin:50% 55%;
}
.sushi-hero-wrap::after{
  content:"";
  position:absolute;
  left:50%; top:54%;
  width:65%; aspect-ratio:1/1;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle at 50% 50%, rgba(255,215,0,.22), rgba(255,215,0,0) 60%);
  filter:blur(24px) saturate(120%);
  z-index:-1;
  animation:auraPulse 2.5s ease-in-out infinite;
}

/* Sushi keyframes */
@keyframes entrance{ to{ opacity:1; transform:translateY(0) scale(1);} }
@keyframes floatLoop{
  0%,100%{ transform:translateY(0); }
  25%{ transform:translateY(-12px); }
  50%{ transform:translateY(0); }
  75%{ transform:translateY(12px); }
}
@keyframes slowRotate{ 0%{ rotate:-4deg; } 100%{ rotate:4deg; } }
@keyframes auraPulse{
  0%,100%{ opacity:.6; transform:translate(-50%,-50%) scale(1); }
  50%{ opacity:.95; transform:translate(-50%,-50%) scale(1.1); }
}

/* Accessibility */
@media (prefers-reduced-motion:reduce){
  .hero-bg .bg-slide{ animation:none; opacity:0; }
  .hero-bg .bg-slide:nth-child(1){ opacity:1; }
}

#hero .btn-gold {
  background: linear-gradient(180deg, #e6c35a, #d1a72a);
  color: #1b1b1b;
  border: none;
  box-shadow: 0 8px 20px rgba(209,167,42,.3);
    animation: pulseGold 3s ease-in-out infinite;

}
@keyframes pulseGold {
  0%, 100% { box-shadow: 0 0 0 rgba(212,175,55,0); }
  50% { box-shadow: 0 0 20px rgba(212,175,55,0.6); }
}


/* ==============================
   Gallery Hover Zoom Effect
============================== */
.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 0.5rem;
}

.gallery-img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1),
              filter 0.8s ease;
  filter: brightness(0.9) saturate(0.95);
}

/* Subtle overlay fade */
.gallery-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, rgba(0,0,0,0) 40%, rgba(0,0,0,0.6) 100%);
  opacity: 0;
  transition: opacity 0.6s ease;
  pointer-events: none;
}

/* On hover: zoom + brighten + overlay fade in */
.gallery-item:hover .gallery-img {
  transform: scale(1.1);
  filter: brightness(1.05) saturate(1.1);
}

.gallery-item:hover::after {
  opacity: 1;
}

/* Optional: make the section background dark and elegant */
#gallery {
  background: radial-gradient(circle at top center, #111, #000 80%);
}

#gallery h2 {
  color: #d4af37;
  text-transform: uppercase;
  letter-spacing: 1px;
}