@charset "UTF-8";
:root {
  --green: #007f61;
  --cream: #fbfaf5;
  --ink: #15231f;
  --muted: #66736f;
  --serif: 'Noto Serif TC', serif;
  --max: 1600px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scrollbar-color: var(--green) rgba(0, 127, 97, 0.12);
}

/* 綠色捲軸（Chrome / Edge / Safari） */
::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-button,
::-webkit-scrollbar-button:single-button,
::-webkit-scrollbar-button:vertical:start,
::-webkit-scrollbar-button:vertical:end,
::-webkit-scrollbar-button:horizontal:start,
::-webkit-scrollbar-button:horizontal:end {
  display: none;
  width: 0;
  height: 0;
  background: transparent;
}

::-webkit-scrollbar-track {
  background: rgba(0, 127, 97, 0.1);
}

::-webkit-scrollbar-thumb {
  background: var(--green);
  border-radius: 999px;
  border: 3px solid transparent;
  background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
  background: #00694f;
  background-clip: content-box;
}

.langTransition {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  pointer-events: none;
}
.langTransition.isActive {
  visibility: visible;
  pointer-events: auto;
}
.langTransition {
  /* 兩層簾幕：前後不同綠、掀開時間錯開 → 層次感 */
}
.langTransition .curtain {
  position: absolute;
  inset: 0;
  transform: translateY(-100%);
  transition: transform 0.62s cubic-bezier(0.76, 0, 0.24, 1);
}
.langTransition .curtain1 {
  background: #00694f;
}
.langTransition .curtain2 {
  background: var(--green);
}
.langTransition {
  /* logo：小一點、輕微下落 */
}
.langTransition img {
  position: relative;
  z-index: 2;
  width: clamp(64px, 8vw, 104px);
  height: auto;
  opacity: 0;
  transform: translateY(-14px) scale(0.94);
  transition: opacity 0.4s ease, transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
.langTransition {
  /* 頁面載入 loading：簾幕與 logo 立即覆蓋（無進場動畫），JS 再掀開 */
}
.langTransition.isLoading .curtain {
  transform: translateY(0);
  transition: none;
}
.langTransition.isLoading img {
  opacity: 1;
  transform: none;
  transition: none;
}
.langTransition {
  /* 減少動態偏好時的收尾：整層淡出 */
}
.langTransition.isFadeOut {
  opacity: 0;
  transition: opacity 0.4s ease;
}
.langTransition {
  /* 進場：簾幕由上往下蓋滿，後層先、前層後 */
}
.langTransition.isCovering .curtain {
  transform: translateY(0);
}
.langTransition.isCovering .curtain2 {
  transition-delay: 0.09s;
}
.langTransition.isCovering img {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition-delay: 0.26s;
}
.langTransition {
  /* 退場：簾幕繼續往下掀出畫面，前層先、後層後 */
}
.langTransition.isLeaving .curtain {
  transform: translateY(100%);
}
.langTransition.isLeaving .curtain1 {
  transition-delay: 0.09s;
}
.langTransition.isLeaving img {
  opacity: 0;
  transform: translateY(14px) scale(0.98);
}

@media (prefers-reduced-motion: reduce) {
  .langTransition .curtain,
  .langTransition img {
    transition-duration: 0.01ms;
  }
}
body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: var(--serif);
  line-height: 1.85;
  letter-spacing: 0.02em;
  overflow-x: hidden;
}

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

p {
  margin: 0;
}

h1, h2, h3 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: 0.04em;
}

h2 {
  font-size: clamp(24px, 4vw, 36px);
}

h3 {
  font-size: clamp(22px, 2vw, 30px);
}

.section {
  position: relative;
  padding: clamp(70px, 6.15vw, 118px) 7vw;
}

.wrap {
  width: min(var(--max), 100%);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  color: #b79b5c;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.eyebrow::before {
  content: "";
  width: 17px;
  height: 6px;
  background-image: radial-gradient(circle 3px at 3px 50%, currentColor 99%, transparent 100%), radial-gradient(circle 3px at 14px 50%, #b79b5c 99%, transparent 100%);
  background-repeat: no-repeat;
  opacity: 0.85;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 0 32px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-weight: 700;
  letter-spacing: 0.08em;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  cursor: pointer;
}
.btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 36px rgba(0, 52, 39, 0.16);
}

.btnPrimary {
  background: var(--green);
  color: var(--cream);
}

.btnLight {
  background: var(--cream);
  color: var(--green);
}

/* 英文語系按鈕微調 */
html[lang=en] .btn {
  padding: 12px 32px;
  line-height: 23px;
}

