/* ════════════════════════════════════════════════════════════════════════
   VIRIDIAN GOLF — refreshed homepage
   ════════════════════════════════════════════════════════════════════════ */

/* ── reset / base ─────────────────────────────────────────────────────── */
.vg-page { overflow-x: hidden; }
.vg-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
}
.vg-h2 {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: clamp(35px, 4.3vw, 55px);
  line-height: 1.4;
  letter-spacing: 0.02em;
  margin: 0 0 24px;
  color: var(--vg-ink);
}

/* ── section label ────────────────────────────────────────────────────── */
.vg-sectlabel {
  display: flex;
  align-items: baseline;
  gap: 14px;
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.18em;
  color: var(--vg-green);
  margin-bottom: 28px;
  text-transform: uppercase;
}
.vg-sectlabel-no {
  font-weight: 500;
  opacity: 0.55;
}
.vg-sectlabel-en {
  font-weight: 600;
  letter-spacing: 0.22em;
}
.vg-sectlabel-jp {
  font-family: var(--jp);
  letter-spacing: 0.04em;
  font-size: 15px;
  opacity: 0.6;
}

/* ── button ───────────────────────────────────────────────────────────── */
.vg-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  font-family: var(--jp);
  font-size: 17.5px;
  font-weight: 500;
  letter-spacing: 0.04em;
  transition: transform .15s, background .15s, border-color .15s, color .15s;
  white-space: nowrap;
}
.vg-btn:hover { transform: translateY(-1px); }
.vg-btn-solid {
  background: var(--vg-green);
  color: var(--vg-cream);
}
.vg-btn-solid:hover { background: var(--vg-green-2); }
.vg-btn-ghost {
  background: transparent;
  color: var(--vg-green);
  box-shadow: inset 0 0 0 1px var(--vg-green);
}
.vg-btn-ghost:hover { background: var(--vg-green); color: var(--vg-cream); }
.vg-btn-solid-light {
  background: var(--vg-cream);
  color: var(--vg-green);
}
.vg-btn-solid-light:hover { background: #fff; }
.vg-btn-ghost-light {
  background: transparent;
  color: var(--vg-cream);
  box-shadow: inset 0 0 0 1px rgba(244,241,234,0.4);
}
.vg-btn-ghost-light:hover { background: rgba(244,241,234,0.1); }
.vg-btn-block { width: 100%; justify-content: center; }

/* ── notice bar ───────────────────────────────────────────────────────── */
.vg-noticebar {
  background: var(--vg-ink-d);
  color: var(--vg-cream);
  font-size: 15.6px;
}
.vg-noticebar-inner {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px 0;
}
.vg-noticebar-tag {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.18em;
  padding: 3px 8px;
  background: var(--vg-accent);
  color: var(--vg-ink-d);
  border-radius: 2px;
  font-weight: 600;
}
.vg-noticebar-text { flex: 1; opacity: 0.92; }
.vg-noticebar-link {
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.1em;
  color: var(--vg-cream);
  opacity: 0.7;
}
.vg-noticebar-link:hover { opacity: 1; }

/* ── header ───────────────────────────────────────────────────────────── */
.vg-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(10,13,10,0.72);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid var(--vg-rule);
}
.vg-header-inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 32px;
  padding: 16px 0;
}
.vg-logo { display: flex; align-items: center; gap: 12px; }
.vg-logo-mark {
  width: 40px; height: 40px;
  background: var(--vg-green);
  color: var(--vg-cream);
  font-family: var(--display);
  font-style: italic;
  font-weight: 500;
  font-size: 32.5px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  letter-spacing: 0;
}
.vg-logo-wm { display: flex; flex-direction: column; gap: 2px; }
.vg-logo-name {
  font-family: var(--en);
  font-weight: 600;
  font-size: 18.8px;
  letter-spacing: 0.16em;
  color: var(--vg-ink);
}
.vg-logo-sub {
  font-family: var(--mono);
  font-size: 11.3px;
  letter-spacing: 0.18em;
  color: var(--vg-ink-2);
  opacity: 0.65;
}
.vg-nav {
  display: flex;
  gap: 28px;
  justify-content: center;
}
.vg-nav a {
  font-family: var(--mono);
  font-size: 14.4px;
  letter-spacing: 0.16em;
  color: var(--vg-ink-2);
  position: relative;
  padding: 4px 0;
}
.vg-nav a:hover { color: var(--vg-green); }
.vg-nav a:hover::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px;
  height: 1px; background: var(--vg-green);
}
.vg-header-cta { display: flex; align-items: center; gap: 18px; }
.vg-header-tel {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1.1;
}
.vg-header-tel-label {
  font-family: var(--mono);
  font-size: 11.3px;
  letter-spacing: 0.2em;
  color: var(--vg-ink-2);
  opacity: 0.6;
}
.vg-header-tel-num {
  font-family: var(--en);
  font-weight: 600;
  font-size: 17.5px;
  color: var(--vg-ink);
  letter-spacing: 0.02em;
}

/* ── hero (editorial) ─────────────────────────────────────────────────── */
.vg-hero {
  position: relative;
  padding: 80px 0 0;
}
.vg-hero-editorial { padding-bottom: 60px; }
.vg-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 64px;
  align-items: center;
}
.vg-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--jp);
  font-size: 15.6px;
  color: var(--vg-green);
  padding: 7px 14px;
  border: 1px solid var(--vg-green);
  border-radius: 999px;
  margin-bottom: 28px;
}
.vg-hero-eyebrow-light {
  color: var(--vg-cream);
  border-color: rgba(244,241,234,0.5);
}
.vg-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--vg-green);
  animation: vg-pulse 2.4s ease-out infinite;
}
.vg-hero-eyebrow-light .vg-dot { background: var(--vg-accent); }
@keyframes vg-pulse {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.2); }
}
.vg-hero-h {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: clamp(50px, 6.3vw, 80px);
  line-height: 1.45;
  letter-spacing: 0.02em;
  margin: 0 0 24px;
  color: var(--vg-ink);
}
.vg-hero-h span { display: block; }
.vg-hero-h-lg { font-size: clamp(55px, 7vw, 90px); }
.vg-hero-h-light { color: var(--vg-cream); }
.vg-hero-en {
  font-family: var(--display);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(25px, 2.5vw, 32.5px);
  color: var(--vg-green);
  margin: 0 0 24px;
  letter-spacing: 0.02em;
}
.vg-hero-en-light { color: var(--vg-cream); opacity: 0.85; }
.vg-hero-lead {
  font-size: 18.8px;
  line-height: 1.95;
  color: var(--vg-ink-2);
  max-width: 480px;
  margin: 0 0 36px;
}
.vg-hero-ctas {
  display: flex;
  gap: 12px;
  margin-bottom: 48px;
}
.vg-hero-meta {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--vg-rule);
  padding-top: 24px;
}
.vg-hero-meta > div { display: flex; flex-direction: column; gap: 4px; }
.vg-hero-meta span {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.18em;
  color: var(--vg-ink-2);
  opacity: 0.6;
}
.vg-hero-meta b {
  font-family: var(--jp);
  font-size: 16.3px;
  font-weight: 500;
  color: var(--vg-ink);
}

