/* css/style.css */

/* 通用样式和重置 */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    overflow-x: hidden;
    background-color: #F7F7F7;
    position: relative; /* 新增这一行 */
}

a {
    text-decoration: none;
    color: inherit;
}

/* 导航栏样式 */
.main-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    transition: background-color 0.3s ease, color 0.3s ease, padding 0.3s ease;
    padding: 15px 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}
.hamburger-icon {
  width: 20px;
  height: auto;
  vertical-align: middle;
  margin-right: 8px;
}

/* MENU 页面专用：页面加载时导航栏默认黑色文字 */
body.dark-navbar .main-header {
    color: #333;
}

body.dark-navbar .btn-prenota {
    border-color: #333;
}


.main-header.scrolled {
    background-color: #F7F7F7;
    color: #777;
    padding: 10px 5px;
}
.main-header.scrolled .navbar-left,
.main-header.scrolled .btn-prenota {
  color: #777;
}

.main-header.scrolled .navbar-left:hover,
.main-header.scrolled .btn-prenota:hover {
  color: #C08C54;
}

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1400px;
}

.navbar-left,
.navbar-right {
    display: flex;
    align-items: center;
    font-size: 1.1em;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.navbar-left {
  padding-left: 2vw;   /* 原来没有 padding，现在向右推 */
}

.navbar-right {
  padding-right: 2vw;  /* 原来没有 padding，现在向左推 */
}

.navbar-left {
    transition: color 0.3s ease;
}

.navbar-left:hover {
    color: #C08C54;
}

.menu-icon {
    margin-right: 6px;
}

.navbar-center .sato-logo {
    height: 60px;
    width: auto;
    display: block;
}

.btn-prenota {
    border: none;                 /* ✅ 取消边框 */
    background: none;             /* ✅ 去除背景 */
    padding: 0;                   /* ✅ 去除内边距 */
    font-size: 1.1em;             /* ✅ 保持与左侧文字一致 */
    text-transform: uppercase;
    letter-spacing: 1px;
    color: inherit;               /* ✅ 跟随父元素颜色（白或黑） */
    font-family: inherit;
    cursor: pointer;
    transition: color 0.3s ease;
}

.btn-prenota:hover {
    background-color: transparent;
    color: #C08C54;
}

/* Hero Section */
.hero-section {
    position: relative;
    width: 100%;
    height: 150vh;
    min-height: 100vh;
    background-image: url('images/hero_sushi.jpg');
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-attachment: scroll;
    color: #fff;
    z-index: 0;
}

.hero-content-wrapper {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    pointer-events: none;
}

.hero-text-overlay {
    pointer-events: auto;
    z-index: 2;
    margin-bottom: 200px;
    text-shadow: 2px 2px 5px rgba(0,0,0,0.5);
    text-align: center;
}

.hero-text-overlay h1,
.hero-text-overlay h2 {
    font-family: 'Georgia', serif;
    font-size: 6.0em;
    font-weight: normal;
    letter-spacing: 2px;
    line-height: 1.2;
    margin-top: 5px;
}

.placeholder-content {
    background-color: #F7F7F7;
    padding: 100px 50px;
    text-align: center;
    z-index: 500;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 50vh;
}

.main-text-block {
    max-width: 1400px;
    margin: 0 auto;
    font-family: 'Georgia', serif;
    font-size: clamp(1.8em, 4vw, 3.0em);
    line-height: 1.5;
    color: #333;
    text-align: center;
}

.icon-sushi-bowl {
  background-image: url('images/icon-sushi-bowl.png');
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: middle;
}

.icon-sake-bottle {
  background-image: url('images/icon-sake-bottle.png');
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: middle;
}

.main-text-block p {
    margin-bottom: 0.5em;
    font-size: clamp(1.3em, 1.5vw, 2.4em);
}

.main-text-block span[class^="icon-"] {
    display: inline-block;
    vertical-align: middle;
    width: 1.2em;
    height: 1.2em;
    margin: 0 5px;
}

.dishes-gallery-section {
    position: relative;
    display: flex;
    min-height: 300vh;
    background-color: #F7F7F7;
    overflow: hidden;
}

.gallery-bg-image {
    position: relative;
    top: 0;
    left: 0;
    width: 30%;
    height: 50%;
    background-image: url('images/background1.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.5;
    z-index: 1;
}

.gallery-content-wrapper {
    position: relative;
    z-index: 2;
    display: flex;
    width: 100vw;
    margin: 0 auto;
}

.gallery-text-column {
    flex: 0 0 35%;
    padding: 0 40px 0 60px;
    text-align: left;
    color: #333;
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.gallery-text-column .slide-counter {
    font-size: 1.3em;
    margin-bottom: 50px;
    color: #C08C54;
}

.gallery-text-column h2.slide-title {
    font-size: 3.6em;
    font-weight: normal;
    line-height: 1.1;
    margin-bottom: 30px;
    color: #333;
}

.slide-description-content p {
    font-size: 1.3em;
    line-height: 1.8;
    margin-bottom: 1em;
    color: #555;
}

.slide-description-content p:last-child {
    margin-bottom: 0;
}

.gallery-text-column .btn-menu {
    border: 1px solid #333;
    padding: 12px 25px;
    border-radius: 5px;
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: background-color 0.3s ease, color 0.3s ease;
    color: #333;
    margin-top: 40px;
}

.gallery-text-column .btn-menu:hover {
    background-color: #333;
    color: #fff;
}

.gallery-image-column {
    flex: 0 0 65%;
    padding-right: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
    overflow: hidden;
    height: 100vh;
    margin-left: 0;
}

.image-slider-container {
    position: relative;
    top: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.gallery-dish-image {
    width: auto;
    height: 100vh;
    max-width: 100%;
    object-fit: contain;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    display: block;
}

/* 新增 highlight-section 样式 */

.highlight-section {
  background-color: #f7f7f7;
  padding: 10px 8vw 100px 8vw;
}

.highlight-section {
  position: relative;
  overflow: visible;
}

.highlight-section::before {
  content: "";
  position: absolute;
  top: 0px; /* 向上溢出 */
  left: -80px;
  opacity: 0.08;
  pointer-events: none;
  z-index: 0;
}

.highlight-heading {
  font-size: 3.8em;
  font-weight: 500;
  margin-bottom: 60px;
  line-height: 1.2;
}

.highlight-text p {
  font-size: 1.25em;
  line-height: 1.9;
  color: #333;
  font-family: Arial, sans-serif; 
}


.btn-menu {
  display: inline-flex; /* 精准包裹内容 */
  align-items: center;
  justify-content: center;
  margin-top: 60px;
  padding: 12px 20px;
  font-size: 0.9em;     /* 略大一点点，避免按钮太小 */
  font-weight: bold;   /* 如需与下方按钮一致 */
  font-family: Arial, sans-serif;
  color: #333;
  background-color: transparent;
  border: 2px solid #c08c54;
  border-radius: 8px;
  text-transform: uppercase;
  letter-spacing: 1px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  width: fit-content;         /* 核心属性，让按钮宽度匹配内容 */
  max-width: 100%;
}

.btn-menu:hover {
  background-color: #c08c54;
  color: #fff;
}

.icon-marquee {
  width: 100%;
  overflow: hidden;
  background-color: #f7f7f7;
  padding-top: 0px;      /* ↑ 增加上内边距 */
  padding-bottom: 40px;   /* ↑ 增加下内边距 */
  margin-bottom: 40px;   /* 保持与下一个内容之间的外边距 */
  box-sizing: border-box;
}

.icon-marquee-track {
  display: flex;
  width: max-content;
  animation: marquee-scroll 80s linear infinite;
  align-items: center;
  gap: 60px; /* 图标间距 */
}

.marquee-icon {
  height: 120px; /* 图标大小 */
  width: auto;
  user-select: none;
  pointer-events: none;
}

@keyframes marquee-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-50%));
  }
}
.full-width-banner {
  width: 100%;
  overflow: hidden;
}

