/* RefoMIT 2026-10-31: shared subpage visual language matching the approved V8 homepage.
   This stylesheet intentionally changes presentation ONLY. It must not touch the
   booking / contact / purchase business logic or scripts. */
.v9-subpage {
  --v9-navy: #071d2b;
  --v9-mid: #0a2a3a;
  --v9-mint: #91e0ca;
  --v9-paper: #fffdf9;
  --v9-muted: #c6dcd9;
  -webkit-font-smoothing: antialiased;
}
/* Align page content and header to the same 1180px V8 design grid. */
.v9-subpage .container { width: min(1180px, calc(100% - 54px)); margin-inline: auto; }
/* Unified official header: same size, colors, nav and baseline as V8 index. */
.v9-subpage .site-header {
  height: 96px;
  background: var(--v9-paper);
  border-bottom: 1px solid #dfebe8;
  box-shadow: none;
}
.v9-subpage .site-header .header-inner {
  height: 96px;
  min-height: 96px;
  gap: 18px;
}
.v9-subpage .site-header .brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  min-width: 0;
  gap: 0;
}
.v9-subpage .site-header .brand img {
  display: block;
  width: 180px;
  height: auto;
  max-height: 73px;
  max-width: none;
  object-fit: contain;
}
.v9-subpage .desktop-nav a {
  font-weight: 750;
  white-space: nowrap;
  color: #13273a;
}
.v9-subpage .desktop-nav a:hover { color: #0b7169; }
.v9-subpage .desktop-nav .nav-accent {
  padding: 12px 17px;
  border-radius: 4px;
  background: #0b3642;
  color: white;
}
.v9-subpage .desktop-nav .nav-accent:hover {
  color: white;
  background: #17626a;
}
.v9-subpage .menu-toggle {
  background: #edf4fb;
  border-radius: 10px;
  color: #123655;
}
.v9-subpage .mobile-nav { top: 95px; }

/* One family of page heroes: navy depth and sober mint highlights, no legacy
   Mincho serif second lines or bright Marketplace blue panel. */
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 470px;
  padding: 61px 0 77px;
  background: linear-gradient(118deg, #061a29 0%, #0a2a3a 60%, #0b3040 100%);
  color: #f7fbf9;
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero)::before {
  position: absolute;
  inset: 0;
  content: "";
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse at 73% 33%, #14616b60, transparent 55%);
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero)::after {
  position: absolute;
  right: -210px;
  bottom: -310px;
  content: "";
  width: 670px;
  height: 450px;
  border: 1px solid #ffffff10;
  border-radius: 50%;
  transform: rotate(-16deg);
  pointer-events: none;
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) > .container {
  position: relative;
  z-index: 1;
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) h1 {
  margin: 30px 0 26px;
  max-width: 1100px;
  font-family: -apple-system, BlinkMacSystemFont, "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  font-size: clamp(2.45rem, 4.65vw, 4.75rem);
  font-weight: 900;
  font-style: normal;
  letter-spacing: -.062em;
  line-height: 1.24;
  color: #fff;
  text-wrap: pretty;
}
/* Force previous 'Mincho' emphasis to the modern, bold second line of V8. */
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) h1 :is(em, .v9-accent) {
  font-family: inherit;
  font-weight: 900;
  font-style: normal;
  letter-spacing: inherit;
  color: var(--v9-mint);
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) p {
  max-width: 850px;
  margin: 0 0 8px;
  color: var(--v9-muted);
  font-size: clamp(.98rem, 1.5vw, 1.1rem);
  font-weight: 450;
  line-height: 1.92;
  letter-spacing: .004em;
}
.v9-subpage :is(.subhero, .support-v4-hero) .breadcrumb,
.v9-subpage .guide-hero .breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 0 42px;
  color: #b3cdcb;
  font-size: .84rem;
  line-height: 1.5;
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) .breadcrumb a {
  color: #d1e8e3;
  text-decoration: none;
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) .breadcrumb a:hover {
  color: white;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) :is(.overline, .eyebrow) {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  color: #87cfbf;
  font-size: .77rem;
  font-weight: 900;
  letter-spacing: .20em;
  line-height: 1.5;
}
.v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) :is(.overline, .eyebrow)::before {
  content: "";
  display: block;
  flex: 0 0 34px;
  width: 34px;
  height: 2px;
  background: #66d6bd;
  border-radius: 0;
}
.v9-subpage .guide-hero .badges {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 28px;
}
.v9-subpage .guide-hero .badges span {
  padding: 7px 14px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(145,224,202,.30);
  border-radius: 7px;
  color: #cfe5df;
  font-size: .82rem;
  font-weight: 650;
}
.v9-subpage :is(.subhero, .support-v4-hero) .btn {
  margin-top: 15px;
}
.v9-subpage .feature-anchor-bar a {
  border-radius: 9px;
}
/* Match V8 navigation on wide screens without influencing other pages. */
@media(min-width: 1150px) {
  .v9-subpage .desktop-nav { display: flex !important; }
  .v9-subpage .menu-toggle { display: none !important; }
}
@media(max-width: 1149px) {
  .v9-subpage .desktop-nav { display: none !important; }
  .v9-subpage .menu-toggle { display: block; }
}
@media(max-width: 780px) {
  .v9-subpage .container { width: min(1180px, calc(100% - 32px)); }
  .v9-subpage .site-header { height: 76px; }
  .v9-subpage .site-header .header-inner { height: 76px; min-height: 76px; }
  .v9-subpage .site-header .brand img { width: 139px; max-height: 62px; }
  .v9-subpage .mobile-nav { top: 75px; }
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) {
    min-height: 0;
    padding: 38px 0 56px;
  }
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) h1 {
    font-size: clamp(2rem, 7.6vw, 3.5rem);
    line-height: 1.3;
    margin: 25px 0 20px;
    letter-spacing: -.05em;
  }
  .v9-subpage :is(.subhero, .support-v4-hero) .breadcrumb,
  .v9-subpage .guide-hero .breadcrumb { margin-bottom: 31px; }
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero)::after {
    right: -350px;
    bottom: -370px;
  }
  .v9-subpage .guide-hero .badges span { font-size: .73rem; padding: 6px 10px; }
}
@media(max-width: 420px) {
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) h1 {
    font-size: clamp(1.85rem, 7.4vw, 2.65rem);
  }
}
@media print {
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) {
    min-height: 0;
    padding: 18px 0;
    background: #fff !important;
    color: #172a33 !important;
  }
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) h1,
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero) h1 :is(em, .v9-accent) {
    color: #172a33 !important;
  }
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero)::before,
  .v9-subpage :is(.subhero, .support-v4-hero, .guide-hero)::after { display: none; }
}