.vg-hero-art {
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: 4px;
  overflow: hidden;
}
.vg-hero-art image-slot {
  position: absolute; inset: 0;
}
.vg-hero-badge {
  position: absolute;
  top: 20px; left: 20px;
  background: rgba(10,13,10,0.6);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 10px 14px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.vg-hero-badge-en {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.2em;
  color: var(--vg-green);
  font-weight: 600;
}
.vg-hero-badge-jp {
  font-family: var(--en);
  font-size: 13.8px;
  letter-spacing: 0.12em;
  color: var(--vg-ink-2);
}
.vg-hero-stat {
  position: absolute;
  right: 20px; bottom: 20px;
  background: var(--vg-green-deep);
  color: var(--vg-cream);
  padding: 18px 22px;
  border-radius: 4px;
  min-width: 180px;
}
.vg-hero-stat b {
  font-family: var(--display);
  font-weight: 500;
  font-size: 55px;
  line-height: 1;
  display: block;
  letter-spacing: -0.01em;
}
.vg-hero-stat b small {
  font-size: 22.5px;
  font-family: var(--jp);
  font-weight: 400;
  margin-left: 4px;
}
.vg-hero-stat span {
  font-size: 14.4px;
  line-height: 1.6;
  opacity: 0.85;
  display: block;
  margin-top: 6px;
}

/* hero - split */
.vg-hero-split {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 0;
  padding: 0;
  min-height: 88vh;
}
.vg-hero-split-img { position: relative; overflow: hidden; }
.vg-hero-split-img image-slot { position: absolute; inset: 0; }
.vg-hero-split-copy {
  display: flex;
  align-items: center;
  background: var(--vg-bg);
  padding: 80px 0;
}

/* hero - fullbleed */
.vg-hero-full {
  min-height: 92vh;
  padding: 0;
  display: flex;
  align-items: flex-end;
  position: relative;
  overflow: hidden;
}
.vg-hero-full image-slot {
  position: absolute; inset: 0; width: 100%; height: 100%;
}
.vg-hero-full-veil {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(15,36,24,0.0) 30%, rgba(15,36,24,0.85) 100%);
}
.vg-hero-full-copy {
  position: relative;
  padding: 0 0 80px;
  max-width: 720px;
}

/* ── marquee ──────────────────────────────────────────────────────────── */
.vg-marquee {
  margin-top: 80px;
  border-top: 1px solid var(--vg-rule);
  border-bottom: 1px solid var(--vg-rule);
  padding: 18px 0;
  overflow: hidden;
}
.vg-marquee-track {
  display: flex;
  gap: 56px;
  white-space: nowrap;
  animation: vg-marquee 50s linear infinite;
  font-family: var(--jp);
  font-size: 17.5px;
  color: var(--vg-green);
  letter-spacing: 0.06em;
}
.vg-marquee-track span { display: inline-flex; align-items: center; gap: 18px; }
.vg-marquee-track i {
  font-style: normal;
  color: var(--vg-accent);
  margin-right: 4px;
  font-size: 20px;
}
@keyframes vg-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-33.333%); }
}

/* ── concept ──────────────────────────────────────────────────────────── */
.vg-concept { padding: 120px 0; }
.vg-concept-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 72px;
}
.vg-concept-lead {
  font-size: 18.8px;
  line-height: 2;
  color: var(--vg-ink-2);
}
.vg-pillars {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--vg-rule);
  border-top: 1px solid var(--vg-rule);
  border-bottom: 1px solid var(--vg-rule);
}
.vg-pillar {
  background: var(--vg-surface);
  padding: 40px 32px 48px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 320px;
  position: relative;
  transition: background .25s;
}
.vg-pillar:hover { background: var(--vg-surface-2); }
.vg-pillar-icon { color: var(--vg-green); margin-bottom: 8px; }
.vg-pillar-no {
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.18em;
  color: var(--vg-green);
  opacity: 0.5;
  position: absolute;
  top: 24px; right: 24px;
}
.vg-pillar-t {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: 23.8px;
  line-height: 1.6;
  margin: 0;
  color: var(--vg-ink);
}
.vg-pillar-d {
  font-size: 16.3px;
  line-height: 1.95;
  color: var(--vg-ink-2);
  margin: 0;
}

/* ── facility ─────────────────────────────────────────────────────────── */
.vg-facility {
  padding: 120px 0;
  background: var(--vg-paper);
}
.vg-facility-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 56px;
}
.vg-facility-lead {
  font-size: 18.8px;
  line-height: 2;
  color: var(--vg-ink-2);
}
.vg-facility-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  grid-template-rows: auto auto;
  gap: 16px;
  margin-bottom: 64px;
}
.vg-facility-main {
  grid-row: span 2;
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: 4px;
}
.vg-facility-sub {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 4px;
}
.vg-facility-main image-slot,
.vg-facility-sub image-slot {
  position: absolute; inset: 0;
}
.vg-facility-cap {
  position: absolute;
  left: 16px; bottom: 16px;
  background: rgba(10,13,10,0.78);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 8px 14px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.vg-facility-cap-no {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.18em;
  color: var(--vg-green);
  font-weight: 600;
}
.vg-facility-cap-t {
  font-family: var(--jp);
  font-size: 14.4px;
  color: var(--vg-ink);
}

.vg-facility-specs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: var(--vg-rule);
  border-top: 1px solid var(--vg-rule);
  border-bottom: 1px solid var(--vg-rule);
}
.vg-spec {
  background: var(--vg-paper);
  padding: 24px 28px;
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 24px;
  align-items: baseline;
}
.vg-spec-label {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.18em;
  color: var(--vg-green);
  text-transform: uppercase;
  font-weight: 600;
}
.vg-spec-v {
  font-size: 17.5px;
  color: var(--vg-ink);
  line-height: 1.7;
}