.full-width-banner img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.chef-section {
  background-color: #F7F7F7;
  color: #333;
  padding: 100px 6vw; /* 增加左右留白 */
}

.chef-wrapper {
  max-width: 1200px;       /* 限制整体宽度 */
  margin: 0 auto;          /* 居中 */
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 40px;
}

.chef-left {
  flex: 0 0 55%;           /* 原来48%，现在更窄 */
}

.chef-left .chef-photo {
  width: 40vw;                /* 视口宽度的 90% */
  height: auto;
  border-radius: 6px;
  display: block;
  transform: translateX(-4vw); /* 向左移动图片，达到视觉左靠、右对齐中线效果 */
}

.chef-right {
  flex: 0 0 39%;           /* 同样缩小右栏宽度 */
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.decor-icon {
  width: 50px;
  height: auto;
}

.section-label {
  font-size: 0.9em;
  letter-spacing: 1px;
  color: #c7a97f;
  text-transform: uppercase;
}

.section-title {
  font-size: 3.8em;              /* 与 .highlight-heading 相同 */
  font-weight: normal;              /* 相同粗细 */
  font-family: 'Georgia', sans-serif; /* 与上面一致 */
  line-height: 1.4;
  margin-bottom: 30px;
  color: #333;
}

.section-text {
  font-size: 1.2em;            /* 段落更大 */
  line-height: 1.7;
  color: #333;
  margin-bottom: 40px;          /* 增加段落与图片间距 */
}

.chef-dish {
  width: 100%;
  height: auto;
  border-radius: 6px;
}

/* 动效 */
.animate-on-scroll {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}
.split-block-section {
  width: 100%;
  background-color: #1B1414;
}

.split-block-wrapper {
  display: flex;
  flex-wrap: wrap;
}

.split-block {
  position: relative;
  flex: 1 1 50%;
  overflow: hidden;
  aspect-ratio: 1 / 1; /* 👈 改成正方形 */
}

.split-image {
  width: 100%;
  height: 100%;
  object-fit: contain; /* 👈 改成 contain，就不会被裁剪了 */
  display: block;
  filter: brightness(0.7);
}

.split-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  padding: 40px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.split-icon {
  width: 60px;
  height: auto;
  margin-bottom: 20px;
}

.split-title {
  font-size: 3.8em;
  font-weight: 500;
  font-family: 'Georgia', serif;
  line-height: 1.2;
  margin-bottom: 30px;
  color: #fff;
}

.split-button {
  margin-top: 20px;
  background-color: #fff;
  color: #111;
  padding: 10px 20px;
  border-radius: 5px;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 0.9em;
  transition: background-color 0.3s ease;
}

.split-button:hover {
  background-color: #C08C54;
  color: #fff;
}
/* 初始状态 */
.animate-on-scroll {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 1.6s ease-out, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

/* 滚动进入时激活 */
.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}
/* 公共初始状态 */
.animate-on-scroll {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1.2s ease-out, transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

/* 通用进入后 */
.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}

/* 延迟设置：标题无延迟 */
.split-title.animate-on-scroll {
  transition-delay: 0s;
}

/* 按钮稍后进入 */
.split-button.animate-on-scroll {
  transition-delay: 0.2s;
}

/* ===== Esperienza / Prenota ===== */
.experience-section {
  background-color: #F7F7F7;   /* 与页面其它段落保持呼吸感 */
  padding: 70px 6vw 205px 6vw;          /* 上下留白，左右自适应 */
  text-align: center;
  position: relative;
}

.experience-title {
  /* 与 .section-title 保持完全一致的排版 */
  font-size: 3.8em;
  font-weight: 500;
  font-family: 'Georgia', serif;
  line-height: 1.2;
  color: #333;
}

/* 图片容器：强制 1:1 比例，居中 */
.experience-image-wrapper {
  position: relative;
  width: min(500px, 70vw);     /* 最大 420px，移动端更窄 */
  aspect-ratio: 1 / 1;         /* 正方形 */
  margin: 70px auto 0;         /* 与标题分隔 */
  overflow: hidden;
}

/* 背景图片 */
.experience-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 6px;
}

/* “PRENOTA” 叠加文字 */
/* 悬浮在整个 section 中央的大标题 PRENOTA */
.experience-overlay-global {
  position: absolute;
  top: 57%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Georgia', serif;
  font-weight: 500;
  color: #C08C54;
  font-size: clamp(6rem, 16vw, 14rem);  /* 更大、更强响应性 */
  line-height: 1;
  letter-spacing: 5px;
  pointer-events: auto;
  z-index: 2;
  white-space: nowrap;
  opacity: 1; /* 可调，增强沉浸感 */
  cursor: url('images/cursor-arrow.png') 16 16, pointer;
}