.bannerArea {
  position: relative;
  display: grid;
  grid-template-columns: 1.2fr 1.85fr;
  align-items: stretch;
  /* 920px 出現在 1920 寬（920/1920≈47.9vw）；螢幕變窄時整個 banner 等比例縮小 */
  min-height: clamp(520px, 47.9vw, 920px);
  background-image: url("../images/banner-bg.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  overflow: hidden;
}
.bannerArea::before {
  content: "";
  position: absolute;
  top: 0;
  left: 16vw;
  width: min(44%, 630px);
  aspect-ratio: 888/534;
  background: url("../images/banner-map.png") no-repeat center/contain;
  opacity: 0.7;
  z-index: 1;
  pointer-events: none;
}
.bannerArea h1 {
  font-size: clamp(32px, 7.58vw - 62.3px, 72px);
  line-height: 1.35;
  letter-spacing: 0.05em;
  color: #10251f;
}
html[lang=en] .bannerArea h1 {
  font-size: clamp(32px, 4.6vw, 42px);
}
.bannerArea .btn {
  margin-top: 34px;
  align-self: flex-start;
  min-width: 200px;
}

.navLogo {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 18px 30px;
  background: var(--green);
}
.navLogo img {
  display: block;
  height: 48px;
  width: auto;
}

/* 英文版 logo 為超長橫式，綠框維持與中文版相同大小（約 150×84），logo 依寬度縮放置中 */
html[lang=en] .navLogo {
  width: 150px;
  height: 84px;
  padding: 0;
}
html[lang=en] .navLogo img {
  height: auto;
  width: 118px;
}

.langSwitch {
  position: absolute;
  top: 30px;
  right: 7vw;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: var(--green);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.langPill {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  letter-spacing: 0.05em;
}

.langBtn {
  border: 0;
  background: transparent;
  color: rgba(0, 127, 97, 0.55);
  font-family: var(--serif);
  font-weight: 700;
  cursor: pointer;
  padding: 0;
}
.langBtn.isActive {
  color: var(--green);
}

.bannerCopy {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 750px;
  padding: 150px 0vw 90px 10vw;
}

.heroQuote {
  color: #0c6a52;
  font-size: clamp(15px, 1.25vw, 18px);
  font-weight: 600;
  margin-bottom: 24px;
  letter-spacing: 0.055em;
}

.heroSubtitle {
  margin-top: 24px;
  color: #4a5a55;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.95;
  letter-spacing: 0.02em;
}

/* 英文版內文統一縮小字級 */
html[lang=en] .heroSubtitle,
html[lang=en] .brandDesc,
html[lang=en] .marketSubtitle,
html[lang=en] .partnerLead,
html[lang=en] .checkList li,
html[lang=en] .noticeList li,
html[lang=en] .locationItem p,
html[lang=en] .stepItem p,
html[lang=en] .priorityBox p,
html[lang=en] .marketNote,
html[lang=en] .disclaimer {
  font-size: 13px;
}

/* 中文內文一律加粗 700 */
html[lang=zh-Hant] p, html[lang=zh-Hant] li {
  font-weight: 700;
}

.bannerScript {
  align-self: flex-start;
  display: inline-block;
  margin-top: 44px;
  color: rgba(255, 255, 255, 0.95);
  font-family: "Allura", cursive;
  font-size: clamp(24px, 2.6vw, 36px);
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
  transform: rotate(-5deg);
  transform-origin: left center;
  text-shadow: 0 2px 14px rgba(0, 80, 60, 0.3);
}
html[lang=zh-Hant] .bannerScript {
  font-weight: 400;
}

.bannerMedia {
  --store-x: 0px;
  --store-y: clamp(30px, 6.2vw, 93px);
  --store-scale: 1;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  height: 100%;
  padding: 0;
}

/* 店面圖位置微調：改上面三個變數即可 —— --store-x 左右(負左正右)、--store-y 上下(負上正下)、--store-scale 縮放 */
.bannerStore {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  transform-origin: right bottom;
  transform: translate(var(--store-x, 0px), var(--store-y, 0px)) scale(var(--store-scale, 1));
}

/* 飄葉裝飾 */
.bannerLeaf {
  position: absolute;
  z-index: 4;
  pointer-events: none;
  user-select: none;
  transform-origin: center bottom;
  animation: leafSway 6s ease-in-out infinite;
}

.leafA {
  width: clamp(200px, 24vw, 360px);
  right: -3%;
  bottom: -12%;
  transform-origin: right bottom;
  animation-duration: 6.5s;
}

.leafB {
  width: clamp(150px, 17vw, 260px);
  left: -3%;
  bottom: 0;
  transform-origin: left bottom;
  animation-duration: 5.4s;
  animation-delay: -1.6s;
}

.leafC {
  width: clamp(48px, 6vw, 92px);
  left: 44%;
  bottom: 40%;
  animation-name: leafSwayTilt;
  animation-duration: 4.6s;
}

.leafD {
  width: clamp(30px, 4vw, 60px);
  left: 42%;
  bottom: 54%;
  animation-name: leafSwayFlip;
  animation-duration: 5.2s;
  animation-delay: -0.8s;
}

@keyframes leafSway {
  0%, 100% {
    transform: rotate(-2.5deg);
  }
  50% {
    transform: rotate(2.5deg);
  }
}
@keyframes leafSwayTilt {
  0%, 100% {
    transform: rotate(-16deg);
  }
  50% {
    transform: rotate(4deg);
  }
}
@keyframes leafSwayFlip {
  0%, 100% {
    transform: scaleX(-1) rotate(-8deg);
  }
  50% {
    transform: scaleX(-1) rotate(8deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .bannerLeaf {
    animation: none;
  }
}
.philosophyArea {
  text-align: center;
  background: var(--cream);
  padding: clamp(90px, 9vw, 160px) clamp(40px, 15vw, 300px);
}

.quoteBlock {
  max-width: 1160px;
  margin: 0 auto;
}
.quoteBlock h2 {
  margin-bottom: 30px;
  color: var(--ink);
}

.brandKeywords {
  margin-bottom: 30px;
  color: var(--green);
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(30px, 4.6vw, 54px);
  line-height: 1.32;
  letter-spacing: 0.06em;
}
html[lang=en] .brandKeywords {
  font-size: clamp(30px, 4.6vw, 52px);
}
.brandKeywords .kwX {
  color: #a9c1b7;
  font-weight: 400;
  font-size: 0.62em;
  margin: 0 0.28em;
  vertical-align: 0.06em;
}

.brandDesc {
  max-width: 920px;
  margin: 0 auto;
  color: var(--muted);
  font-size: 17px;
  line-height: 2.05;
}

.brandPhotos {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 62px 0 50px;
}

/* 右下角環狀文字：襯在卡牌後方持續旋轉 */
.brandRing {
  position: absolute;
  z-index: -1;
  right: -50px;
  bottom: -122px;
  width: clamp(180px, 19vw, 280px);
  height: clamp(180px, 19vw, 280px);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.9s ease;
}
.brandRing svg {
  width: 100%;
  height: 100%;
  transform-origin: center;
  animation: brandRingSpin 26s linear infinite;
}
.brandRing text {
  font-family: var(--serif);
  font-size: 33px;
  font-weight: 500;
  letter-spacing: 2px;
  fill: rgba(183, 155, 92, 0.5);
  text-transform: uppercase;
}
.brandRing .brandRingImg {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 28%;
  height: auto;
  transform: translate(-50%, -50%);
  transform-origin: center;
  pointer-events: none;
  user-select: none;
  animation: noticeCupBob 4.5s ease-in-out infinite;
}

/* 卡牌展開、左右裝飾物件飛入定位後（約 3s）環狀文字才淡入 */
.brandPhotos.isVisible .brandRing {
  opacity: 1;
  transition-delay: 3s;
}

@keyframes brandRingSpin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .brandRing svg {
    animation: none;
  }
  .brandRing .brandRingImg {
    animation: none;
  }
  .brandRing {
    opacity: 1;
    transition: none;
  }
}
/* 卡牌容器本身保持可見，動畫交給下面的卡片處理 */
.brandPhotos.reveal {
  opacity: 1;
  transform: none;
  transition: none;
}

.brandPhoto {
  width: min(30%, 300px);
  aspect-ratio: 3/3.7;
  object-fit: cover;
  border-radius: 18px;
  /* 展開後（最終）位置 */
}
.brandPhoto.photo1 {
  transform: rotate(-10deg);
  margin-right: -7px;
}
.brandPhoto.photo2 {
  position: relative;
  z-index: 2;
  transform: rotate(0deg) scale(1.04);
  box-shadow: -3px 3px 17px 6px rgba(0, 0, 0, 0.2588235294);
}
.brandPhoto.photo3 {
  transform: rotate(10deg);
  margin-left: -7px;
}

.brandQuote {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2.5vw, 36px);
  margin: 0;
  color: var(--green);
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(20px, 2.2vw, 26px);
  letter-spacing: 0.05em;
}

/* 手機才斷行用；桌機隱藏（不斷行） */
.mbBreak {
  display: none;
}

.brandQuote::before, .brandQuote::after {
  content: "";
  flex: 0 0 auto;
  width: clamp(40px, 10vw, 150px);
  height: 1px;
}

.brandQuote::before {
  background: linear-gradient(to right, transparent, rgba(0, 127, 97, 0.45));
}

.brandQuote::after {
  background: linear-gradient(to left, transparent, rgba(0, 127, 97, 0.45));
}

/* 英文版移除 brandQuote 兩側線條 */
html[lang=en] .brandQuote::before,
html[lang=en] .brandQuote::after {
  display: none;
}

/* 英文版限制寬度，讓句子斷成兩排並置中 */
html[lang=en] .brandQuote {
  max-width: 20em;
  margin: 0 auto;
  text-align: center;
  line-height: 1.4;
}

/* 大螢幕（≥1400px）英文版放寬 */
@media (min-width: 1400px) {
  html[lang=en] .brandQuote {
    max-width: 25em;
  }
}

/* 卡牌展開動畫（桌機＋手機）：一開始集中疊在中間，滑入視窗後展開 */
.brandPhoto {
  transition: transform 1s cubic-bezier(0.22, 0.9, 0.3, 1);
  will-change: transform;
}

.brandPhotos:not(.isVisible) .brandPhoto.photo1 {
  transform: translateX(calc(100% - 14px)) rotate(-5deg);
}

.brandPhotos:not(.isVisible) .brandPhoto.photo2 {
  transform: rotate(0deg) scale(1.04);
  z-index: 3;
}

.brandPhotos:not(.isVisible) .brandPhoto.photo3 {
  transform: translateX(calc(-100% + 14px)) rotate(6deg);
}

.brandPhotos.isVisible .brandPhoto.photo1,
.brandPhotos.isVisible .brandPhoto.photo3 {
  transition-delay: 0.8s;
}

@media (prefers-reduced-motion: reduce) {
  .brandPhoto {
    transition: none;
  }
}
.philosophyArea {
  overflow: hidden;
}

.brandDeco {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  user-select: none;
}

/* 左上角小葉叢（水平翻轉） */
.decoLeaf1 {
  top: 8%;
  left: -3%;
  width: clamp(60px, 9vw, 140px);
  transform: scaleX(-1) rotate(-4deg);
}

/* 右下角大葉片（模糊，水平翻轉回自然方向） */
.decoLeaf3 {
  bottom: 11%;
  right: -4%;
  width: clamp(160px, 18vw, 270px);
  opacity: 0.5;
}

/* 兩片亮綠小葉子（中間偏上、右側下方） */
.decoLeafSm1 {
  top: 45%;
  left: 19%;
  width: clamp(27px, 2.6vw, 57px);
  transform: rotate(-3deg);
}

.decoLeafSm2 {
  top: 54%;
  right: 18%;
  width: clamp(30px, 2.8vw, 60px);
  transform: rotate(-90deg);
}

/* 左側中段檸檬片 */
.decoLemon {
  top: 49%;
  left: 13%;
  width: clamp(80px, 5.5vw, 200px);
  transform: rotate(-8deg);
}

/* 檸檬片下方再加一顆較小、水平翻轉的檸檬 */
.decoLemon2 {
  top: 61%;
  left: 12%;
  width: clamp(46px, 3.2vw, 118px);
  transform: scaleX(-1) rotate(10deg);
}

/* 左側冰塊（上、下各一） */
.decoIce1 {
  top: 35%;
  left: 10%;
  width: clamp(46px, 5vw, 55px);
  transform: rotate(-10deg);
}

.decoIce2 {
  top: 66%;
  left: 12%;
  width: clamp(40px, 3.7vw, 125px);
  transform: rotate(12deg);
}

/* 左側氣泡水珠背景層（整片鋪、往下延伸）：疊在最後面 */
.decoBubbleL {
  top: 7%;
  left: 2%;
  width: clamp(340px, 36vw, 740px);
  opacity: 0.8;
  z-index: 0;
}

/* 右側氣泡水珠背景層（整片鋪）：疊在最後面 */
.decoBubbleR {
  top: 21%;
  right: 1%;
  width: clamp(320px, 34vw, 600px);
  opacity: 0.8;
  z-index: 0;
}

/* 右側兩顆珍珠（偏內側） */
.decoPearl1 {
  top: 47%;
  right: 20%;
  width: 47px;
}

.decoPearl2 {
  top: 39%;
  right: 15.5%;
  width: 75px;
}

/* 右側蒟蒻（珍珠下方、靠近環字）：上下各一 */
.decoKonjac1 {
  top: 55%;
  right: 11%;
  width: clamp(40px, 4.2vw, 100px);
  transform: rotate(-6deg);
}

.decoKonjac2 {
  top: 64%;
  right: 14%;
  width: clamp(30px, 2.9vw, 74px);
  transform: scaleX(-1) rotate(10deg);
}

/* ===== 進場：卡牌展開後（decoReady），裝飾物從中間飛散到定位 ===== */
.brandDeco {
  transition: opacity 0.7s ease, scale 0.8s cubic-bezier(0.2, 1.1, 0.3, 1), translate 0.9s cubic-bezier(0.2, 1.05, 0.35, 1);
}

/* 觸發前：縮小、透明、藏在中間（左右兩片大葉子除外，它們本來就在定位） */
.philosophyArea:not(.decoReady) .brandDeco:not(.decoLeaf1):not(.decoLeaf3) {
  opacity: 0;
  scale: 0.3;
}

.philosophyArea:not(.decoReady) .decoLeafSm1 {
  translate: 26vw 2vh;
}

.philosophyArea:not(.decoReady) .decoLeafSm2 {
  translate: -26vw -3vh;
}

.philosophyArea:not(.decoReady) .decoLemon {
  translate: 30vw 3vh;
}

.philosophyArea:not(.decoReady) .decoLemon2 {
  translate: 30vw 6vh;
}

.philosophyArea:not(.decoReady) .decoIce1 {
  translate: 27vw 12vh;
}

.philosophyArea:not(.decoReady) .decoIce2 {
  translate: 31vw -10vh;
}

.philosophyArea:not(.decoReady) .decoBubbleL {
  translate: 24vw 22vh;
}

.philosophyArea:not(.decoReady) .decoBubbleR {
  translate: -26vw 16vh;
}

.philosophyArea:not(.decoReady) .decoPearl1 {
  translate: -24vw 2vh;
}

.philosophyArea:not(.decoReady) .decoPearl2 {
  translate: -25vw 5vh;
}

.philosophyArea:not(.decoReady) .decoKonjac1 {
  translate: -26vw -4vh;
}

.philosophyArea:not(.decoReady) .decoKonjac2 {
  translate: -24vw 6vh;
}

/* 觸發後：延遲約 1.8s（等卡牌展開完）飛回定位，並做前後波次 */
.philosophyArea.decoReady .brandDeco {
  translate: 0 0;
  transition-delay: 1.85s;
}

.philosophyArea.decoReady .decoLemon,
.philosophyArea.decoReady .decoLemon2,
.philosophyArea.decoReady .decoIce1,
.philosophyArea.decoReady .decoIce2 {
  transition-delay: 2s;
}

.philosophyArea.decoReady .decoLeafSm1,
.philosophyArea.decoReady .decoLeafSm2,
.philosophyArea.decoReady .decoPearl1,
.philosophyArea.decoReady .decoPearl2,
.philosophyArea.decoReady .decoKonjac1,
.philosophyArea.decoReady .decoKonjac2 {
  transition-delay: 2.15s;
}

/* 飄浮動態：用獨立 translate（不蓋掉 rotate/scaleX），進場完成後（delay ~3.3s）才啟動 */
@keyframes decoFloatA {
  0%, 100% {
    translate: 0 0;
  }
  50% {
    translate: 0 -16px;
  }
}
@keyframes decoFloatB {
  0%, 100% {
    translate: 0 0;
  }
  50% {
    translate: 7px -12px;
  }
}
.philosophyArea.decoReady .decoLeafSm1 {
  animation: decoFloatB 6.2s ease-in-out 3.3s infinite;
}

.philosophyArea.decoReady .decoLeafSm2 {
  animation: decoFloatA 6.8s ease-in-out 3.4s infinite;
}

.philosophyArea.decoReady .decoLemon {
  animation: decoFloatA 7s ease-in-out 3.3s infinite;
}

.philosophyArea.decoReady .decoLemon2 {
  animation: decoFloatB 6.6s ease-in-out 3.45s infinite;
}

.philosophyArea.decoReady .decoIce1 {
  animation: decoFloatB 5.5s ease-in-out 3.5s infinite;
}

.philosophyArea.decoReady .decoIce2 {
  animation: decoFloatA 6.5s ease-in-out 3.4s infinite;
}

.philosophyArea.decoReady .decoBubbleL {
  animation: decoFloatA 9s ease-in-out 3.2s infinite;
}

.philosophyArea.decoReady .decoBubbleR {
  animation: decoFloatB 8.5s ease-in-out 3.4s infinite;
}

.philosophyArea.decoReady .decoPearl1 {
  animation: decoFloatB 5s ease-in-out 3.5s infinite;
}

.philosophyArea.decoReady .decoPearl2 {
  animation: decoFloatA 5.8s ease-in-out 3.6s infinite;
}

.philosophyArea.decoReady .decoKonjac1 {
  animation: decoFloatA 6.4s ease-in-out 3.5s infinite;
}

.philosophyArea.decoReady .decoKonjac2 {
  animation: decoFloatB 5.9s ease-in-out 3.6s infinite;
}

/* 降低動態偏好：直接淡入、不飛不飄 */
@media (prefers-reduced-motion: reduce) {
  .brandDeco {
    animation: none !important;
    transition: opacity 0.4s ease !important;
    scale: 1 !important;
    translate: 0 !important;
  }
}
.marketsArea {
  background: #f8f6ef;
  overflow: hidden;
}

.marketWrap {
  width: min(var(--max), 100%);
}

.marketHeader {
  text-align: center;
  margin-bottom: 42px;
}
.marketHeader h2 {
  color: var(--ink);
}

.marketSubtitle {
  margin-top: 18px;
  color: #374743;
  font-size: 18px;
}

.marketPanel {
  display: grid;
  grid-template-columns: minmax(230px, 0.68fr) minmax(0, 1.3fr) minmax(230px, 0.68fr);
  gap: 24px;
  align-items: center;
}

.marketMap {
  display: flex;
  align-items: center;
  padding: 10px 6px;
}

.worldMap {
  position: relative;
  width: 100%;
}

.worldMapImg {
  width: 100%;
  height: auto;
  display: block;
}

.mapPin {
  position: absolute;
  width: 24px;
  height: 33px;
  padding: 0;
  border: 0;
  background: transparent;
  transform: translate(-50%, -36%);
  cursor: pointer;
  z-index: 2;
}
.mapPin::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -3px;
  width: 12px;
  height: 5px;
  border-radius: 50%;
  background: rgba(0, 40, 30, 0.22);
  filter: blur(1px);
  transform: translateX(-50%);
  pointer-events: none;
}
.mapPin:hover .mapDot {
  transform: scale(1.12);
}
.mapPin.isActive .mapDot {
  animation: pinBounce 0.85s ease-in-out infinite;
}

.mapDot {
  display: block;
  width: 100%;
  height: 100%;
  background: url("../images/locate-icon-02.svg") no-repeat center/contain;
  transform-origin: center bottom;
  transition: transform 0.25s ease;
}

@keyframes pinBounce {
  0%, 100% {
    transform: translateY(0) scale(1.25);
  }
  50% {
    transform: translateY(-10px) scale(1.25);
  }
}
@keyframes pinPulse {
  0% {
    transform: scale(0.7);
    opacity: 0.7;
  }
  100% {
    transform: scale(2.4);
    opacity: 0;
  }
}
.marketList {
  padding: 0;
}

/* 海外合作「打開」特效：地圖淡入放大，左右清單由中央往外展開 */
.marketPanel.reveal {
  opacity: 1;
  transform: none;
  transition: none;
}

@media (min-width: 981px) {
  .marketMap, .marketListLeft, .marketListRight {
    transition: transform 0.95s cubic-bezier(0.22, 0.9, 0.3, 1), opacity 0.8s ease;
    will-change: transform, opacity;
  }
  .marketPanel:not(.isVisible) .marketMap {
    opacity: 0;
    transform: scale(0.9);
  }
  .marketPanel:not(.isVisible) .marketListLeft {
    opacity: 0;
    transform: translateX(55%);
  }
  .marketPanel:not(.isVisible) .marketListRight {
    opacity: 0;
    transform: translateX(-55%);
  }
  .marketPanel.isVisible .marketListLeft, .marketPanel.isVisible .marketListRight {
    transition-delay: 0.22s;
  }
}
@media (prefers-reduced-motion: reduce) {
  .marketMap, .marketListLeft, .marketListRight {
    transition: none;
  }
}
.locationItem {
  position: relative;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  padding: 25px 30px;
  border-radius: 12px;
  cursor: pointer;
  transition: background 0.25s ease, transform 0.25s ease;
  /* 分隔線改用直線的 pseudo-element，避免圓角讓線條末端翹起 */
}
.locationItem::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(0, 0, 0, 0.08);
}
.locationItem:hover, .locationItem.isActive {
  background: rgba(10, 114, 88, 0.07);
  transform: translateX(5px);
}
.locationItem:hover::after, .locationItem.isActive::after {
  opacity: 0;
}
.locationItem {
  /* 隱藏 hover 項目上方的分隔線（前一個項目的底線） */
}
.locationItem:has(+ .locationItem:hover)::after, .locationItem:has(+ .locationItem.isActive)::after {
  opacity: 0;
}
.locationItem:last-child::after {
  display: none;
}
.locationItem h3 {
  margin-bottom: 6px;
  color: var(--green);
  font-family: var(--serif);
  font-size: clamp(22px, 2vw, 18px);
  font-weight: 800;
  line-height: 1.22;
}
.locationItem p {
  color: #495854;
  font-size: 14px;
  line-height: 1.6;
  font-weight: 500;
}