/* ── plans ────────────────────────────────────────────────────────────── */
.vg-plans { padding: 120px 0; }
.vg-plans-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 56px;
}
.vg-plans-lead {
  font-size: 18.8px;
  line-height: 2;
  color: var(--vg-ink-2);
}
.vg-plancards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 48px;
}
.vg-plancard {
  position: relative;
  background: var(--vg-surface);
  border: 1px solid var(--vg-rule);
  border-radius: 6px;
  padding: 32px 28px 28px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.vg-plancard:hover {
  transform: translateY(-2px);
  border-color: var(--vg-green-soft);
  box-shadow: 0 16px 40px -20px rgba(0,84,63,0.28);
}
.vg-plancard.is-featured {
  background: var(--vg-green-deep);
  color: var(--vg-cream);
  border-color: var(--vg-green);
}
.vg-plancard-ribbon {
  position: absolute;
  top: -10px; left: 28px;
  background: var(--vg-accent);
  color: var(--vg-ink-d);
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.18em;
  padding: 4px 10px;
  border-radius: 2px;
  font-weight: 600;
}
.vg-plancard-tier {
  font-family: var(--en);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.22em;
  color: var(--vg-green);
}
.vg-plancard.is-featured .vg-plancard-tier { color: var(--vg-accent); }
.vg-plancard-desc {
  font-size: 15.6px;
  line-height: 1.7;
  margin: 0;
  color: var(--vg-ink-2);
  min-height: 44px;
}
.vg-plancard.is-featured .vg-plancard-desc { color: rgba(244,241,234,0.82); }
.vg-plancard-rows {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 0;
  border-top: 1px solid var(--vg-rule);
  border-bottom: 1px solid var(--vg-rule);
}
.vg-plancard.is-featured .vg-plancard-rows {
  border-color: rgba(244,241,234,0.18);
}
.vg-plancard-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.vg-plancard-name {
  font-size: 15.6px;
  color: var(--vg-ink);
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.vg-plancard.is-featured .vg-plancard-name { color: var(--vg-cream); }
.vg-plancard-name em {
  font-style: normal;
  font-family: var(--mono);
  font-size: 11.3px;
  letter-spacing: 0.12em;
  color: var(--vg-accent);
  padding: 2px 6px;
  border-radius: 2px;
  background: rgba(184,152,90,0.12);
}
.vg-plancard-price {
  font-family: var(--display);
  font-weight: 500;
  font-size: 30px;
  color: var(--vg-green);
  letter-spacing: -0.01em;
}
.vg-plancard.is-featured .vg-plancard-price { color: var(--vg-accent); }
.vg-plancard-price small {
  font-family: var(--jp);
  font-size: 13.8px;
  font-weight: 400;
  margin-left: 2px;
  opacity: 0.7;
}
.vg-plancard-feat {
  list-style: none;
  padding: 0;
  margin: 0 0 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.vg-plancard-feat li {
  font-size: 15px;
  line-height: 1.5;
  color: var(--vg-ink-2);
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.vg-plancard.is-featured .vg-plancard-feat li { color: rgba(244,241,234,0.88); }
.vg-plancard-feat svg {
  color: var(--vg-green);
  margin-top: 4px;
  flex-shrink: 0;
}
.vg-plancard.is-featured .vg-plancard-feat svg { color: var(--vg-accent); }
.vg-plancard.is-featured .vg-btn-ghost {
  color: var(--vg-cream);
  box-shadow: inset 0 0 0 1px rgba(244,241,234,0.4);
}
.vg-plancard.is-featured .vg-btn-solid {
  background: var(--vg-accent);
  color: var(--vg-ink-d);
}
.vg-plancard.is-featured .vg-btn-solid:hover { background: #d0aa66; }

/* plans table */
.vg-plantable {
  border: 1px solid var(--vg-rule);
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 48px;
  background: var(--vg-surface);
}
.vg-plantable-head, .vg-plantable-row {
  display: grid;
  grid-template-columns: 130px 1.4fr 0.9fr 1.4fr;
  gap: 24px;
  padding: 16px 24px;
  align-items: center;
}
.vg-plantable-head {
  background: var(--vg-green-deep);
  color: var(--vg-cream);
  font-family: var(--mono);
  font-size: 13.1px;
  letter-spacing: 0.18em;
  font-weight: 600;
}
.vg-plantable-row {
  border-top: 1px solid var(--vg-rule);
  font-size: 16.9px;
}
.vg-plantable-row.is-featured {
  background: rgba(184,152,90,0.06);
  position: relative;
}
.vg-plantable-row.is-featured::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--vg-accent);
}
.vg-plantable-tier {
  font-family: var(--en);
  font-size: 13.8px;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--vg-green);
}
.vg-plantable-price {
  font-family: var(--display);
  font-weight: 500;
  font-size: 27.5px;
  color: var(--vg-green);
}
.vg-plantable-price small {
  font-family: var(--jp);
  font-size: 13.8px;
  margin-left: 2px;
  opacity: 0.6;
}
.vg-plantable-note {
  display: inline-block;
  margin-left: 10px;
  font-style: normal;
  font-family: var(--mono);
  font-size: 11.3px;
  letter-spacing: 0.12em;
  color: var(--vg-accent);
  padding: 2px 6px;
  background: rgba(184,152,90,0.14);
  border-radius: 2px;
}
.vg-plantable-feat {
  font-size: 15px;
  color: var(--vg-ink-2);
}

.vg-plans-fees {
  border: 1px dashed var(--vg-rule);
  border-radius: 6px;
  padding: 24px 28px;
  background: var(--vg-paper);
}
.vg-plans-fees-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  margin-bottom: 16px;
}
.vg-plans-fees-row > div { display: flex; flex-direction: column; gap: 4px; }
.vg-plans-fees-row span {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.16em;
  color: var(--vg-ink-2);
  opacity: 0.7;
}
.vg-plans-fees-row b {
  font-family: var(--display);
  font-size: 25px;
  font-weight: 500;
  color: var(--vg-green);
}
.vg-plans-fees-row b small {
  font-family: var(--jp);
  font-size: 13.8px;
  font-weight: 400;
  opacity: 0.6;
  margin-left: 4px;
}
.vg-plans-notes {
  font-size: 14.4px;
  line-height: 1.8;
  color: var(--vg-ink-2);
  opacity: 0.75;
  margin: 0;
}

/* round lesson */
.vg-round {
  margin-top: 64px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
  padding: 48px;
  background: var(--vg-green-deep);
  color: var(--vg-cream);
  border-radius: 6px;
}
.vg-round-tag {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.2em;
  color: var(--vg-accent);
  margin-bottom: 12px;
}
.vg-round-t {
  font-family: var(--display);
  font-weight: 500;
  font-size: 55px;
  margin: 0 0 16px;
  letter-spacing: 0.01em;
}
.vg-round-d {
  font-size: 17.5px;
  line-height: 1.95;
  margin: 0 0 24px;
  opacity: 0.88;
}
.vg-round-r {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 4px;
}
.vg-round-r image-slot { position: absolute; inset: 0; }
.vg-round .vg-btn-ghost {
  color: var(--vg-cream);
  box-shadow: inset 0 0 0 1px rgba(244,241,234,0.4);
}
.vg-round .vg-btn-ghost:hover { background: rgba(244,241,234,0.1); color: var(--vg-cream); }

/* ── staff ────────────────────────────────────────────────────────────── */
.vg-staff { padding: 120px 0; background: var(--vg-paper); }
.vg-staff-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 56px;
}
.vg-staff-lead {
  font-size: 18.8px;
  line-height: 2;
  color: var(--vg-ink-2);
}
.vg-staff-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.vg-staff-card {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.vg-staff-photo {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: 4px;
}
.vg-staff-photo image-slot { position: absolute; inset: 0; }
.vg-staff-no {
  position: absolute;
  top: 16px; right: 16px;
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.18em;
  color: var(--vg-cream);
  background: rgba(0,84,63,0.88);
  padding: 4px 10px;
  border-radius: 2px;
  font-weight: 600;
}
.vg-staff-role {
  font-family: var(--mono);
  font-size: 13.1px;
  letter-spacing: 0.22em;
  color: var(--vg-green);
  font-weight: 600;
  margin-bottom: 8px;
}
.vg-staff-name {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: 27.5px;
  margin: 0 0 8px;
}
.vg-staff-focus {
  font-size: 16.3px;
  line-height: 1.7;
  color: var(--vg-ink-2);
  margin: 0;
}
.vg-staff-strip {
  margin-top: 48px;
  padding: 24px 32px;
  background: var(--vg-surface);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  font-size: 17.5px;
  color: var(--vg-ink-2);
}

/* ── access ───────────────────────────────────────────────────────────── */
.vg-access { padding: 120px 0; }
.vg-access-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 64px;
  align-items: stretch;
}
.vg-access-info { padding-top: 8px; }
.vg-access-tag {
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.22em;
  color: var(--vg-green);
  margin: 0 0 32px;
  font-weight: 600;
}
.vg-access-dl { display: flex; flex-direction: column; gap: 20px; margin: 0 0 32px; }
.vg-access-dl > div {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 16px;
  align-items: baseline;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--vg-rule);
}
.vg-access-dl dt {
  font-family: var(--mono);
  font-size: 13.1px;
  letter-spacing: 0.18em;
  color: var(--vg-green);
  font-weight: 600;
  margin: 0;
}
.vg-access-dl dd {
  margin: 0;
  font-size: 17.5px;
  line-height: 1.8;
  color: var(--vg-ink);
}
.vg-access-dl a:hover { color: var(--vg-green); text-decoration: underline; }
.vg-access-dl small { font-size: 15px; opacity: 0.65; }
.vg-hours {
  width: 100%;
  border-collapse: collapse;
  font-size: 16.3px;
}
.vg-hours th, .vg-hours td {
  padding: 8px 0;
  text-align: left;
  font-weight: 400;
  border-bottom: 1px dashed var(--vg-rule);
}
.vg-hours th { color: var(--vg-ink-2); width: 90px; }
.vg-hours td:first-of-type { font-family: var(--en); font-weight: 500; }
.vg-hours-note { color: var(--vg-ink-2); opacity: 0.65; font-size: 14.4px; text-align: right; }
.vg-hours-em th, .vg-hours-em td {
  color: var(--vg-green);
  font-weight: 600;
  border-bottom: 1px solid var(--vg-green);
}
.vg-access-ctas { display: flex; gap: 12px; }
.vg-access-map {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  min-height: 520px;
}
.vg-access-map image-slot { position: absolute; inset: 0; }
.vg-access-pin {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.vg-access-pin-dot {
  width: 18px; height: 18px;
  background: var(--vg-green);
  border-radius: 50%;
  box-shadow: 0 0 0 6px rgba(31,61,43,0.18), 0 6px 14px rgba(0,0,0,0.2);
}
.vg-access-pin-label {
  font-family: var(--en);
  font-weight: 600;
  font-size: 13.8px;
  letter-spacing: 0.16em;
  color: var(--vg-cream);
  background: var(--vg-green);
  padding: 4px 10px;
  border-radius: 2px;
}

/* ── news ─────────────────────────────────────────────────────────────── */
.vg-news { padding: 100px 0 120px; background: var(--vg-paper); }
.vg-news-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 32px;
}
.vg-news-head .vg-sectlabel { margin-bottom: 0; }
.vg-news-all {
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.16em;
  color: var(--vg-green);
}
.vg-news-list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--vg-rule);
}
.vg-news-row {
  display: grid;
  grid-template-columns: 110px 80px 1fr 20px;
  gap: 24px;
  padding: 22px 8px;
  border-bottom: 1px solid var(--vg-rule);
  align-items: center;
  transition: background .15s;
}
.vg-news-row:hover { background: var(--vg-surface); }
.vg-news-date {
  font-family: var(--en);
  font-weight: 500;
  font-size: 16.3px;
  color: var(--vg-ink-2);
  letter-spacing: 0.04em;
}
.vg-news-tag {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.16em;
  padding: 4px 8px;
  border-radius: 2px;
  text-align: center;
  font-weight: 600;
  background: var(--vg-green);
  color: var(--vg-cream);
}
.vg-news-tag[data-tag="EVENT"]  { background: var(--vg-accent); color: var(--vg-ink-d); }
.vg-news-tag[data-tag="STUDIO"] { background: var(--vg-green-soft); color: var(--vg-cream); }
.vg-news-t {
  font-size: 18.1px;
  color: var(--vg-ink);
  line-height: 1.6;
}
.vg-news-row:hover .vg-news-t { color: var(--vg-green); }
.vg-news-arrow {
  font-family: var(--en);
  color: var(--vg-ink-2);
  opacity: 0.4;
  text-align: right;
  transition: transform .15s, opacity .15s;
}
.vg-news-row:hover .vg-news-arrow {
  opacity: 1;
  transform: translateX(4px);
  color: var(--vg-green);
}