/* ====== 动效：沿用之前 animate-on-scroll 规则，但稍做延迟区分 ====== */
.animate-on-scroll {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1.2s ease-out,
              transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}

/* 先标题后 PRENOTA：延迟进入 */
.experience-title.animate-on-scroll   { transition-delay: 0s;   }
.experience-overlay.animate-on-scroll { transition-delay: 0.4s; }

.footer-info {
  background-color: #f7f7f7;
  padding: 90px 8vw;                /* 上下左右统一为 60px */
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0; /* 新增底部灰线 */
}

.footer-columns {
  display: flex;
  flex-wrap: nowrap;           /* 强制一行排列 */
  justify-content: space-between; /* 四列之间平分剩余空间 */
  max-width: 1200px;
  margin: 0 auto;
  text-align: left;
  gap: 0;                      /* 不需要 gap，因为 space-between 自动分配 */
}

.footer-column {
  flex: 0 0 25%;     /* 每列固定占 25% 宽度，共四列刚好100% */
  min-width: 0;
}

.footer-column h4 {
  font-size: 1.2em;
  font-weight: bold;
  color: #C08C54;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.footer-column p {
  font-size: 1.2em;
  line-height: 1.7;
}

.footer-column a {
  color: #333;
  text-decoration: underline;
}
.footer-columns {
  justify-content: flex-start; /* 原来是 space-between，现在统一靠左 */
  gap: 40px; /* 调整间距以容纳第四段 */
}

.footer-column.icon-only {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding-top: 4px;
}

.footer-column.icon-only img {
  height: 40px;  /* 你可以根据视觉实际调整大小 */
  width: auto;
  display: block;
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 40px 8vw 50px 8vw;
  background-color: #f7f7f7;
  font-size: 0.85em;
  color: #777;
  border-top: 1px solid #e0e0e0;
  flex-wrap: wrap;
}

.footer-bottom a {
  color: #777;
  text-decoration: underline;
  margin: 0 4px;
  font-weight: normal;
}

.footer-bottom a:hover {
  color: #C08C54;
}

.footer-bottom-left,
.footer-bottom-right {
  margin-top: 5px;
}

.bamboo-bg-global {
  position: absolute;
  top: -100px;             /* 🎯你可以调为 0 或更小，比如 -100px */
  left: -80px;
  opacity: 0.08;
  z-index: -1;            /* 这行非常重要：放在内容层之下 */
  pointer-events: none;
}

.experience-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 500px;
  height: 500px;
  background-image: url('images/bamboo.png');
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.15;
  pointer-events: none;
  z-index: 1;
}
  .split-overlay {
    padding: 20px;
    justify-content: center;
  }

  .split-title {
    font-size: 2em;
  }

  .split-button {
    font-size: 0.9em;
    padding: 8px 16px;
  }
/* MENU 页面顶部标题样式：靠左靠上排列 */
.menu-header-section {
  width: 100%;
  background-color: #f7f7f7;
  padding: 80px 6vw 100px;
  text-align: center;
}

.menu-header-container {
  display: flex;
  justify-content: center;       /* 居中 */
  align-items: center;
  gap: 40px;                     /* “MENU”和图标之间的间距 */
  flex-wrap: nowrap;
}

.menu-title {
  font-family: 'Georgia', serif;
  font-size: clamp(5em, 11vw, 9.5em);
  font-weight: 500;
  color: #C08C54;
  letter-spacing: 4px;
  line-height: 1.2;
  margin: 0;
}

.menu-icon-right {
  width: 140px;
  height: auto;
  display: block;
}
.menu-hero-section {
  width: 100%;
  background-color: #f7f7f7;
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.menu-hero-image-wrapper {
  width: calc(100% - 12vw);   /* 和导航栏内容区域等宽 */
  max-width: 1400px;
  margin: 0 auto;              /* 居中 */
  overflow: hidden;
  padding: 40px 0 01px;        /* 去掉左右 padding */
}

.menu-hero-image-wrapper img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px; /* 你也可以移除这行，让图片更纯粹 */
  object-fit: cover;
}
.menu-intro-section {
  background-color: #f7f7f7;
  padding: 100px 6vw 100px;
  padding-top: 80px;
  padding-bottom: 140px;
  text-align: center;
}

.menu-intro-container {
  max-width: 1100px;
  margin: 0 auto;
  font-family: 'Georgia', serif;
  font-size: clamp(2em, 5vw, 3.8em);
  line-height: 1.5;
  color: #333;
  text-align: center;
}

.menu-intro-container p {
  margin-bottom: 100px;
}

.menu-intro-container {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  font-family: 'Georgia', serif;
  font-size: clamp(2em, 5vw, 3.8em);
  line-height: 1.5;
  color: #333;
  text-align: center;
}

/* 个别图标样式：根据你上传的图片命名 */
.icon-pink-roll {
  background-image: url('icon-sushi-menu.png');
}

.icon-green-leaf {
  background-image: url('icon-doufu-menu.png');
}
.icon-sushi-menu {
  background-image: url('images/icon-sushi-menu.png');
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  width: 1.6em;
  height: 1.6em;
  vertical-align: middle;
  margin: 0 6px;
}

.icon-doufu-menu {
  background-image: url('images/icon-doufu-menu.png');
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  width: 1.6em;
  height: 1.6em;
  vertical-align: middle;
  margin: 0 6px;
}
.gallery-scroll-section {
  background-color: #f7f7f7;
  padding: 0; /* 去掉上下间距 */
  overflow: hidden;
  height: calc(100vh - 50px);
}

.gallery-scroll-wrapper { 
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  scroll-behavior: smooth;
  gap: 30px;
  padding-bottom: 10px;
  height: 100%;
  width: 100%; /* 👈 确保可滚动 */
}

.gallery-scroll-wrapper img {
  height: 100%;
  width: auto;
  object-fit: contain; /* ← 不裁剪不拉伸 */
  border-radius: 0;
}

.gallery-item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.logo {
  height: 60px;
  width: auto;
  display: block;
}