.flagBadge {
  width: 42px;
  height: 42px;
  margin: 0;
  border-radius: 50%;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06), inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}
.flagBadge img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 中文國家名後方的英文名稱，可獨立調整樣式 */
.locEn {
  display: inline;
  font-size: 17px;
}

.marketNote {
  margin-top: 24px;
  text-align: center;
  color: rgba(65, 76, 72, 0.72);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.partnerArea {
  background: var(--cream);
  padding: clamp(70px, 6.15vw, 118px) 7vw clamp(100px, 9.4vw, 180px) 7vw;
  overflow-x: clip;
}
.partnerArea h2 {
  margin-bottom: 22px;
}

.partnerGrid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
  gap: 0;
  align-items: center;
}

.partnerCard {
  position: relative;
  z-index: 1;
  margin-right: -90px;
  padding: 70px 130px 70px 7vw;
  background: #fff;
  border-radius: 20px;
}

.partnerLead {
  max-width: 640px;
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 18px;
  font-weight: 500;
}

.checkList {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.checkList li {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 16px;
  align-items: center;
  color: #243531;
  font-size: 16px;
  font-weight: 600;
}
.checkList li > span {
  margin-right: 120px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.checkList li:last-child > span {
  border-bottom: 0;
}
.checkList li::before {
  content: "";
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(0, 127, 97, 0.12) url("../images/check-icon-02.svg") no-repeat center/15px auto;
}
.checkList strong {
  color: var(--ink);
  font-weight: 700;
}

.partnerMedia {
  position: relative;
  z-index: 2;
}

.partnerPhoto {
  width: 100%;
  aspect-ratio: 765/490;
  object-fit: cover;
  border-radius: 20px;
  display: block;
}

.priorityBox {
  position: absolute;
  left: -91px;
  bottom: -99px;
  width: min(580px, 88%);
  padding: 37px 43px;
  border-radius: 20px;
  background: rgb(255 253 250 / 50%);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.5);
  color: var(--ink);
  box-shadow: 2px -6px 54px #e0d1b0a3;
}
.priorityIcon {
  position: absolute;
  top: 17px;
  right: 34px;
  display: grid;
  place-items: center;
  width: 47px;
  height: 47px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.55);
  color: #b79b5c;
  box-shadow: 0 8px 20px rgba(183, 155, 92, 0.18);
}
.priorityIcon svg {
  width: 30px;
  height: 30px;
}
.priorityBox h3 {
  margin-bottom: 14px;
  padding-right: 74px;
  color: #b79b5c;
  font-size: 20px;
}
.priorityBox p {
  padding-right: 0;
}
.priorityBox p {
  color: rgba(21, 35, 31, 0.86);
  line-height: 1.85;
  font-size: 15px;
}