/* ── footer ───────────────────────────────────────────────────────────── */
.vg-footer {
  background: var(--vg-green-deep);
  color: var(--vg-cream);
  padding: 100px 0 32px;
  position: relative;
  overflow: hidden;
}
.vg-footer-cta {
  text-align: center;
  padding-bottom: 80px;
  border-bottom: 1px solid rgba(244,241,234,0.18);
  margin-bottom: 60px;
}
.vg-footer-h {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: clamp(50px, 6.3vw, 80px);
  line-height: 1.3;
  margin: 0 0 24px;
}
.vg-footer-lead {
  font-size: 17.5px;
  line-height: 1.95;
  opacity: 0.8;
  margin: 0 0 32px;
}
.vg-footer-ctas {
  display: flex;
  gap: 12px;
  justify-content: center;
}
.vg-footer-mid {
  display: grid;
  grid-template-columns: 1.1fr 2fr;
  gap: 80px;
  margin-bottom: 48px;
}
.vg-footer-brand { display: flex; align-items: center; gap: 16px; }
.vg-logo-mark-light {
  background: var(--vg-cream);
  color: var(--vg-green);
}
.vg-footer-name {
  font-family: var(--en);
  font-weight: 600;
  font-size: 20px;
  letter-spacing: 0.16em;
}
.vg-footer-sub {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.16em;
  opacity: 0.6;
  margin-top: 4px;
}
.vg-footer-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.vg-footer-cols h4 {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.22em;
  color: var(--vg-accent);
  font-weight: 600;
  margin: 0 0 16px;
}
.vg-footer-cols ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 16.3px;
  opacity: 0.88;
}
.vg-footer-cols a:hover { color: var(--vg-accent); }
.vg-footer-bot {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.16em;
  opacity: 0.5;
  padding-top: 24px;
  border-top: 1px solid rgba(244,241,234,0.12);
}
.vg-footer-wm {
  position: absolute;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--display);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(175px, 22.5vw, 300px);
  color: var(--vg-green-2);
  opacity: 0.35;
  letter-spacing: 0.02em;
  user-select: none;
  pointer-events: none;
  white-space: nowrap;
  z-index: 0;
}

/* ── image-slot styling ───────────────────────────────────────────────── */
image-slot {
  --is-bg: #18211a;
  --is-fg: #748371;
  --is-stripe: rgba(236,233,223,0.05);
}

/* ════════════════════════════════════════════════════════════════════════
   3-FRAME REFRESH — slideshow / results / reasons / footer info
   ════════════════════════════════════════════════════════════════════════ */

.vg-sectlabel.is-light { color: var(--vg-accent); }
.vg-sectlabel.is-light .vg-sectlabel-no { color: var(--vg-cream); opacity: 0.4; }
.vg-sectlabel.is-light .vg-sectlabel-jp { color: var(--vg-cream); opacity: 0.55; }