.gallery-scroll-wrapper::-webkit-scrollbar {
  height: 10px;
}
.gallery-scroll-wrapper::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 5px;
}
.gallery-scroll-wrapper::-webkit-scrollbar-track {
  background-color: transparent;
}

.gallery-image {
  flex: 0 0 auto;
  width: 280px;
  height: auto;
  border-radius: 0;
  object-fit: cover;
  transition: none;
}

.btn-discover-menu {
  display: inline-block;
  padding: 30px 30px;
  border: 2px solid #c08c54; /* 米棕色边框 */
  background-color: transparent;
  color: #333;
  font-size: 1.2rem;
  font-family: Arial, sans-serif;  /* 修改字体为 Arial */
  font-weight: bold;
  letter-spacing: 1px;
  text-decoration: none;
  border-radius: 8px;
  transition: all 0.3s ease;
  margin-top: 50px !important;  /* 🔥 添加这一行 */
}

.btn-discover-menu:hover {
  background-color: #c08c54;
  color: #fff;
  cursor: pointer;
}

.custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 160px;
  height: 160px;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  display: none;
}
.custom-cursor.small {
  width: 160px;
  height: 160px;
}

/* 箭头图标定位在圆形内中心点，可左右偏移 */
.cursor-arrows,
.cursor-core {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* Filosofia 页面专用间距优化 */
.gallery-scroll-section {
  padding-bottom: 80px;
}

.chef-section {
  padding: 140px 6vw;
}

.full-width-banner {
  margin-top: 100px;
  margin-bottom: 100px;
}

.experience-section {
  padding: 100px 6vw 205px 6vw;
}

.icon-tempio {
  background-image: url('images/icon-tempio.png');  /* 你可以替换为实际图标地址 */
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  vertical-align: middle;
  margin: 0 6px;
}

.icon-pesce {
  background-image: url('images/icon-pesce.png');  /* 你可以替换为实际图标地址 */
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  width: 1.8em;
  height: 1.8em;
  vertical-align: middle;
  margin: 0 6px;
}

.gallery-scroll-wrapper {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  scroll-behavior: smooth;
  gap: 30px;
  padding-bottom: 10px;
  height: 100%;
  width: 100%;
  cursor: default;
  scrollbar-width: thin; /* Firefox 显示纤细滑块 */
}

/* Chrome / Safari 滚动条美化 */
.gallery-scroll-wrapper::-webkit-scrollbar {
  height: 8px;
}
.gallery-scroll-wrapper::-webkit-scrollbar-thumb {
  background-color: #bbb;
  border-radius: 4px;
}
.gallery-scroll-wrapper::-webkit-scrollbar-track {
  background-color: transparent;
}

.gallery-image {
  user-select: none;
  pointer-events: auto;
}

.gallery-scroll-wrapper {
  overflow-x: scroll;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none;  /* IE 10+ */
}

.gallery-scroll-wrapper::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

/* 控制整个图文区域最大宽度并居中 */
.highlight-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 1300px;
  margin: 0 auto;
  padding-left: 40px;
  padding-right: 40px;
  gap: 40px;
}

.menu-intro-section {
  display: flex;
  justify-content: center;
}

.menu-intro-container {
  max-width: 860px;
  padding: 0 20px;
  text-align: center;
}

/* 左侧图片区域，占 40% */
.highlight-image {
  flex: 0 0 40%;
  display: flex;
  justify-content: flex-start;
}

.highlight-image img {
  width: 100%;
  height: auto;
  display: block;
}

.highlight-wrapper .menu-intro-container {
  flex: 0 0 60%;
}

.menu-intro-paragraph {
  font-family: 'Georgia', serif; /* 添加这一行来改变字体 */
  font-size: 3.6rem;
  font-weight: 400;
  line-height: 1.6;
  max-width: 800px;
  margin: 0 auto;
  letter-spacing: 0.5px;
  text-align: center;
}

.main-intro-text {
  max-width: 1400px;
  margin: 0 auto;
  font-family: 'Georgia', serif;
  font-size: clamp(2em, 5vw, 3.8em);
  line-height: 1.5;
  color: #333;
  text-align: center;
  padding: 0 20px;
}

.highlight-section.location-page .highlight-text {
  flex: 0 0 65%;
  max-width: 65%;
}
.highlight-section.location-page .highlight-image {
  flex: 0 0 35%;
  max-width: 35%;
}

.location-page .menu-hero-section {
  margin-bottom: 100px; /* ✅ 自定义间距 */
}

.location-page .highlight-text {
  padding-left: 6vw;
  padding-right: 0vw;
}

.highlight-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 100%;
  padding: 0;
}

.highlight-text {
  flex: 0 0 45%;
  font-family: 'Georgia', serif;
  color: #333;
  padding-left: 0vw;
  padding-right: 5vw;
  padding-bottom: 10px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  position: relative;
  z-index: 1;
}

.highlight-heading {
  font-size: 3.8em;
  font-weight: 500;
  margin-bottom: 60px;
  line-height: 1.2;
}

.highlight-text p {
  font-size: 1.25em;
  line-height: 1.9;
  font-family: Arial, sans-serif;
  color: #333;
}

.highlight-image {
  flex: 0 0 50%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 0;
  position: relative;
  overflow: visible;
}

.highlight-image img {
  width: 70vw;
  max-width: none;
  height: auto;
  object-fit: cover;
  margin-right: calc(-29vw + 50%);
  border-radius: 6px;
}

.btn-menu {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 60px;
  padding: 12px 20px;
  font-size: 0.9em;
  font-weight: bold;
  font-family: Arial, sans-serif;
  color: #333;
  background-color: transparent;
  border: 2px solid #c08c54;
  border-radius: 8px;
  text-transform: uppercase;
  letter-spacing: 1px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  width: fit-content;
  max-width: 100%;
}

.btn-menu:hover {
  background-color: #c08c54;
  color: #fff;
}


/* ✅ LOCATION 页面专属左右分栏样式 */
.location-highlight-section {
  background-color: #F7F7F7;
  padding: 40px 1vw 100px;  /* 上 40px，左右 2vw，下 100px */
}

.location-highlight-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 95vw;
  margin: 0 auto;
  padding: 10px 0px;
  gap: 50px;
}