/* 合作夥伴進場：左卡先由左滑入，右圖再由右滑入 */
.partnerCard.reveal {
  transform: translateX(-48px);
  transition-delay: 0s !important;
}
.partnerCard.reveal.isVisible {
  transform: none;
}

.partnerMedia.reveal {
  transform: translateX(48px);
  transition-delay: 0.24s !important;
}
.partnerMedia.reveal.isVisible {
  transform: none;
}

/* 合作夥伴區塊飄葉裝飾（沿用主視覺的葉片與擺動動畫） */
.partnerLeaf {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  user-select: none;
  transform-origin: center bottom;
  animation: leafSway 6s ease-in-out infinite;
}
.partnerLeaf.pLeafA {
  width: clamp(52px, 6.4vw, 73px);
  top: 37%;
  left: 50%;
  animation-name: leafSwayTilt;
  animation-duration: 5.4s;
}
.partnerLeaf.pLeafB {
  width: clamp(46px, 5.4vw, 47px);
  top: 21%;
  left: 48%;
  animation-name: leafSwayFlip;
  animation-duration: 4.8s;
  animation-delay: -0.7s;
}

@media (prefers-reduced-motion: reduce) {
  .partnerLeaf {
    animation: none;
  }
}
.processArea {
  background: #f8f7f1;
}
.processArea .intro {
  text-align: center;
  margin-bottom: 62px;
}
.processArea .intro h2 {
  margin-top: 6px;
}
.processArea .intro p {
  max-width: 560px;
  margin: 18px auto 0;
  color: var(--muted);
  font-size: 18px;
}