/* ── Frame 1 · slideshow ──────────────────────────────────────────────── */
.vg-show {
  position: relative;
  min-height: min(92vh, 860px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: #000;
}
.vg-show-stage { position: absolute; inset: 0; }
.vg-show-slide {
  position: absolute; inset: 0;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 1.2s ease, transform 6s ease;
  pointer-events: none;
}
.vg-show-slide.is-active {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}
.vg-show-slide image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
.vg-show-slide image-slot {
  --is-bg: #0c130e;
  --is-fg: #5e7060;
}
.vg-show-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.vg-show-cap {
  position: absolute;
  right: 28px; top: 120px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  text-align: right;
  z-index: 3;
}
.vg-show-cap-en {
  font-family: var(--mono);
  font-size: 13.1px;
  letter-spacing: 0.26em;
  color: var(--vg-accent);
  font-weight: 600;
}
.vg-show-cap-jp {
  font-family: var(--jp);
  font-size: 15px;
  letter-spacing: 0.08em;
  color: rgba(236,233,223,0.78);
}
.vg-show-veil {
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(6,10,7,0.82) 0%, rgba(6,10,7,0.45) 42%, rgba(6,10,7,0.12) 72%, rgba(6,10,7,0.35) 100%),
    linear-gradient(0deg, rgba(6,10,7,0.72) 0%, rgba(6,10,7,0) 46%);
  z-index: 2;
}
.vg-show-overlay {
  position: relative;
  z-index: 3;
  padding-top: 0;
  padding-bottom: 92px;
  width: 100%;
}
.vg-show-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--jp);
  font-size: 15px;
  letter-spacing: 0.06em;
  color: var(--vg-cream);
  padding: 7px 15px;
  border: 1px solid rgba(236,233,223,0.4);
  border-radius: 999px;
  margin-bottom: 30px;
}
.vg-show-eyebrow .vg-dot { background: var(--vg-accent); }
.vg-show-h {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: clamp(47.5px, 6.8vw, 90px);
  line-height: 1.42;
  letter-spacing: 0.02em;
  margin: 0 0 20px;
  color: var(--vg-cream);
  text-shadow: 0 2px 30px rgba(0,0,0,0.35);
}
.vg-show-h span { display: block; }
.vg-show-en {
  font-family: var(--display);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(22.5px, 2.5vw, 32.5px);
  color: var(--vg-accent);
  margin: 0 0 34px;
  letter-spacing: 0.02em;
}
.vg-show-ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.vg-show-dots {
  position: absolute;
  left: 40px; bottom: 40px;
  display: flex;
  gap: 12px;
  z-index: 4;
}
.vg-show-dot {
  width: 46px; height: 3px;
  padding: 0;
  border: 0;
  background: rgba(236,233,223,0.28);
  cursor: pointer;
  overflow: hidden;
  border-radius: 2px;
}
.vg-show-dot span {
  display: block;
  height: 100%;
  width: 100%;
  background: var(--vg-accent);
  transform: scaleX(0);
  transform-origin: left;
}
.vg-show-dot.is-active span {
  animation: vg-dotfill linear forwards;
}
@keyframes vg-dotfill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.vg-show-index {
  position: absolute;
  right: 40px; bottom: 36px;
  z-index: 4;
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-family: var(--display);
  color: var(--vg-cream);
}
.vg-show-index b { font-size: 37.5px; font-weight: 500; }
.vg-show-index i { font-style: normal; opacity: 0.5; font-size: 22.5px; }
.vg-show-index span { font-size: 22.5px; opacity: 0.55; }