.location-highlight-image {
  flex: 0 0 37%;
}

.location-highlight-image img {
  width: 100%;
  max-width: 500px;
  max-height: 550px; /* 新增这一行 */
  height: auto;
  object-fit: contain; /* 新增这一行 */
  display: block;
}

.location-highlight-image {
  position: relative;
}

.location-highlight-image .corner-icon {
  position: absolute;
  width: 180px;           /* 图标宽度，你可根据视觉需要调整 */
  height: auto;
  right: 10px;           /* 向右溢出一点点 */
  bottom: -10px;          /* 向下溢出一点点 */
  z-index: 2;
  pointer-events: none;   /* 避免鼠标交互（可选） */
}

.location-highlight-text {
  flex: 0 0 63%;
  font-size: 1.25em;
  line-height: 2;
  font-family: Arial, sans-serif;
  letter-spacing: 0.5px;    /* ✅ 字间距稍大，视觉更舒适 */
  color: #333;
  padding-right: 50px;
}

.location-page .location-highlight-text .experience-title {
  font-size: 3.1em; /* 或根据你需求选择 1.8em、2.2em 等 */
  text-align: left; /* 可选，如果你不希望它居中 */
}

.contatti-section {
  background-color: F7F7F7;
  padding-left: 0;
  padding-right: 0;
}

.contatti-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;  /* ✅ 原本是 flex-start，现在垂直居中 */
  gap: 60px;
  max-width: none;
  margin: 0 auto;
  position: relative;
  margin-left: 80px;
  margin-right: 130px;
  padding: 0;
}

.contatti-left {
  flex: 0 0 43%;
  font-family: 'Georgia', serif;
}

.contatti-title {
  /* 原有样式 */
  font-size: 6em;
  font-weight: 500;
  font-family: 'Georgia', serif;
  line-height: 1.2;
  color: #C08C54;
  margin-bottom: 70px;
}

.contatti-info {
  font-family: 'Georgia', serif;
  font-size: 1.2em;
  color: #333;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.contatti-row {
  display: flex;
  justify-content: space-between;
  padding-top: 0;
  padding-bottom: 50px;
  margin-bottom: 15px;
  border-top: none;
  border-bottom: none;
  position: relative;
}

.contatti-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.5px;
  background-color: #e0e0e0;  /* 可改为 #e0e0e0 更浅 */
}

.contatti-label {
  color: #767C8F;
  font-size: 1.1em;
}

.contatti-value {
  font-weight: 400;
  font-size: 1.1em;
  text-align: right;
}

.contatti-value a {
  text-decoration: underline;
  color: #333;
}

.contatti-right {
  flex: 0 0 45%;
  position: relative;
}

.contatti-right img {
  width: 100%;
  height: auto;
  display: block;
}

.bamboo-overlay {
  position: absolute;
  top: 15px;                /* 你可以根据需要微调这个值 */
  left: 38%;                /* 更靠左，贴近左栏 */
  width: 300px;             /* 控制大小，原先可能太大了 */
  height: auto;
  z-index: 2;               /* 保证它浮在内容上层 */
  opacity: 0.7;             /* 如果需要半透明 */
  pointer-events: none;     /* 不影响鼠标点击 */
}

.contatti-value a {
  text-decoration: underline;
  text-underline-offset: 6px;  /* ⬅ 增加一点距离 */
  text-decoration-thickness: 1.1px; /* 可选，控制线条粗细 */
}

.arial-text {
  font-family: Arial, sans-serif;
}

.contatti-location-section {
  padding-top:30px;
  padding-bottom: 150px;  /* 下边距为 60px */
  padding-left: 20px;    /* 左边距 */
  padding-right: 20px;   /* 右边距 */
  background-color: #f7f7f7;
  text-align: center;
}

.contatti-location-wrapper {
  max-width: 1500px;
  margin: 0 auto;
}

.contatti-location-title {
  font-size: 3.8em;
  font-weight: 500;
  font-family: 'Georgia', serif;
  line-height: 1.2;
  color: #333;
  margin-bottom: 50px;
}

.highlight-green {
  color: #C08C54; /* 或与你的主题金色一致 */
}

.contatti-location-subtitle {
  font-size: 1.2rem;
  color: #5a5a5a;
  line-height: 1.6;
  font-family: "IBM Plex Sans", sans-serif; /* 与你“页面内容待添加...”一致 */
}

.contatti-full-divider {
  width: 100%;
  height: 1px;
  background-color: #e0e0e0; /* 或使用 #d0d0d0 等淡灰色 */
  margin: 100px 0;           /* 上下空隙可根据需求微调 */
}

.contatti-section {
  margin-bottom: 150px; /* 你可以调为 40px、80px 取决于你想要的间距感 */
}

.contatti-map-section {
  width: 100%;
  background-color: #f9f9f9;
}

.contatti-map-wrapper {
  position: relative;
  max-width: 100%;
  overflow: hidden;
}

.map-image {
  width: 100%;
  display: block;
}

/* 所有图标共用样式 */
.map-marker {
  position: absolute;
  width: 52px;        /* 固定宽度 */
  height: auto;       /* 高度自动，保持图像原始比例 */
  object-fit: contain; /* 防止拉伸或裁剪，保持完整显示 */
}

/* 单独设置每个图标的位置（根据你实际地图中位置微调） */
.marker-1 {
  top: 48%;
  left: 49%;
}
.marker-2 {
  top: 38%;
  left: 61%;
}
.marker-3 {
  top: 46%;
  left: 56%;
}
.marker-4 {
  top: 64%;
  left: 51%;
}

.clickable-area {
  display: flex;
  align-items: center;
  font-size: 1.1em;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: inherit;
  text-decoration: none;
  padding-left: 2vw;
  cursor: pointer;
}
/* 首页导航栏专属：初始状态透明、白字、米黄色图标 */
.home-page .main-header {
  background-color: transparent;
  color: #F7F7F7;
}

.home-page .main-header .hamburger-icon {
  content: url('images/hamburger-icon-white.png');
}
.home-page .main-header.scrolled .hamburger-icon {
  content: url('images/hamburger-icon-gray.png');
}

