/* V4 image trial: editorial copy on the open snow, scenery on the right. */
.hero { color: #fff9ef; min-height: max(100svh,70vw); }
.hero .hero-bg { inset: 0; width: 100%; height: 100%; object-position: 50% top; transform: none; }
.hero .hero-content > * { width: min(510px,40vw); margin-left: auto; margin-right: 0; }
.hero .hero-content { padding-block: 350px 145px; }
.hero .hero-bg { z-index: 0; }
.hero .hero-mountain-word { position: absolute; z-index: 1; top: 108px; left: 4%; width: 92%; margin: 0; text-align: left; color: #fffdf9; font: 500 clamp(78px,8.2vw,132px)/1 var(--serif); letter-spacing: .02em; text-shadow: 0 1px 0 #d8e1e6, 0 2px 0 #adbdc7, 0 4px 6px rgba(15,36,51,.22), 0 12px 24px rgba(15,36,51,.18); }
.hero .hero-mountain-mask { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; filter: saturate(1.04) contrast(1.03); }
.hero::after { z-index: 3; pointer-events: none; }
.hero .hero-content { z-index: 4; }
.hero .hero-content > .hero-destination { position: absolute; top: 135px; left: 0; width: 100%; margin: 0; color: rgba(255,253,249,.9); text-align: center; font: 400 clamp(76px,11.6vw,168px)/1 var(--serif); letter-spacing: .055em; pointer-events: none; }
.hero .hero-lead .hero-concept { margin-bottom: 14px; color: #dfc79f; font: 400 28px/1.25 var(--serif); letter-spacing: .02em; }
.hero .journey-headline .hero-place { margin: 0 0 14px; font: 300 clamp(24px,2.5vw,34px)/1.5 var(--sans); letter-spacing: .18em; }
.hero .journey-headline .hero-main-title { margin: 0; font: 300 clamp(28px,2.65vw,40px)/1.55 var(--sans); letter-spacing: .055em; }
.hero .journey-headline { margin-bottom: 18px; }
.hero .hero-date { margin-top: 0; margin-bottom: 28px; color: #e4ceb0; font-size: 14px; line-height: 1.8; letter-spacing: .08em; }
.hero .hero-actions { align-items: center; gap: 24px; }
.hero-itinerary-link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; font-size: 13px; text-decoration: none; border-bottom: 1px solid rgba(255,249,239,.35); }
.hero-itinerary-link:hover { border-color: #fff9ef; }
.hero-afterword { background: var(--pearl); color: var(--ink); padding: 38px 0; }
.hero-afterword > .shell { display: grid; grid-template-columns: .85fr 2fr; gap: 48px; align-items: center; }
.hero-afterword-intro { margin: 0; font-size: 16px; line-height: 2; color: #59646a; }
.hero-afterword .hero-meta { width: 100%; max-width: none; margin: 0; padding: 0; border: 0; }
.hero-afterword .hero-meta small { color: #59646a; }
.hero .hero-lead { color: #f3eee5; font-weight: 400; }
.hero .eyebrow { color: #dfc79f; }
.hero .eyebrow, .hero h1, .hero .hero-lead { text-shadow: none; }
.hero::after { background: linear-gradient(180deg, rgba(6,17,24,.52) 0%, rgba(6,17,24,.06) 24%, rgba(6,17,24,.12) 100%), linear-gradient(270deg, rgba(6,17,24,.74) 0%, rgba(6,17,24,.54) 38%, rgba(6,17,24,.12) 72%, transparent 100%); }
.hero .hero-meta { width: min(690px, 57vw); border-color: rgba(255,249,239,.3); }
.hero .hero-meta small { color: #eee7dd; }
.hero .button-ghost { color: #fff9ef; border-color: rgba(255,249,239,.65); background: rgba(17,37,51,.12); }
.hero .hero-stamp { left: 32px; right: auto; bottom: 64px; }
.hero .hero-photo-caption { color: #eee7dd; }
.hero .button:focus-visible { outline-color: #dfc79f; }
@media (max-width: 960px) {
  .hero-afterword > .shell { grid-template-columns: 1fr; gap: 26px; }
  .hero .hero-content > * { width: min(440px,48vw); }
  .hero .hero-meta { width: min(660px,100%); }
}
@media (max-width: 760px) {
  .hero .hero-mountain-word { z-index: 4; top: 112px; left: 4%; width: 92%; text-align: left; font-size: clamp(42px,12.2vw,86px); letter-spacing: .02em; text-shadow: 0 1px 0 #bdccd5, 0 3px 8px rgba(15,36,51,.3); }
  .hero .hero-mountain-mask { display: none; }
  .hero { display: grid; min-height: 100svh; padding-top: 0; background: #142733; }
  .hero .hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 35% center; filter: none; }
  header nav[aria-label="主要導覽"] .nav-cta { display: none; }
  .hero .hero-content { align-self: start; padding-block: 200px 280px; }
  .hero .hero-content > .hero-destination { top: 112px; left: 0; width: 100%; font-size: clamp(38px,11.2vw,80px); letter-spacing: .035em; text-align: left; }
  .hero .hero-lead .hero-concept { font-size: 25px; margin-bottom: 10px; }
  .hero .hero-content > * { width: 100%; margin-left: 0; }
  .hero .eyebrow { margin-bottom: 22px; font-size: 10px; letter-spacing: .16em; }
  .hero .journey-headline { margin-bottom: 14px; }
  .hero .journey-headline .hero-place { font-size: 18px; margin-bottom: 8px; letter-spacing: .14em; }
  .hero .journey-headline .hero-main-title { font-size: clamp(24px,6.3vw,36px); letter-spacing: .025em; }
  .hero .hero-lead { font-size: 16px; line-height: 1.8; margin-bottom: 26px; }
  .hero .hero-date { margin-bottom: 20px; font-size: 12px; letter-spacing: .04em; }
  .hero .hero-actions { gap: 20px; }
  .hero .hero-actions .button { flex: none; width: auto; min-width: 0; padding: 12px 18px; font-size: 12px; letter-spacing: .04em; }
  .hero-itinerary-link { font-size: 12px; gap: 6px; }
  .hero-afterword { padding-block: 30px; }
  .hero::after { display: block; background: linear-gradient(180deg, rgba(6,17,24,.68), rgba(6,17,24,.56) 43%, rgba(6,17,24,.16) 65%, rgba(6,17,24,.1) 85%, rgba(6,17,24,.32)); }
  .hero .hero-meta { width: 100%; }
}