/* ── Frame 2a · results ───────────────────────────────────────────────── */
.vg-results {
  padding: 108px 0;
  background: var(--vg-green-deep);
  color: var(--vg-cream);
  position: relative;
}
.vg-results-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 72px;
  align-items: center;
}
.vg-results-h {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: clamp(42.5px, 5.5vw, 75px);
  line-height: 1.4;
  letter-spacing: 0.02em;
  margin: 0 0 18px;
  color: var(--vg-cream);
}
.vg-results-h span { display: block; }
.vg-results-sub {
  font-family: var(--jp-serif);
  font-size: clamp(22.5px, 2.5vw, 30px);
  line-height: 1.6;
  color: var(--vg-cream);
  opacity: 0.9;
  margin: 0 0 16px;
}
.vg-results-attr {
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.1em;
  color: var(--vg-accent);
  margin: 0;
}
.vg-results-figs {
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 36px 40px;
  border: 1px solid rgba(236,233,223,0.18);
  border-radius: 6px;
  background: rgba(0,0,0,0.16);
}
.vg-fig { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.vg-fig-num {
  font-family: var(--display);
  font-weight: 600;
  font-size: clamp(65px, 7.5vw, 95px);
  line-height: 0.95;
  color: var(--vg-accent);
  letter-spacing: -0.01em;
}
.vg-fig-num small {
  font-family: var(--jp);
  font-size: 22.5px;
  font-weight: 400;
  margin-left: 4px;
  color: var(--vg-cream);
  opacity: 0.8;
}
.vg-fig-label {
  font-family: var(--jp);
  font-size: 17.5px;
  font-weight: 500;
  color: var(--vg-cream);
}
.vg-fig-note {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.14em;
  color: var(--vg-cream);
  opacity: 0.55;
}
.vg-fig-div { width: 1px; align-self: stretch; background: rgba(236,233,223,0.18); }
.vg-results-fine {
  margin: 40px 0 0;
  font-size: 14.4px;
  line-height: 1.85;
  color: var(--vg-cream);
  opacity: 0.6;
  max-width: 780px;
}

/* ── Frame 2b · reasons ───────────────────────────────────────────────── */
.vg-reasons { padding: 120px 0; }
.vg-reasons-head {
  max-width: 760px;
  margin: 0 auto 72px;
  text-align: center;
}
.vg-reasons-head .vg-sectlabel { justify-content: center; }
.vg-reasons-lead {
  font-size: 18.8px;
  line-height: 2;
  color: var(--vg-ink-2);
  margin: 20px 0 0;
}

/* rows layout — alternating editorial */
.vg-reasons-body.is-rows {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.is-rows .vg-reason {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}
.is-rows .vg-reason:nth-child(even) .vg-reason-media { order: 2; }
.vg-reason-media {
  position: relative;
  aspect-ratio: 16 / 11;
  overflow: hidden;
  border-radius: 6px;
}
.vg-reason-media image-slot { position: absolute; inset: 0; }
.vg-reason-art {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  display: block;
}
.vg-reason-photo {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.art-panel { fill: var(--vg-surface); }
.art-glow-a { stop-color: var(--vg-green); stop-opacity: 0.16; }
.art-glow-b { stop-color: var(--vg-surface); stop-opacity: 0; }
.art-grid { stroke: var(--vg-cream); opacity: 0.05; stroke-width: 1; }
.art-green { stroke: var(--vg-green); stroke-width: 2; }
.art-brass { stroke: var(--vg-accent); stroke-width: 2; }
.art-green-f { fill: var(--vg-green); }
.art-brass-f { fill: var(--vg-accent); }
.art-cream { fill: var(--vg-cream); opacity: 0.7; }
.art-cream-s { stroke: var(--vg-cream); stroke-width: 1.5; }
.art-hole { fill: var(--vg-bg); opacity: 0.7; }
.art-wm {
  font-family: var(--display);
  font-style: italic;
  font-weight: 500;
  font-size: 187.5px;
  fill: var(--vg-cream);
  opacity: 0.05;
}
.art-lab {
  font-family: var(--mono);
  font-size: 16.3px;
  letter-spacing: 0.22em;
  fill: var(--vg-accent);
  opacity: 0.85;
}
.vg-reason-no {
  position: absolute;
  top: 16px; left: 16px;
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.18em;
  font-weight: 600;
  color: var(--vg-cream);
  background: rgba(0,84,63,0.88);
  padding: 5px 11px;
  border-radius: 2px;
}
.vg-reason-en {
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.24em;
  color: var(--vg-green);
  font-weight: 600;
  margin-bottom: 16px;
}
.vg-reason-t {
  font-family: var(--jp-serif);
  font-weight: 500;
  font-size: clamp(30px, 3.3vw, 40px);
  line-height: 1.5;
  margin: 0 0 18px;
  color: var(--vg-ink);
}
.vg-reason-d {
  font-size: 18.1px;
  line-height: 2;
  color: var(--vg-ink-2);
  margin: 0;
  max-width: 440px;
}

/* cards layout — 2x2 grid */
.vg-reasons-body.is-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.is-cards .vg-reason {
  display: flex;
  flex-direction: column;
  background: var(--vg-surface);
  border: 1px solid var(--vg-rule);
  border-radius: 6px;
  overflow: hidden;
  transition: transform .2s, border-color .2s;
}
.is-cards .vg-reason:hover { transform: translateY(-2px); border-color: var(--vg-green-soft); }
.is-cards .vg-reason-media { aspect-ratio: 16 / 9; border-radius: 0; }
.is-cards .vg-reason-text { padding: 28px 30px 34px; }

/* ── Frame 3 · footer info ────────────────────────────────────────────── */
.vg-footer-cta-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--mono);
  font-size: 13.1px;
  letter-spacing: 0.2em;
  color: var(--vg-accent);
  margin-bottom: 22px;
}
.vg-footer-cta-eyebrow .vg-dot { background: var(--vg-accent); }
.vg-footer-info {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 72px;
  margin-bottom: 52px;
}
.vg-footer-dl { display: flex; flex-direction: column; gap: 16px; margin: 28px 0 24px; }
.vg-footer-dl > div {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 16px;
  align-items: baseline;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(236,233,223,0.14);
}
.vg-footer-dl dt {
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.16em;
  color: var(--vg-accent);
  font-weight: 600;
  margin: 0;
}
.vg-footer-dl dd {
  margin: 0;
  font-size: 16.9px;
  line-height: 1.75;
  color: var(--vg-cream);
  opacity: 0.9;
}
.vg-footer-dl dd small { opacity: 0.6; font-size: 14.4px; }
.vg-footer-dl a:hover { color: var(--vg-accent); }
.vg-footer-social {
  display: flex;
  gap: 20px;
  font-family: var(--mono);
  font-size: 13.8px;
  letter-spacing: 0.12em;
}
.vg-footer-social a { opacity: 0.8; }
.vg-footer-social a:hover { color: var(--vg-accent); opacity: 1; }
.vg-footer-hours-head {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 18px;
}
.vg-footer-hours-en {
  font-family: var(--mono);
  font-size: 13.1px;
  letter-spacing: 0.22em;
  color: var(--vg-accent);
  font-weight: 600;
}
.vg-footer-hours-jp { font-size: 15.6px; color: var(--vg-cream); opacity: 0.7; }
.vg-footer .vg-hours { color: var(--vg-cream); margin-bottom: 28px; }
.vg-footer .vg-hours th, .vg-footer .vg-hours td { border-bottom-color: rgba(236,233,223,0.16); }
.vg-footer .vg-hours th { color: rgba(236,233,223,0.7); }
.vg-footer .vg-hours-note { color: rgba(236,233,223,0.5); }
.vg-footer .vg-hours-em th, .vg-footer .vg-hours-em td {
  color: var(--vg-accent);
  border-bottom-color: var(--vg-accent);
}
.vg-footer-map {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 6px;
  overflow: hidden;
}
.vg-footer-map image-slot { position: absolute; inset: 0; }
.vg-footer-map image-slot { --is-bg: #123020; --is-fg: #6f8a76; }
.vg-footer-pin {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.vg-footer-pin-dot {
  width: 16px; height: 16px;
  background: var(--vg-accent);
  border-radius: 50%;
  box-shadow: 0 0 0 6px rgba(194,162,92,0.18);
}
.vg-footer-pin-label {
  font-family: var(--en);
  font-weight: 600;
  font-size: 13.1px;
  letter-spacing: 0.14em;
  color: var(--vg-ink-d);
  background: var(--vg-accent);
  padding: 3px 9px;
  border-radius: 2px;
}

.vg-reason-extra{margin-top:26px;padding:22px 24px;background:var(--vg-surface);border:1px solid var(--vg-rule);border-left:2px solid var(--vg-green);border-radius:4px;max-width:520px}
.vg-reason-extra-head{display:flex;align-items:baseline;gap:12px;margin-bottom:12px}
.vg-reason-extra-en{font-family:var(--mono);font-size: 11.9px;letter-spacing:.22em;font-weight:600;color:var(--vg-green)}
.vg-reason-extra-t{font-family:var(--jp-serif);font-weight:500;font-size: 20px;color:var(--vg-ink)}
.vg-reason-extra-d{font-size: 16.3px;line-height:1.95;color:var(--vg-ink-2);margin:0 0 14px}
.vg-reason-extra-meta{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.vg-reason-extra-meta li{font-family:var(--jp);font-size: 13.8px;letter-spacing:.04em;color:var(--vg-ink);padding:4px 10px;border:1px solid var(--vg-rule);border-radius:999px;background:var(--vg-surface-2)}

/* ── responsive ───────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .vg-nav { display: none; }
  .vg-header-inner { grid-template-columns: auto 1fr; }
  .vg-hero-grid, .vg-concept-head, .vg-facility-head, .vg-plans-head, .vg-staff-head { grid-template-columns: 1fr; gap: 32px; }
  .vg-pillars, .vg-staff-grid, .vg-plancards { grid-template-columns: repeat(2, 1fr); }
  .vg-plans-fees-row { grid-template-columns: repeat(2, 1fr); }
  .vg-facility-grid, .vg-facility-specs, .vg-access-grid, .vg-footer-mid, .vg-round { grid-template-columns: 1fr; }
  .vg-hero-split { grid-template-columns: 1fr; min-height: auto; }
  .vg-hero-split-img { aspect-ratio: 16/10; }
  .vg-results-grid, .vg-footer-info { grid-template-columns: 1fr; gap: 40px; }
  .is-rows .vg-reason { grid-template-columns: 1fr; gap: 24px; }
  .is-rows .vg-reason:nth-child(even) .vg-reason-media { order: 0; }
  .vg-reason-d { max-width: none; }
}
@media (max-width: 720px) {
  .vg-container { padding: 0 20px; }
  .vg-pillars, .vg-staff-grid, .vg-plancards, .vg-plans-fees-row, .vg-footer-cols { grid-template-columns: 1fr; }
  .vg-plantable-head { display: none; }
  .vg-plantable-row { grid-template-columns: 1fr; gap: 8px; }
  .vg-news-row { grid-template-columns: 80px 60px 1fr; }
  .vg-news-arrow { display: none; }
  .vg-reasons-body.is-cards { grid-template-columns: 1fr; }
  .vg-results-figs { flex-direction: column; align-items: flex-start; gap: 24px; }
  .vg-fig-div { width: 100%; height: 1px; }
  .vg-show-cap { display: none; }
  .vg-show-index { display: none; }
}

/* ── line breaking ────────────────────────────────────────────────────── */
.vg-reason-d,.vg-reason-extra-d,.vg-reasons-lead,.vg-footer-lead,.vg-plans-lead,.vg-round-d,.vg-results-sub,.vg-results-fine,.vg-plans-notes{text-wrap:pretty;word-break:normal;line-break:strict;overflow-wrap:normal}
.vg-nb{display:inline-block}
.vg-reasons-lead,.vg-footer-lead,.vg-plans-lead{text-wrap:balance}
.vg-reason-d,.vg-reason-extra-d{max-width:30em}
.vg-reasons-lead{max-width:34em;margin-left:auto;margin-right:auto}
.vg-plans-lead{max-width:38em}
.vg-show-h,.vg-results-h,.vg-reason-t,.vg-h2,.vg-footer-h{line-break:strict;word-break:keep-all}

.vg-plancard-row.is-rec{background:rgba(0,84,63,.06);border-radius:3px;padding-left:8px;padding-right:8px;margin-left:-8px;margin-right:-8px}
.vg-plancard-row.is-rec .vg-plancard-price{color:var(--vg-green)}

/* plan rows: keep the name on one line, badge beside it, never mid-word */
.vg-plancard-row{flex-wrap:wrap;row-gap:4px}
.vg-plancard-name{flex:1 1 auto;min-width:0;display:flex;align-items:baseline;gap:8px;flex-wrap:nowrap;word-break:keep-all;overflow-wrap:normal;line-break:strict}
.vg-plancard-name em{flex:0 0 auto;white-space:nowrap}
.vg-plancard-price{flex:0 0 auto;white-space:nowrap}
.vg-plantable-row span{word-break:keep-all;overflow-wrap:normal}
.vg-plantable-note{white-space:nowrap}

/* image slots must fill their frame */
.vg-footer-map image-slot,.vg-reason-media image-slot{width:100%;height:100%}
/* recommended row: readable on the dark featured card too */
.vg-plancard.is-featured .vg-plancard-row.is-rec{background:rgba(244,241,234,.10)}
.vg-plancard.is-featured .vg-plancard-row.is-rec .vg-plancard-price{color:var(--vg-accent)}
.vg-plancard.is-featured .vg-plancard-row:not(.is-rec) .vg-plancard-price{color:rgba(244,241,234,.72)}

.vg-results-sub{font-weight:500}

body[data-mode="light"] .vg-plancard-name em{background:rgba(0,112,92,.10);color:var(--vg-green)}
body[data-mode="light"] .vg-plantable-row.is-featured{background:rgba(0,112,92,.06)}
body[data-mode="light"] .vg-plancard-row.is-rec{background:rgba(0,112,92,.07)}
body[data-mode="light"] .vg-reason-no{background:var(--vg-green-deep)}
body[data-mode="light"] .vg-plans-fees{border-color:rgba(0,70,56,.2)}

/* ── timetable ────────────────────────────────────────────────────────── */
.vg-sched{padding:110px 0;background:var(--vg-paper)}
.vg-sched-head{max-width:760px;margin:0 auto 52px;text-align:center}
.vg-sched-head .vg-sectlabel{justify-content:center}
.vg-sched-lead{font-size:17.5px;line-height:1.95;color:var(--vg-ink-2);margin:18px 0 0;text-wrap:pretty}
.vg-sched-scroll{overflow-x:auto;border:1px solid var(--vg-rule);border-radius:6px;background:var(--vg-surface)}
.vg-sched-table{width:100%;min-width:720px;border-collapse:collapse;text-align:center}
.vg-sched-table th,.vg-sched-table td{border-bottom:1px solid var(--vg-rule);border-right:1px solid var(--vg-rule)}
.vg-sched-table th:last-child,.vg-sched-table td:last-child{border-right:0}
.vg-sched-table tr:last-child th,.vg-sched-table tr:last-child td{border-bottom:0}
.vg-sched-corner{background:var(--vg-green-deep);width:104px}
.vg-sched-day{background:var(--vg-green-deep);color:var(--vg-cream);font-family:var(--en);font-size:16.3px;font-weight:600;letter-spacing:.08em;padding:14px 8px}
.vg-sched-day.is-weekend{color:var(--vg-accent)}
.vg-sched-day sup{font-family:var(--mono);font-size:9.5px;margin-left:2px;opacity:.75;font-weight:400}
.vg-sched-time{padding:12px 14px;text-align:left;white-space:nowrap;background:rgba(0,127,104,.06)}
.vg-sched-time b{display:block;font-family:var(--en);font-size:16.3px;font-weight:600;color:var(--vg-ink);letter-spacing:.02em}
.vg-sched-time>span{display:block;font-family:var(--mono);font-size:11.9px;color:var(--vg-ink-2);margin-top:2px}
.vg-sched-table td{padding:12px 8px}
.vg-sched-pro{display:inline-flex;align-items:baseline;gap:1px;font-family:var(--jp);font-size:16.3px;font-weight:500;color:var(--vg-ink)}
.vg-sched-pro i{font-style:normal;font-size:12.5px;color:var(--vg-ink-2)}
.vg-sched-on{background:rgba(0,127,104,.05)}
.vg-sched-dash{color:var(--vg-ink-2);opacity:.35;font-size:15px}
.vg-sched-notes{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-direction:column;gap:8px}
.vg-sched-notes li{display:flex;gap:12px;font-size:14.4px;line-height:1.8;color:var(--vg-ink-2)}
.vg-sched-notes b{font-family:var(--mono);font-size:11.9px;letter-spacing:.1em;color:var(--vg-green);flex:0 0 auto;padding-top:2px}
body[data-mode="light"] .vg-sched-time{background:rgba(0,112,92,.05)}
body[data-mode="light"] .vg-sched-on{background:rgba(0,112,92,.04)}
@media (max-width:720px){.vg-sched-table{min-width:640px}}
.vg-sched-cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:44px}
.vg-sectlabel-no:empty{display:none}
.vg-sched-table{table-layout:fixed}
.vg-sched-day{width:calc((100% - 104px)/7)}
.vg-sched-dash{opacity:.6}
.vg-sched-time>span>span{display:inline}

/* ── mobile type scale ────────────────────────────────────────────────── */
@media (max-width:760px){
  .vg-noticebar{font-size:12.5px}
  .vg-noticebar-tag{font-size:10.5px}
  .vg-noticebar-link{font-size:12px}
  .vg-btn{height:44px;font-size:15px;padding:0 18px}
  .vg-sectlabel{font-size:11.5px;gap:10px}
  .vg-sectlabel-jp{font-size:12.5px}
  .vg-h2{font-size:clamp(24px,6.4vw,32px)}
  .vg-show{min-height:min(86vh,720px)}
  .vg-show-h{font-size:clamp(29px,8vw,40px);line-height:1.5}
  .vg-show-en{font-size:17px;margin-bottom:26px}
  .vg-show-eyebrow{font-size:12px;padding:6px 13px;margin-bottom:22px}
  .vg-show-overlay{padding-bottom:76px}
  .vg-results{padding:76px 0}
  .vg-results-h{font-size:clamp(27px,7.4vw,36px)}
  .vg-results-sub{font-size:18px}
  .vg-results-attr{font-size:11.5px}
  .vg-results-fine{font-size:12px;margin-top:28px}
  .vg-results-figs{padding:26px 24px}
  .vg-fig-num{font-size:46px}
  .vg-fig-num small{font-size:15px}
  .vg-fig-label{font-size:14.5px}
  .vg-fig-note{font-size:10.5px}
  .vg-reasons{padding:76px 0}
  .vg-reasons-lead,.vg-plans-lead,.vg-footer-lead,.vg-sched-lead{font-size:15px;line-height:1.9}
  .vg-reason-en{font-size:11.5px}
  .vg-reason-t{font-size:21px}
  .vg-reason-d{font-size:14px}
  .vg-reason-extra{padding:18px 18px;margin-top:20px}
  .vg-reason-extra-t{font-size:16px}
  .vg-reason-extra-en{font-size:10.5px}
  .vg-reason-extra-d{font-size:13.5px}
  .vg-reason-extra-meta li{font-size:12px}
  .vg-plans{padding:76px 0}
  .vg-plancard-tier{font-size:13px}
  .vg-plancard-desc{font-size:13.5px}
  .vg-plancard-name{font-size:14.5px}
  .vg-plancard-name em{font-size:10.5px}
  .vg-plancard-price{font-size:24px}
  .vg-plancard-price small{font-size:12px}
  .vg-plancard-feat li{font-size:13.5px}
  .vg-plancard-ribbon{font-size:10.5px}
  .vg-plans-fees-row span{font-size:11px}
  .vg-plans-fees-row b{font-size:20px}
  .vg-plans-fees-row b small{font-size:12px}
  .vg-plans-notes{font-size:12.5px}
  .vg-footer{padding:76px 0 28px}
  .vg-footer-h{font-size:clamp(27px,7.2vw,38px)}
  .vg-footer-cta{padding-bottom:56px;margin-bottom:44px}
  .vg-footer-dl dd{font-size:13px}
  .vg-footer-dl dt{font-size:10.5px}
  .vg-footer-social{font-size:11px}
  .vg-hours{font-size:13.5px}
  .vg-hours-note{font-size:12px}
  .vg-footer-hours-en{font-size:11px}
  .vg-footer-hours-jp{font-size:11.5px}
  .vg-footer-name{font-size:16px}
  .vg-footer-sub{font-size:10.5px}
  .vg-footer-bot{font-size:11px}
  .vg-footer-wm{font-size:clamp(56px,18vw,110px)}
  .vg-sched{padding:72px 0}
  .vg-sched-day{font-size:14px;padding:11px 6px}
  .vg-sched-time b{font-size:14px}
  .vg-sched-time span{font-size:10.5px}
  .vg-sched-pro{font-size:14px}
  .vg-sched-pro i{font-size:11px}
  .vg-sched-notes li{font-size:12.5px}
}

/* photo fills — referenced from CSS so bundles/exports resolve them */
.vg-show-img{background-size:cover;background-position:center;background-repeat:no-repeat}
.vg-show-img.is-course{background-image:url(../img/hero-course.jpg)}
.vg-show-img.is-green{background-image:url(../img/hero-green.jpg)}
.vg-show-img.is-bfly{background-image:url(../img/hero-bfly.jpg)}
.vg-show-img.is-lesson{background-image:url(../img/hero-lesson.jpg)}
.vg-reason-photo{position:absolute;inset:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat}
.vg-reason-photo.is-01{background-image:url(../img/team-pro.jpg);background-size:contain;background-color:#00525f}
.vg-reason-photo.is-02{background-image:url(../img/lesson-02.jpg);background-position:center 45%}
.vg-reason-photo.is-03{background-image:url(../img/sim-03b.jpg)}
.vg-reason-photo.is-04{background-image:url(../img/event-04.jpg)}
.vg-reason-link{display:inline-flex;align-items:center;gap:8px;margin-top:20px;font-family:var(--jp);font-size:15.6px;font-weight:500;color:var(--vg-green);padding-bottom:3px;border-bottom:1px solid currentColor;transition:color .15s,gap .15s}
.vg-reason-link:hover{color:var(--vg-green-2);gap:12px}
@media (max-width:760px){.vg-reason-link{font-size:14px;margin-top:16px}}

/* brand logo */
.vg-logo-mark{width:auto;height:42px;background:none;border-radius:0;display:block;flex:0 0 auto}
.vg-footer-logo{height:56px;width:auto;display:block;flex:0 0 auto}
@media (max-width:760px){.vg-logo-mark{height:34px}.vg-footer-logo{height:46px}}
.vg-footer-map .vg-footer-pin{top:auto;left:auto;right:14px;bottom:14px;transform:none;flex-direction:row;align-items:center;gap:8px;pointer-events:none}

/* ── mobile hero: photo as a landscape band, copy below ───────────────── */
@media (max-width:760px){
  .vg-show{display:block;min-height:0;background:var(--vg-bg)}
  .vg-show-stage{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden}
  .vg-show-veil{display:none}
  .vg-show-stage::after{content:"";position:absolute;inset:auto 0 0;height:38%;background:linear-gradient(0deg,rgba(6,10,7,.72),rgba(6,10,7,0));z-index:2;pointer-events:none}
  .vg-show-cap{display:flex;right:14px;top:auto;bottom:14px;z-index:3}
  .vg-show-cap-en{font-size:10.5px;letter-spacing:.2em}
  .vg-show-cap-jp{font-size:12px}
  .vg-show-dots{position:static;justify-content:center;gap:8px;padding:16px 0 0}
  .vg-show-dot{width:34px}
  .vg-show-index{display:none}
  .vg-show-overlay{position:relative;padding:26px 0 52px}
  .vg-show-h{text-shadow:none}
}

/* empty photo slot → slim VG logo band */
.vg-reason-media.is-logoband{aspect-ratio:auto;min-height:104px;background:var(--vg-green-deep);border:1px solid var(--vg-rule)}
.vg-reason-photo.is-logo{background-size:auto 54%;background-position:right 28px center;background-repeat:no-repeat}
@media (max-width:760px){.vg-reason-media.is-logoband{min-height:80px}.vg-reason-photo.is-logo{background-position:right 18px center;background-size:auto 48%}}

@media (max-width:760px){
  .vg-show{display:flex;flex-direction:column}
  .vg-show-stage{order:1}
  .vg-show-dots{order:2;padding:14px 0 2px}
  .vg-show-overlay{order:3}
}
@media (max-width:1000px){
  .vg-header-tel{display:none}
  .vg-nav{gap:20px}
}
.vg-header-tel-num{white-space:nowrap}