/* ✅ 首页滚动后的导航栏样式，和其它页面一样 */
.home-page .main-header.scrolled {
  background-color: #F7F7F7;
  color: #777;
}

.home-page .main-header.scrolled .navbar-left,
.home-page .main-header.scrolled .btn-prenota {
  color: #777;
}

.home-page .main-header.scrolled .navbar-left:hover,
.home-page .main-header.scrolled .btn-prenota:hover {
  color: #C08C54;
}

.home-page .main-header .navbar-left,
.home-page .main-header .btn-prenota {
  color: #F7F7F7;
}

.home-page .main-header .navbar-left:hover,
.home-page .main-header .btn-prenota:hover {
  color: #C08C54;
}

/* 首页滚动后导航栏样式 */
body.home-page.dark-navbar .main-header.scrolled .hamburger-icon {
  content: url('images/hamburger-icon-gray.png');
}

body.home-page.dark-navbar .main-header.scrolled .menu-text {
  color: #777;
}

/* 首页悬停时金色图标和文字 */
body.home-page.dark-navbar .menu-toggle:hover .hamburger-icon {
  content: url('images/hamburger-icon-gold.png');
}

body.home-page.dark-navbar .menu-toggle:hover .menu-text {
  color: #C08C54;
}

.location-left {
  text-align: left;
}

.footer-bottom {
  display: none !important;
  border-top: none !important;
}

.menu-slide-image {
  position: fixed;
  top: -100%;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #000;
  z-index: 9998;
  transition: top 0.6s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.menu-slide-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 激活状态：滑下展示 */
.menu-slide-image.active {
  top: 0;
}

/* ✅ 使用首页布局，应用于滑出图里的导航栏 */

.menu-slide-image .main-header.overlay-header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  display: flex;
  justify-content: center; /* 保证 navbar 居中 */
  align-items: center;
  box-sizing: border-box;
  padding: 0;
  background-color: transparent; /* ✅ 防止出现白底 */
  z-index: 10000;
}

.menu-slide-image .navbar {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.menu-slide-image .navbar-left,
.menu-slide-image .navbar-right {
  display: flex;
  align-items: center;
  padding-left: 2vw !important;
  padding-right: 2vw !important;
}

.menu-slide-image .hamburger-icon {
  width: 20px;
  margin-right: 8px;
}

.menu-slide-image .btn-prenota,
.menu-slide-image .menu-text {
  font-size: 1.1em;
  font-family: inherit;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: white;
}

.menu-slide-image .logo {
  height: 50px;
  width: auto;
}

/* 初始状态：导航栏内容被“推下去”且透明 */
.menu-slide-image .navbar {
  transform: translateY(60%);
  opacity: 0;
  transition: transform 0.6s ease-out, opacity 0.6s ease-out;
}

/* 激活状态：向上滑入 */
.menu-slide-image .navbar-reveal {
  transform: translateY(0);
  opacity: 1;
}

.menu-page {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 999;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  transform: translateY(-100%);
  transition: transform 0.6s ease;
  opacity: 0;
  transform: translateY(-150%);
  transition: opacity 0.6s ease, transform 0.6s ease;
  will-change: transform;
}

.menu-page.active {
  transform: translateY(0);
  opacity: 1;
}

.menu-links {
  text-align: center;
  z-index: 1000;
}

.menu-links a {
  display: inline-block;
  font-size: 6vw;              /* 👈 字体更大 */
  color: white;
  text-decoration: none;
  margin: 2.5vw 3vw;           /* 👈 上下左右间距更大 */
  position: relative;
  transition: color 0.3s ease;
  font-family: 'Playfair Display', serif;  /* 保留高级衬线字体 */
  font-weight: 500;
  letter-spacing: 1.5px;       /* 👈 字母间距更宽 */
  line-height: 1.4;            /* 👈 行距更宽 */
  text-transform: none;        /* 👈 保留首字母大写，如你现在的样式 */
}

.menu-links a::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: white;
  transform: scaleX(0);
  transition: transform 0.3s ease;
  transform-origin: bottom right;
}

.menu-links a:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}

.menu-links {
  transform: translateY(60%);
  opacity: 0;
  transition: transform 0.5s ease-out 0.2s, opacity 0.5s ease-out 0.2s;
}

.menu-page.active .menu-links {
  transform: translateY(0);
  opacity: 1;
}

.menu-links a.current-page {
  position: relative;
}

.menu-links a.current-page::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: white;
  transform: scaleX(1);
  transform-origin: bottom left;
}

.menu-links {
  max-width: 80vw;
  margin: 0 auto;
  text-align: center;
  pointer-events: none;       /* ✅ 默认不接受点击 */
}

.menu-links > div {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px 40px; /* 控制链接之间间距 */
}

.menu-links a {
  display: inline-flex;              /* ✅ 精确包裹内容 */
  align-items: center;
  justify-content: center;
  padding: 6px 10px;                 /* ✅ 缩小内边距 */
  font-size: 5vw;
  max-width: none;                  /* ✅ 去掉横向限制 */
  line-height: 1.2;
  pointer-events: auto;       /* ✅ 仅按钮可点击 */
}
/* ========== 响应式优化 ========== */

/* 屏幕宽度小于 1024px（平板） */
@media (max-width: 1024px) {
  .highlight-wrapper,
  .chef-wrapper,
  .split-block-wrapper,
  .footer-columns {
    flex-direction: column;
    align-items: center;
  }

  .highlight-text,
  .highlight-image,
  .chef-left,
  .chef-right,
  .footer-column {
    flex: 1 1 100%;
    max-width: 100%;
    padding: 20px;
    text-align: center;
  }

  .highlight-image img,
  .chef-left .chef-photo {
    width: 90%;
    margin: 0 auto;
    transform: none;
  }

  .highlight-image img {
    margin-right: 0;
  }
}