.stepList {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  text-align: center;
}

.stepItem {
  position: relative;
  z-index: 1;
  padding: 0 16px;
  /* 兩個圓圈之間各自一段粗線（圓心 top = 45px），維持金色 */
}
.stepItem:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 45px;
  left: calc(50% + 60px);
  right: calc(-50% + 60px);
  height: 4px;
  border-radius: 999px;
  background: #f1eeda;
  transform: translateY(-2px);
  z-index: 0;
}
.stepItem h3 {
  margin-bottom: 10px;
  color: #b79b5c;
  font-size: 21px;
  transition: color 0.3s ease;
}
.stepItem p {
  max-width: 220px;
  margin: 0 auto;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.75;
}
.stepItem {
  /* hover：圓圈變實心綠、文字轉綠 */
}
.stepItem:hover .stepIcon {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
  box-shadow: 0 12px 26px rgba(0, 127, 97, 0.26);
}
.stepItem:hover .stepLabel, .stepItem:hover h3 {
  color: var(--green);
}

.stepIcon {
  width: 90px;
  height: 90px;
  margin: 0 auto 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #e3dac6;
  color: #b79b5c;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}
.stepIcon svg {
  width: 42px;
  height: 42px;
}

.stepLabel {
  display: block;
  margin-bottom: 10px;
  color: #b79b5c;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.24em;
  transition: color 0.3s ease;
}

.noticeArea {
  background: #ffffff;
  overflow-x: clip;
}

.noticeWrap {
  width: min(1040px, 100%);
}

.noticeHeader {
  text-align: center;
  margin-bottom: 42px;
}
.noticeHeader h2 {
  color: var(--ink);
}

/* 重要說明左上角小環狀文字（沿用主視覺環字的旋轉動畫） */
.noticeRing {
  position: absolute;
  z-index: 5;
  top: -64px;
  left: -65px;
  width: clamp(110px, 11.5vw, 168px);
  height: clamp(110px, 11.5vw, 168px);
  pointer-events: none;
}
.noticeRing svg {
  width: 100%;
  height: 100%;
  transform-origin: center;
  animation: brandRingSpin 26s linear infinite;
}
.noticeRing text {
  font-family: var(--serif);
  font-size: 33px;
  font-weight: 500;
  letter-spacing: 2px;
  fill: rgba(183, 155, 92, 0.5);
  text-transform: uppercase;
}
.noticeRing .noticeRingImg {
  position: absolute;
  top: 47%;
  left: 53%;
  width: 52%;
  height: auto;
  transform: translate(-50%, -50%);
  transform-origin: center;
  pointer-events: none;
  user-select: none;
  animation: noticeCupBob 4.5s ease-in-out infinite;
}

/* 珍奶輕輕上下浮動 + 微微擺頭（保留 translate 置中，避免跳位） */
@keyframes noticeCupBob {
  0%, 100% {
    transform: translate(-50%, -50%) rotate(-3deg);
  }
  50% {
    transform: translate(-50%, calc(-50% - 6px)) rotate(3deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .noticeRing svg {
    animation: none;
  }
  .noticeRing .noticeRingImg {
    animation: none;
  }
}
.noticeBox {
  position: relative;
  z-index: 1;
  padding: 60px 150px 80px 150px;
  border-radius: 24px;
  background: #fafaf6;
}
.noticeBox.isVisible .noticeCupWrap {
  opacity: 1;
  transform: translate(0, 0) rotate(0deg) scale(1);
  transition-delay: 0.35s;
}

/* 外層：進場滑入（transform 給外層，才不會和飄浮動畫打架） */
.noticeCupWrap {
  position: absolute;
  right: -56px;
  bottom: -45px;
  width: clamp(140px, 15vw, 173px);
  pointer-events: none;
  user-select: none;
  z-index: 2;
  opacity: 0;
  transform: translate(48px, 60px) rotate(14deg) scale(0.82);
  transform-origin: bottom right;
  transition: opacity 0.7s ease, transform 0.9s cubic-bezier(0.22, 1.15, 0.36, 1);
}

/* 內層：持續上下飄浮 + 輕微擺動 */
.noticeCup {
  display: block;
  width: 100%;
  height: auto;
  animation: cupFloat 4.5s ease-in-out infinite;
}

@keyframes cupFloat {
  0%, 100% {
    transform: translateY(0) rotate(-1.6deg);
  }
  50% {
    transform: translateY(-13px) rotate(1.6deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .noticeCupWrap {
    transition-duration: 0.01ms;
  }
  .noticeCup {
    animation: none;
  }
}
.noticeList {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.noticeList li {
  position: relative;
  padding: 0 0 16px 26px;
  margin-bottom: 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  color: #42534e;
  font-size: 16px;
  line-height: 1.9;
  font-weight: 500;
}
.noticeList li:last-child {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
}
.noticeList li::before {
  content: "";
  position: absolute;
  top: 0.72em;
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
}

.finalCtaArea {
  position: relative;
  background: var(--green);
  color: var(--cream);
  text-align: center;
  padding: clamp(90px, 8.3vw, 160px) 7vw 20px;
  overflow: hidden;
}
.finalCtaArea .eyebrow {
  color: #fff;
}
.finalCtaArea .eyebrow::before {
  background-image: radial-gradient(circle 3px at 3px 50%, #fff 99%, transparent 100%), radial-gradient(circle 3px at 14px 50%, #fff 99%, transparent 100%);
}
.finalCtaArea h2 {
  margin-bottom: 34px;
}
.finalCtaArea .btn {
  min-width: min(360px, 100%);
}
.finalCtaArea .btn::after {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  background-color: var(--green);
  -webkit-mask: url("../images/submit_icon-02.svg") no-repeat center/contain;
  mask: url("../images/submit_icon-02.svg") no-repeat center/contain;
}

/* footer 店員合照：鋪滿整個區塊當背景，墊在最底層 */
.footerPhoto {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 44%;
  pointer-events: none;
  user-select: none;
}

.disclaimer {
  max-width: 760px;
  margin: 30px auto 150px;
  color: rgba(251, 250, 245, 0.78);
  font-size: 12px;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

footer {
  margin: 0 calc(50% - 50vw);
  padding-top: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.22);
  color: rgba(251, 250, 245, 0.56);
  font-size: 12px;
  letter-spacing: 0.08em;
}

/* 回到頂部按鈕：置於 footer 分隔線之上、貼近視窗右緣，隨螢幕縮放 */
.backTopWrap {
  display: flex;
  justify-content: flex-end;
  margin: 0 calc(50% - 50vw) 22px;
  padding-right: clamp(16px, 3vw, 60px);
}

.backTop {
  display: grid;
  place-items: center;
  width: clamp(40px, 3.4vw, 54px);
  height: clamp(40px, 3.4vw, 54px);
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 10px 26px rgba(0, 65, 49, 0.22);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.backTop:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 32px rgba(0, 65, 49, 0.28);
}
.backTop svg {
  width: clamp(16px, 1.4vw, 22px);
  height: clamp(16px, 1.4vw, 22px);
  display: block;
  stroke: var(--green);
  stroke-width: 2.2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.75s ease, transform 0.75s ease;
}
.reveal.isVisible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 980px) {
  .bannerArea {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .bannerArea::before {
    width: 100%;
    left: 0;
  }
  .bannerLeaf {
    display: none;
  }
  /* 上下排版時文字與按鈕置中 */
  .bannerCopy {
    max-width: none;
    padding: 130px 6vw 0px;
    align-items: center;
    text-align: center;
  }
  .bannerArea .btn {
    align-self: center;
  }
  .bannerScript {
    align-self: center;
    display: none;
  }
  .bannerMedia {
    padding: 0 0vw 20px;
  }
  .bannerStore {
    max-width: 760px;
  }
  .philosophyArea {
    padding: 90px 6vw;
  }
  .brandPhotos {
    margin: 44px 0 36px;
  }
  .brandRing {
    display: none;
  }
  .noticeBox {
    padding: 32px 24px;
  }
  .noticeCupWrap {
    width: 87px;
    right: -33px;
    bottom: -54px;
  }
  .partnerGrid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .partnerLeaf {
    display: none;
  }
  .partnerCard {
    margin-right: 0;
    padding: 40px 30px;
    text-align: center;
  }
  .partnerCard .checkList {
    text-align: left;
  }
  .checkList li > span {
    margin-right: 0;
  }
  .priorityBox {
    position: static;
    width: 100%;
    margin-top: 18px;
  }
  .marketPanel {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .marketMap {
    width: 100%;
    padding-inline: 0;
    order: -1;
  }
  .worldMap {
    width: 100%;
  }
  .marketList {
    padding: 12px 0 0;
  }
  .marketListLeft .locationItem:last-child::after {
    display: block;
  }
  .locationItem {
    padding: 17px 15px;
  }
  .processArea .intro {
    display: block;
  }
  .processArea .intro p {
    margin-top: 20px;
  }
  .stepList {
    grid-template-columns: 1fr;
    gap: 28px;
    text-align: left;
  }
  .stepList::before, .stepList::after {
    display: none;
  }
  .stepItem:not(:last-child)::after {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    left: 0;
    right: 0;
    bottom: -14px;
    height: 1px;
    background: rgba(0, 0, 0, 0.08);
    transform: none;
    border-radius: 0;
  }
  .stepItem {
    display: grid;
    grid-template-columns: 90px 1fr;
    column-gap: 24px;
    align-items: center;
    padding: 0;
  }
  .stepIcon {
    grid-column: 1;
    grid-row: 1/span 3;
    margin: 0;
  }
  .stepItem .stepLabel {
    align-self: end;
    margin-bottom: 6px;
  }
  .stepItem h3 {
    margin-bottom: 4px;
  }
  .stepItem p {
    max-width: none;
    margin: 0;
  }
}
/* ≤980：品牌核心卡牌縮小，裝飾物小小地集中到卡排兩側（含手機） */
@media (max-width: 980px) {
  .brandPhoto {
    width: min(24%, 300px);
  }
  /* 左側一組 */
  .decoBubbleL {
    top: 55%;
    left: -8%;
    width: clamp(140px, 22vw, 230px);
  }
  .decoLeaf1 {
    top: 24%;
    left: -3%;
  }
  .decoLemon {
    top: 70%;
    left: 8%;
    width: clamp(46px, 4vw, 50px);
  }
  .decoLemon2 {
    top: 79%;
    left: 12%;
    width: clamp(28px, 2.6vw, 32px);
  }
  .decoIce1 {
    top: 78%;
    left: 13%;
    width: clamp(19px, 2.5vw, 25px);
  }
  .decoIce2 {
    top: 64%;
    left: 4%;
    width: clamp(25px, 2.2vw, 23px);
  }
  .decoLeafSm1 {
    top: 60%;
    left: 12%;
  }
  /* 右側一組 */
  .decoBubbleR {
    top: 40%;
    right: -8%;
    width: clamp(140px, 22vw, 230px);
  }
  .decoLeaf3 {
    top: 60%;
    bottom: auto;
    right: -4%;
    width: clamp(101px, 20vw, 210px);
  }
  .decoLeafSm2 {
    top: 68%;
    right: 11%;
  }
  .decoPearl1 {
    top: 63%;
    right: 8%;
    width: 16px;
  }
  .decoPearl2 {
    top: 58%;
    right: 14%;
    width: 25px;
  }
  .decoKonjac1 {
    top: 66%;
    right: 6%;
    width: clamp(26px, 3vw, 34px);
  }
  .decoKonjac2 {
    top: 72%;
    right: 12%;
    width: clamp(20px, 2.4vw, 26px);
  }
}
/* ≤990：重要說明環狀文字位置微調 */
@media (max-width: 990px) {
  .noticeRing {
    top: -31px;
    left: -39px;
  }
}
@media (max-width: 640px) {
  .mbBreak {
    display: inline;
  }
  .section {
    padding: 13.4vw 8vw;
  }
  .navLogo {
    padding: 12px 20px;
  }
  .navLogo img {
    height: 38px;
  }
  .langSwitch {
    top: 22px;
    right: 6vw;
    gap: 9px;
  }
  .langLabel {
    display: none;
  }
  .bannerCopy {
    padding: 96px 6vw 0px;
  }
  .leafA {
    width: 140px;
  }
  .leafB {
    width: 110px;
  }
  .leafC, .leafD {
    display: none;
  }
  .heroSubtitle, .partnerLead, .processArea .intro p {
    font-size: 14px;
  }
  .heroSubtitle {
    text-align: center;
  }
  .marketSubtitle {
    font-size: 14px;
  }
  .brandDesc, .checkList li, .noticeList li, .priorityBox p, .stepItem p {
    font-size: 14px;
  }
  .stepItem {
    grid-template-columns: 64px 1fr;
    column-gap: 18px;
  }
  .stepIcon {
    width: 64px;
    height: 64px;
  }
  .stepIcon svg {
    width: 32px;
    height: 32px;
  }
  .locationItem {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
  }
  .flagBadge {
    width: 36px;
    height: 36px;
  }
  .locationItem h3 {
    font-size: 20px;
  }
  .locationItem p {
    font-size: 14px;
  }
  .priorityBox {
    padding: 24px 22px;
  }
  .finalCtaArea {
    padding-top: 92px;
  }
  .disclaimer {
    margin-bottom: 60px;
  }
  /* 手機版裝飾物保留在卡排兩側，只降氣泡/右葉透明度 */
  .decoBubbleL, .decoBubbleR {
    opacity: 0.5;
  }
  .decoLeaf3 {
    opacity: 0.4;
  }
  /* 品牌核心 */
  .brandKeywords {
    margin-bottom: 20px;
    font-size: clamp(20px, 4.6vw, 54px);
  }
  html[lang=en] .brandKeywords {
    font-size: clamp(20px, 4.6vw, 52px);
  }
  .quoteBlock h2 {
    margin-bottom: 20px;
  }
  .brandPhoto {
    border-radius: 5px;
  }
}
/* ≤500：兩片小葉子（banner-leaf）放到標題旁邊 */
@media (max-width: 500px) {
  .decoLeafSm1 {
    top: 61%;
    left: 13%;
  }
  .decoLeafSm2 {
    bottom: 26%;
    right: 16%;
  }
}
/* ≤450：卡牌放大一點點 */
@media (max-width: 450px) {
  .brandPhoto {
    width: min(28%, 300px);
  }
}