/* Local Yuzawa multipage candidate. Existing destination pages do not use these selectors. */
html.v2-yuzawa-preview { scroll-behavior: auto; scroll-padding-top: var(--ypv-sticky-offset, 4.5rem); }
html.v2-yuzawa-preview body { margin: 0; color: #193a50; background: #f7f8f6; font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif; line-height: 1.65; }
.v2-yuzawa-preview *, .v2-yuzawa-preview *::before, .v2-yuzawa-preview *::after { box-sizing: border-box; }
.v2-yuzawa-preview [hidden] { display: none !important; }
.v2-yuzawa-preview :is(button, input, select) { font: inherit; }
.v2-yuzawa-preview :is(a, button, summary, input, select):focus-visible { outline: 3px solid #126b9a; outline-offset: 4px; }
.ypv-container { width: min(1160px, calc(100% - 64px)); margin-inline: auto; min-width: 0; }
.ypv-fallback-nav { display: flex; flex-wrap: wrap; gap: 1rem; padding: 1rem; color: white; background: #06285f; }
.ypv-fallback-nav a { color: inherit; }
.ypv-preview-note { color: #6c592e; background: #f6efdc; font-size: .76rem; }
.ypv-preview-note .ypv-container { display: flex; justify-content: space-between; gap: .75rem; padding-block: .45rem; }
.ypv-preview-note b { display: inline-block; margin-right: .5rem; font-weight: 750; }
.ypv-breadcrumb { padding-block: 1rem .65rem; color: #70808b; font-size: .76rem; }
.ypv-breadcrumb nav { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.ypv-breadcrumb a { color: #587186; text-decoration: none; }
.ypv-section-nav { position: sticky; top: 0; z-index: 35; border-bottom: 1px solid #dfe6e8; background: #f7f8f6; }
.ypv-section-nav > div { display: flex; flex-wrap: nowrap; align-items: stretch; gap: 1.3rem; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #b2c3ca transparent; }
.ypv-section-nav a { display: flex; flex: 0 0 auto; align-items: center; min-height: 48px; padding: 3px .15rem 0; border-bottom: 3px solid transparent; color: #536c7c; text-decoration: none; font-size: .88rem; font-weight: 650; white-space: nowrap; }
.ypv-section-nav a:focus-visible { outline-offset: -3px; }
.ypv-section-nav a[aria-current="page"] { color: #163a50; border-bottom-color: #bc9154; }
.ypv-section-nav a:hover { color: #126b9a; }
.ypv-nav-hint { display: none; margin-block: 0; padding-block: .1rem .25rem; color: #617887; font-size: .65rem; text-align: right; }
.ypv-section-nav[data-overflow="true"] .ypv-nav-hint { display: block; }
.ypv-hero { position: relative; isolation: isolate; min-height: 390px; margin-top: 1.4rem; overflow: hidden; border-radius: 1rem; background: #294c66; }
.ypv-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(16 45 75 / 88%) 0%, rgb(16 45 75 / 62%) 42%, rgb(16 45 75 / 5%) 82%); }
.ypv-hero-image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.ypv-hero-copy { max-width: 44rem; padding: 3rem; color: #fff; }
.ypv-hero-copy h1 { margin: .35rem 0 .8rem; color: #fff; font-size: clamp(2.1rem, 4vw, 3.25rem); font-weight: 750; letter-spacing: .08em; line-height: 1.3; }
.ypv-hero .ypv-eyebrow { color: #ddcfb1; letter-spacing: .17em; }
.ypv-hero-lead { margin: 0 0 1.5rem; color: #f4f7fb; font-size: 1rem; line-height: 1.9; }
.ypv-hero-caption { position: absolute; bottom: 1.1rem; right: 1.5rem; padding: .2rem .5rem; border-radius: .25rem; background: #102d4b88; color: #fff; font-size: .72rem; letter-spacing: .06em; }
.ypv-eyebrow { margin: 0 0 .4rem; color: #827458; font-size: .68rem; letter-spacing: .14em; font-weight: 700; }
.ypv-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.ypv-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 1.2rem; padding: .65rem 1.2rem; border: 1px solid #b5c7cf; border-radius: .45rem; color: #244b60; background: #fff; font-size: .86rem; font-weight: 700; text-decoration: none; cursor: pointer; }
.ypv-button:hover { filter: brightness(.96); }
.ypv-button-gold { color: #21394b; background: #e9ca8b; border-color: #e9ca8b; }
.ypv-button-glass { border-color: #ffffff70; color: white; background: #193a5050; }
.ypv-button-navy { color: #fff; background: #173e59; border-color: #173e59; }
.ypv-section { margin-block: 2.8rem; }
.ypv-section-heading { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: .7rem 1.5rem; margin-bottom: 1.1rem; }
.ypv-section-heading h2, .ypv-orientation h2, .ypv-course h2 { margin: 0; color: #193a50; font-size: clamp(1.2rem, 2vw, 1.6rem); line-height: 1.5; }
.ypv-section-heading > p { margin: 0 0 .1rem; color: #75828c; font-size: .82rem; }
.ypv-orientation { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.5rem 1.8rem; border-top: 1px solid #dce4e3; border-bottom: 1px solid #dce4e3; background: #edf2ef; }
.ypv-orientation p:not(.ypv-eyebrow) { margin: .5rem 0 0; color: #677c76; font-size: .86rem; }
.ypv-text-link { display: inline-flex; align-items: center; gap: .65rem; min-height: 44px; color: #265c75; font-weight: 650; font-size: .87rem; text-decoration: underline; text-underline-offset: 5px; }
.ypv-orientation .ypv-actions { gap: 1.5rem; }
.ypv-map-section { scroll-margin-top: 0; }
.ypv-map-placeholder { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem; padding: 1.7rem; border: 1px solid #d4dfe3; border-radius: .8rem; background: #eaf0f3; }
.ypv-map-placeholder h3 { margin: 0 0 .35rem; color: #24495f; font-size: 1.1rem; }
.ypv-map-placeholder p { margin: 0; color: #627a89; font-size: .83rem; }
.ypv-map-placeholder button { margin-left: auto; }
.ypv-map-symbol { display: grid; place-items: center; width: 58px; height: 58px; color: #829cae; border: 1px solid #c9d6dc; border-radius: 50%; font-size: 2.25rem; line-height: 1; }
.ypv-course { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.5rem; padding: 1.5rem 1.8rem; border-radius: .8rem; background: #f1ece2; }
.ypv-course p:not(.ypv-eyebrow) { margin: .5rem 0 0; color: #746f64; font-size: .84rem; }
.ypv-course h3 { margin: .7rem 0 0; font-size: 1rem; }
.ypv-guide-folds { display: grid; gap: .7rem; margin-block: 1rem 2rem; }
.ypv-guide-fold { border: 1px solid #d3e1e7; border-radius: .8rem; padding: .7rem 1.1rem; background: white; }
.ypv-guide-fold > summary { min-height: 44px; padding-block: .5rem; color: #224d64; font-weight: 700; cursor: pointer; }
.ypv-guide-fold > summary span { display: inline-block; padding-left: .5rem; color: #688079; font-size: .8rem; font-weight: 400; }
.ypv-guide-fold > .ypv-actions { margin-top: 1rem; }
.ypv-stay-heading > div { min-width: 0; max-width: 52rem; }
.ypv-source-note { margin: 1.5rem 0 2rem; color: #7c8890; font-size: .74rem; line-height: 1.8; }
.ypv-stay-main { padding-top: 2.2rem; }
.ypv-stay-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; padding-bottom: .65rem; }
.ypv-stay-heading h1 { margin: .25rem 0 .65rem; color: #193a50; font-size: clamp(1.9rem, 3vw, 2.5rem); letter-spacing: .04em; }
.ypv-stay-heading p:not(.ypv-eyebrow) { margin: 0; color: #607886; font-size: .9rem; line-height: 1.8; }
.ypv-topic-hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(17rem, .85fr); grid-template-areas: "copy media" "action media"; align-items: stretch; gap: .75rem 1.5rem; min-height: 18rem; padding-bottom: 1rem; }
.ypv-topic-hero > div { grid-area: copy; align-self: end; max-width: 44rem; }
.ypv-topic-hero > .ypv-text-link { grid-area: action; align-self: start; justify-self: start; }
.ypv-topic-hero-media { position: relative; grid-area: media; align-self: center; min-width: 0; width: 100%; height: clamp(18rem, 25vw, 20rem); min-height: 0; margin: 0; overflow: hidden; border: 1px solid #d7e2e7; border-radius: .9rem; background: #e9f0f2; box-shadow: 0 .45rem 1.4rem rgba(22, 58, 80, .08); }
.ypv-topic-hero-media :is(.v2-snow-media__image, .v2-snow-media__video, .v2-snow-media-placeholder) { width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.ypv-topic-hero[data-hero-fit="contain"] .ypv-topic-hero-media :is(.v2-snow-media__image, .v2-snow-media__video) { padding: .8rem; object-fit: contain; background: #edf2f4; }
.ypv-topic-hero-media .v2-snow-media__caption { position: absolute; inset-inline: 0; bottom: 0; padding: .38rem .65rem; color: #173f5c; background: rgb(255 255 255 / 92%); font-size: .65rem; line-height: 1.45; }
.ypv-topic-hero-skeleton { display: grid; place-items: center; color: #567386; background: linear-gradient(135deg, #e7eff2, #f4f7f7); font-size: .8rem; }
.ypv-stay-next { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; padding: 1.3rem 1.5rem; background: #eaf0ed; border-radius: .8rem; }
.ypv-stay-next > .ypv-actions { margin-left: auto; }
.ypv-stay-next h2 { margin: 0 0 .5rem; color: #294f5c; font-size: 1.08rem; }
.ypv-stay-next p { margin: 0; color: #688079; font-size: .84rem; }
.ypv-return-status, .ypv-message { padding: .7rem 1rem; border: 1px solid #c8dbda; border-radius: .5rem; background: #eef7f4; color: #35665c; font-size: .85rem; }
.ypv-footer-fallback { display: flex; justify-content: center; flex-wrap: wrap; gap: 1.5rem; padding: 2rem 1rem; background: #12324c; }
.ypv-footer-fallback a { color: #fff; font-size: .86rem; }
@media (max-width: 80rem) { .ypv-container { width: min(1080px, calc(100% - 96px)); } }
@media (max-width: 60rem) {
  .ypv-hero-copy { padding: 2.5rem; }
}
@media (max-width: 47.5rem) {
  .ypv-container { width: calc(100% - 32px); }
  .ypv-preview-note .ypv-container { align-items: start; flex-wrap: wrap; gap: .15rem; padding-block: .4rem; }
  .ypv-preview-note { font-size: .68rem; }
  .ypv-breadcrumb { padding-block: .75rem .25rem; font-size: .7rem; }
  .ypv-section-nav > div { gap: 1.1rem; justify-content: flex-start; }
  .ypv-section-nav a { min-height: 48px; font-size: .84rem; }
  .ypv-hero { min-height: 350px; margin-top: .9rem; border-radius: .8rem; }
  .ypv-hero-image--yuzawa-overview { object-position: 100% center; }
  .ypv-hero-copy { padding: 2rem 1.35rem 2.7rem; }
  .ypv-hero::after { background: linear-gradient(90deg, rgb(16 45 75 / 88%) 0%, rgb(16 45 75 / 58%) 60%, rgb(16 45 75 / 18%) 100%); }
  .ypv-hero-lead { font-size: .9rem; }
  .ypv-hero-copy h1 { font-size: 2.05rem; letter-spacing: .05em; }
  .ypv-hero-caption { bottom: .6rem; right: .75rem; font-size: .6rem; }
  .ypv-hero .ypv-actions { gap: .5rem; }
  .ypv-button { padding: .6rem .9rem; gap: .75rem; font-size: .8rem; }
  .ypv-section { margin-block: 2rem; }
  .ypv-section-heading { margin-bottom: .85rem; gap: .3rem; }
  .ypv-section-heading h2, .ypv-orientation h2, .ypv-course h2 { font-size: 1.24rem; }
  .ypv-section-heading > p { font-size: .78rem; }
  .ypv-orientation, .ypv-course { padding: 1.2rem; }
  .ypv-orientation .ypv-actions { gap: 1rem; }
  .ypv-map-placeholder { padding: 1.15rem; gap: .85rem; }
  .ypv-map-symbol { width: 42px; height: 42px; font-size: 1.65rem; }
  .ypv-map-placeholder > div { flex: 1; }
  .ypv-map-placeholder h3 { font-size: 1rem; }
  .ypv-map-placeholder button { width: 100%; }
  .ypv-stay-main { padding-top: 1.45rem; }
  .ypv-stay-heading { gap: .1rem; }
  .ypv-topic-hero { grid-template-columns: minmax(0, 1fr); grid-template-areas: "media" "copy" "action"; gap: .8rem; min-height: 0; }
  .ypv-topic-hero-media { min-height: 0; height: auto; aspect-ratio: 16 / 10; }
  .ypv-topic-hero-media :is(.v2-snow-media__image, .v2-snow-media__video, .v2-snow-media-placeholder) { min-height: 0; aspect-ratio: 16 / 10; }
  .ypv-topic-hero > div { align-self: start; }
  .ypv-stay-heading h1 { font-size: 1.85rem; }
  .ypv-stay-heading p:not(.ypv-eyebrow) { font-size: .84rem; }
  .ypv-desktop-break { display: none; }
  .ypv-stay-next { padding: 1.15rem; }
}
@media (max-width: 24rem) { .ypv-hero h1 { font-size: 1.75rem; letter-spacing: .025em; } }
@media (max-width: 22rem) { .ypv-hero .ypv-button { font-size: .73rem; padding-inline: .7rem; } }

/* The Yuzawa modules keep their verified data renderers; this shell only
   separates them into focused pages and gives every topic the same rhythm. */
.ypv-topic-main { padding-top: 2.2rem; padding-bottom: 3.5rem; }
.ypv-topic-heading > div { min-width: 0; max-width: 52rem; }
.ypv-topic-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; padding-bottom: 1rem; }
.ypv-topic-heading h1 { margin: .25rem 0 .65rem; color: #193a50; font-size: clamp(1.9rem, 3vw, 2.5rem); letter-spacing: .04em; }
.ypv-topic-heading p:not(.ypv-eyebrow) { margin: 0; color: #607886; font-size: .9rem; line-height: 1.8; }
.ypv-topic-hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(17rem, .85fr); grid-template-areas: "copy media" "action media"; align-items: stretch; gap: .75rem 1.5rem; min-height: 18rem; }
.ypv-topic-hero > div { grid-area: copy; align-self: end; max-width: 44rem; }
.ypv-topic-hero > .ypv-text-link { grid-area: action; align-self: start; justify-self: start; }
.ypv-topic-hero-media { position: relative; grid-area: media; align-self: center; width: 100%; height: clamp(17rem, 24vw, 20rem); min-width: 0; min-height: 0; margin: 0; overflow: hidden; border: 1px solid #d7e2e7; border-radius: .9rem; background: #e9f0f2; box-shadow: 0 .45rem 1.4rem rgb(22 58 80 / 8%); }
.ypv-topic-hero-media :is(.v2-snow-media__image, .v2-snow-media__video, .v2-snow-media-placeholder) { width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.ypv-topic-hero[data-hero-fit="contain"] .ypv-topic-hero-media :is(.v2-snow-media__image, .v2-snow-media__video) { padding: .8rem; object-fit: contain; background: #edf2f4; }
.ypv-topic-hero-media .v2-snow-media__caption { position: absolute; inset-inline: 0; bottom: 0; padding: .38rem .65rem; color: #173f5c; background: rgb(255 255 255 / 92%); font-size: .65rem; line-height: 1.45; }
.ypv-content-section { scroll-margin-top: var(--ypv-sticky-offset, 4.5rem); margin-block: 2rem; min-width: 0; }
.ypv-content-section > :is([data-v2-yuzawa-overview], [data-v2-yuzawa-map], [data-v2-yuzawa-filter-compare], [data-v2-yuzawa-resorts], [data-v2-yuzawa-traffic], [data-v2-yuzawa-accommodation], [data-v2-yuzawa-rental], [data-v2-yuzawa-food], [data-v2-yuzawa-sightseeing], [data-v2-yuzawa-resources]) { min-width: 0; }
.ypv-content-heading { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: .65rem 1rem; margin-bottom: 1rem; }
.ypv-content-heading h2 { margin: 0; color: #193a50; font-size: clamp(1.35rem, 2.4vw, 1.8rem); }
.ypv-content-heading p { margin: 0; color: #6f808b; font-size: .84rem; }
.ypv-page-end { display: flex; justify-content: flex-end; margin-top: 2rem; padding: 1.15rem 1.35rem; border-radius: .8rem; background: #eaf0ed; }
.ypv-page-end .ypv-actions { margin-left: auto; }
.ypv-source-note { margin: 1.3rem 0 0; color: #7c8890; font-size: .74rem; line-height: 1.8; }
.v2-yuzawa-preview .yuzawa-overview-card__actions button { min-height: 44px; }
.v2-yuzawa-preview :is(.yuzawa-traffic-block, .yuzawa-stay-block, .yuzawa-rental-section, .yuzawa-poi-module, .yuzawa-resource-module, .yuzawa-resort-intro) { min-width: 0; }
.v2-yuzawa-preview :is(.yuzawa-traffic-table-wrap, .yuzawa-compare-table-wrap) { max-width: 100%; overflow-x: auto; }

@media (max-width: 47.5rem) {
  .ypv-topic-main { padding-top: 1.35rem; }
  .ypv-topic-heading { gap: .15rem; }
  .ypv-topic-hero { grid-template-columns: minmax(0, 1fr); grid-template-areas: "media" "copy" "action"; gap: .8rem; min-height: 0; }
  .ypv-topic-hero-media { height: auto; aspect-ratio: 16 / 10; }
  .ypv-topic-hero-media :is(.v2-snow-media__image, .v2-snow-media__video, .v2-snow-media-placeholder) { min-height: 0; aspect-ratio: 16 / 10; }
  .ypv-topic-hero > div { align-self: start; }
  .ypv-topic-heading h1 { font-size: 1.85rem; }
  .ypv-topic-heading p:not(.ypv-eyebrow) { font-size: .84rem; }
  .ypv-page-end { padding: 1rem; }
  .ypv-page-end .ypv-button { width: 100%; }
}