/* 屏幕宽度小于 768px（手机） */
@media (max-width: 768px) {
  .hero-section {
    height: 100vh;
  }

  .hero-text-overlay h1,
  .hero-text-overlay h2,
  .highlight-heading,
  .section-title,
  .split-title,
  .experience-title {
    font-size: 2.2em;
  }

  .highlight-text p,
  .section-text,
  .split-description,
  .main-text-block {
    font-size: 1.1em;
    line-height: 1.6;
  }

  .btn-menu,
  .split-button,
  .btn-prenota {
    font-size: 0.9em;
    padding: 10px 16px;
  }

  .icon-marquee-track {
    gap: 30px;
  }

  .marquee-icon {
    height: 80px;
  }

  .footer-columns {
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
  }

  .footer-column {
    width: 100%;
    max-width: 100%;
  }

  .footer-bottom {
    flex-direction: column;
    text-align: center;
  }

  .footer-bottom-left,
  .footer-bottom-right {
    margin-top: 10px;
  }

  .experience-overlay-global {
    font-size: 12vw;
    line-height: 1.1;
    white-space: normal;
    text-align: center;
  }
  @media (max-width: 768px) {
  .footer-column.icon-only {
    align-items: center; /* 居中对齐 */
    justify-content: center;
  }

  .footer-column.icon-only img {
    margin: 0 auto;
  }
}
@media (max-width: 768px) {
  .btn-menu {
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 768px) {
  .split-block {
    min-height: auto;
  }
}


@media (max-width: 768px) {
  .placeholder-content {
    padding: 60px 20px;  /* 缩小左右间距，原来是 50px */
  }

@media (max-width: 768px) {
  .main-text-block {
    font-size: 1.6em;       /* 字号缩小，原为1.8em */
    line-height: 1.6;       /* 行距略放大 */
    padding: 0 16px;        /* 左右留白 */
    text-align: center;     /* 保持居中 */
  }

  .main-text-block p {
    font-size: 1.2em;       /* 子段落进一步缩小字体 */
    line-height: 1.6;
  }

  .main-text-block span[class^="icon-"] {
    width: 1.6em;           /* 图标大小缩小 */
    height: 1.6em;
    margin: 0 5px;
  }
}
  }
  @media (max-width: 768px) {
  .highlight-text {
    padding-left: 10px;
    padding-right: 10px;
  }

  .chef-right {
    padding-left: 10px;
    padding-right: 10px;
  }
}
@media (max-width: 768px) {
  .experience-section::before {
    width: 300px;
    height: 300px;
  }
}

@media (max-width: 768px) {
  .split-block {
    min-height: auto; /* 去掉默认高度 */
  }
  }
}
/* 增大首页底部哲学/地点图标标题按钮大小，仅桌面端 */
@media (min-width: 1025px) {
  .split-icon {
    width: 120px;
  }

  .split-title {
    font-size: 4.0em;
  }

  .split-button {
    font-size: 1.05em;
    padding: 14px 26px;
  }
}
@media (max-width: 768px) {
  .highlight-wrapper {
    flex-direction: column; /* ✅ 手机端变为上下排列 */
  }

  .highlight-text {
    order: 1; /* 保持文字区域靠前 */
    padding-left: 10px;
    padding-right: 10px;
  }

  .highlight-text .highlight-heading {
    margin-bottom: 20px;
  }

  .highlight-image {
    order: 2; /* ✅ 把图片从右侧调到标题下方 */
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 20px 0;
  }

  .highlight-image img {
    width: 90%;
    max-width: 420px;
    margin: 0 auto;
    border-radius: 10px;
  }

  .highlight-text p {
    order: 3;
  }

  .btn-menu {
    order: 4;
    margin-top: 30px;
  }
}
@media (max-width: 768px) {
  .highlight-text .highlight-heading {
    margin-top: 0px; /* ✅ 原来可能是较大值，这里强制减小 */
    margin-bottom: 20px; /* 已有的，不动 */
  }
}
@media (max-width: 768px) {
  .experience-section {
    padding-top: 60px;
    padding-bottom: 0px;
  }

  .experience-title {
    margin-top: 0; /* 如仍然觉得太近，可改为10px~20px */
  }

  .experience-image-wrapper {
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
@media (max-width: 768px) {
  .experience-overlay-global {
    bottom: 800px; /* 或者更小的值，微调它离底部的距离 */
  }
}

@media (max-width: 768px) {
  .experience-section::before {
    display: none !important;
    content: none !important;
    background-image: none !important;
  }
}
@media (max-width: 768px) {
  .icon-marquee {
    padding-top: 0px;   /* 原来是 40px，可改为 10px 或 0px */
    margin-top:-65px;    /* 如还需要，可额外减少外间距 */
  }
}
/* ===== MENU 页面响应式专用样式 ===== */
@media (max-width: 768px) {
  .menu-title {
    font-size: 3.4em;
  }

  .menu-icon-right {
    width: 60px;
  }

  .menu-header-section {
    padding: 40px 6vw 60px;
  }

  .menu-intro-container {
    font-size: 1.4em;
    padding: 0 20px;
  }

  .menu-header-container {
    gap: 10px;         /* ✅ 缩小文字与图标之间的间距 */
  }

  .btn-discover-menu {
    font-size: 1em;
    padding: 16px 20px;
  }

  .gallery-scroll-section {
    height: 50vh;
  }

  .gallery-image {
    width: 200px;
  }
}
@media (max-width: 768px) {
  .menu-intro-container {
    font-size: 1.8em;      /* 与首页一致 */
    line-height: 1.6;
    padding: 0 10px;       /* 额外微调边距 */
  }
}
@media (max-width: 768px) {
  .btn-discover-menu {
    font-size:0.7em;       /* ✅ 继承自父级字体大小 */
    padding: 14px 22px;
    border-width: 1.5px;
  }
}
@media (max-width: 768px) {
  .menu-icon {
    margin-right: 0px;  /* 原来是 10px，移动端更紧凑 */
  }
}
@media (max-width: 768px) {
  .menu-icon-right {
    width: 60px;  /* 原图为140px，移动端可适当缩小 */
  }
}
@media (max-width: 768px) {
  .chef-left .chef-photo,
  .chef-dish {
    width: 90vw;
    max-width: 100%;
    margin: 0 auto;
    transform: none;
  }
}
@media (max-width: 768px) {
  .full-width-banner {
    margin-top: 60px;
    margin-bottom: 60px;
  }
}
@media (max-width: 400px) {
  .menu-icon-right {
    display: none;
  }

  .menu-header-container {
    justify-content: center; /* 保证标题居中 */
  }
}

@media (max-width: 768px) {
  .filosofia-page .gallery-scroll-section {
    padding-top: 0px;     /* 🔧 你可以自定义这个数值 */
    padding-bottom: 0px;  /* 🔧 原来是 80px，你也可以改为更紧凑或更宽松 */
  }
}
@media (max-width: 768px) {
  .filosofia-page .full-width-banner {
    display: none;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
  }

  /* 上下段落的补偿调整（可选） */
  .filosofia-page .experience-section {
    margin-top: 0px; /* 🔧 根据你隐藏的图像高度微调，默认是100px以上 */
  }
}
@media (max-width: 768px) {
  .filosofia-page .gallery-scroll-section {
    padding-top: 30px;
    padding-bottom: 40px;
  }

  .filosofia-page .chef-section {
    padding-top: 30px;
    padding-bottom: 40px;
  }

  .filosofia-page .experience-section {
    margin-top: 0;
    padding-top: 20px;
  }
}
@media screen and (max-width: 768px) {
  .location-page .location-highlight-text .experience-title {
    font-size: 1.7em;
    line-height: 1.5;
    text-align: left;
  }
}
/* 默认状态下只显示桌面图 */
.desktop-image {
  display: block;
}
.mobile-image {
  display: none;
}

@media screen and (max-width: 768px) {
  /* 移动端改为上下分栏 */
  .location-highlight-wrapper {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }

  /* 移动端使用另一张图片 */
  .desktop-image {
    display: block;
    width: 100%;
    height: auto;
  }

  /* 可选：右栏文字在手机上居中显示 */
  .location-highlight-text {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .location-page .location-highlight-section {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .location-page .location-highlight-wrapper {
    gap: 20px; /* 控制图文之间的间距 */
    padding: 0 20px;
  }

  .location-page .gallery-scroll-section {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .location-page .experience-section {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}
@media (max-width: 768px) {
  .location-page .location-highlight-text .experience-title {
    font-size: 1.6em;
    line-height: 1.5;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 20px;
  }

  .location-highlight-image img {
    max-width: 420px;
    width: 90%;
    height: auto;
    margin: 0 auto;
    display: block;
  }

  .location-highlight-text {
    font-size: 1.1em;
    line-height: 1.7;
    padding: 0 10px;
    text-align: center;
  }

  .contatti-wrapper {
    flex-direction: column;
    align-items: center;
    margin: 0 20px;
    gap: 40px;
  }

  .contatti-left,
  .contatti-right {
    width: 100%;
    padding: 0 10px;
  }

  .contatti-title {
    font-size: 3.4em;
    text-align: center;
  }

  .contatti-info {
    font-size: 1em;
    text-align: left;
  }

  .bamboo-overlay {
    display: none;
  }

  .contatti-map-wrapper {
    padding: 0;
  }

  .map-marker {
    width: 42px;
  }

  .footer-column {
    text-align: center;
    padding: 0 10px;
  }
}
/* 默认隐藏新地图 */
.mobile-map {
  display: none;
  width: 100%;
  height: auto;
}

/* 仅在移动端显示 */
@media (max-width: 768px) {
  .contatti-map-wrapper .mobile-map {
    display: block;
  }

  /* 如果你还保留旧图标定位式地图，记得隐藏它们 */
  .contatti-map-wrapper .map-image,
  .contatti-map-wrapper .map-marker {
    display: none;
  }
}
@media (max-width: 768px) {
  .navbar-left .btn-prenota {
    display: none;
  }

  .navbar-right {
    display: none;
  }
}
  .main-header {
    padding-top: 30px;  /* ✅ 增加顶部内边距 */
    padding-bottom: 30px;  /* ✅ 增加底部内边距 */
  }

  .logo {
    height: 50px; /* ✅ 保持 logo 大小不变 */
  }

  .navbar-center {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  /* 推荐修改 */
.main-header.scrolled {
  padding-top: 30px;
  padding-bottom: 30px;
  /* 不要覆盖颜色 */
}

  
  .main-header {
    background-color: #F7F7F7;
  }
  @media (max-width: 768px) {
  /* 汉堡图标变大 */
  .hamburger-icon {
    width: 28px;
    height: auto;
  }

  /* 移动端整体按钮位置靠右上 */
  .menu-toggle {
    position: absolute;
    top: 20px;        /* 距离顶部 */
    left: 16px;       /* 如果你想靠右，用 right 替换 left */
    display: flex;
    align-items: center;
    z-index: 9999;
  }

  /* MENU 字体稍微缩小些以适配移动端 */
  .menu-text {
    font-size: 14px;
  }
}
@media (max-width: 768px) {
  .contatti-location-title {
    font-size: 2.2em; /* 你可以根据需要再小一点，例如2.2rem */
    line-height: 1.2;  /* 可选，调整行间距 */
  }
}
@media (max-width: 768px) {
  .contatti-full-divider {
    margin: 20px 0;
  }
}
@media (max-width: 768px) {
  .contatti-location-section {
    padding-top: 20px;
    padding-bottom: 80px;
  }
}
@media (max-width: 768px) {
  .bamboo-overlay {
    display: none;
  }
}
@media (max-width: 768px) {
  .corner-icon {
    display: none !important;
  }
}
@media (max-width: 768px) {
  /* 隐藏滑出菜单页中的 logo 和 prenota */
  .menu-slide-image .navbar-center,
  .menu-slide-image .navbar-right {
    display: none;
  }

  /* 五个按钮改为竖排并放大字体 */
  .menu-links > div {
    flex-direction: column;
    gap: 20px; /* 垂直间距 */
  }

  .menu-links a {
    font-size: 2.2em !important; /* 覆盖之前的 vw 设置 */
    margin: 10px 0;             /* 上下间距 */
  }
}
@media (max-width: 768px) {
  .menu-slide-image .overlay-header .navbar {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .menu-slide-image .overlay-header .navbar-left,
  .menu-slide-image .overlay-header .menu-toggle {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    top: 20px !important;
    left: 16px !important;
    position: absolute !important;
    display: flex !important;
    align-items: center !important;
    z-index: 9999 !important;
  }

  .menu-slide-image .hamburger-icon {
    width: 28px;
    height: auto;
  }

  .menu-slide-image .menu-text {
    font-size: 14px;
    margin-left: 6px;
  }
}