/* Page composition. Brand values come from the copied design system. */
body { font-synthesis: none; }
html { scroll-padding-top: var(--multidoc-space-96); }
main:focus { outline: none; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: var(--multidoc-space-24); height: var(--multidoc-space-24); fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.prototype-strip { background: var(--multidoc-lavender); color: var(--multidoc-text-secondary); font-size: var(--multidoc-caption-size); line-height: var(--multidoc-caption-line-height); text-align: center; padding-block: var(--multidoc-space-8); }
.site-header { background: var(--multidoc-surface); position: sticky; top: 0; z-index: 20; border-bottom: var(--multidoc-border-width) solid var(--multidoc-divider); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--multidoc-space-24); padding-block: var(--multidoc-space-16); }
.site-nav { display: flex; align-items: center; gap: var(--multidoc-space-24); }
.site-nav a { display: flex; align-items: center; min-height: var(--multidoc-touch-target); font-size: var(--multidoc-label-size); font-weight: var(--multidoc-weight-label); color: var(--multidoc-text-secondary); text-decoration: none; }
.site-nav a:hover { color: var(--multidoc-primary); }
.menu-toggle { display: none; align-items: center; justify-content: center; width: var(--multidoc-touch-target); height: var(--multidoc-touch-target); background: var(--multidoc-lavender); color: var(--multidoc-primary); border: 0; border-radius: var(--multidoc-radius-pill); }
.header-cta { flex-shrink: 0; }
.eyebrow { font-size: var(--multidoc-label-size); font-weight: var(--multidoc-weight-label); line-height: var(--multidoc-label-line-height); color: var(--multidoc-primary); margin-bottom: var(--multidoc-space-16); }
.hero { position: relative; isolation: isolate; display: grid; grid-template-columns: 1fr 1fr; margin-top: var(--multidoc-space-32); padding: var(--multidoc-hero-padding); border-radius: var(--multidoc-radius-hero); background: var(--multidoc-surface) url('assets/images/map_hero_background_v1.png') center / cover no-repeat; }
.hero-copy { position: relative; z-index: 2; background: var(--multidoc-surface); border-radius: var(--multidoc-radius-card); padding: var(--multidoc-space-32); min-width: 0; }
.hero .eyebrow { display: flex; align-items: center; gap: var(--multidoc-space-8); }
.hero h1 { margin-bottom: var(--multidoc-space-24); }
.hero-description { margin-bottom: var(--multidoc-space-24); }
.visit-date { display: flex; align-items: center; gap: var(--multidoc-space-16); margin-bottom: var(--multidoc-space-24); }
.visit-date strong { font-size: var(--multidoc-h3-size); line-height: var(--multidoc-h3-line-height); font-weight: var(--multidoc-weight-heading); display: block; }
.visit-date .md-caption { display: block; margin-top: var(--multidoc-space-4); }
.icon-disc { display: inline-flex; align-items: center; justify-content: center; width: var(--multidoc-space-48); height: var(--multidoc-space-48); border-radius: var(--multidoc-radius-pill); color: var(--multidoc-primary); background: var(--multidoc-lavender); flex: 0 0 auto; }
.hero-booking { display: grid; gap: var(--multidoc-space-16); }
.hero-price { display: flex; gap: var(--multidoc-space-12); align-items: baseline; flex-wrap: wrap; }
.hero-price strong { font-size: var(--multidoc-h3-size); font-weight: var(--multidoc-weight-heading); }
.hero .md-btn { width: 100%; }
.process-link { display: inline-flex; align-items: center; justify-content: space-between; gap: var(--multidoc-space-8); min-height: var(--multidoc-touch-target); width: 100%; color: var(--multidoc-text-secondary); font-size: var(--multidoc-label-size); font-weight: var(--multidoc-weight-label); margin-top: var(--multidoc-space-12); text-decoration: none; }
.process-link:hover { color: var(--multidoc-primary); }
.hero-map { position: relative; min-width: 0; }
.mobile-map { display: none; }
.map-topline { position: absolute; top: 0; right: 0; }
.map-route { display: flex; align-items: center; gap: var(--multidoc-space-8); padding: var(--multidoc-space-12) var(--multidoc-space-16); background: var(--multidoc-surface); border-radius: var(--multidoc-radius-pill); font-size: var(--multidoc-label-size); font-weight: var(--multidoc-weight-label); }
.visit-countdown { position: absolute; right: 0; bottom: calc(var(--multidoc-space-96) + var(--multidoc-space-32)); display: flex; align-items: flex-start; gap: var(--multidoc-space-16); padding: var(--multidoc-space-24); background: var(--multidoc-surface); border-radius: var(--multidoc-radius-card); }
.countdown-icon { display: flex; align-items: center; justify-content: center; border-radius: var(--multidoc-radius-field); width: var(--multidoc-space-48); height: var(--multidoc-space-48); background: var(--multidoc-lavender); color: var(--multidoc-primary); }
.countdown-body p { margin-block: var(--multidoc-space-8); }
.countdown-body strong { font-size: var(--multidoc-number-size); font-weight: var(--multidoc-weight-number); line-height: var(--multidoc-number-line-height); color: var(--multidoc-primary); }
.countdown-body > .md-caption:last-child { display: block; }
.map-caption { position: absolute; bottom: 0; right: 0; padding: var(--multidoc-space-4) var(--multidoc-space-8); background: var(--multidoc-surface); border-radius: var(--multidoc-radius-pill); font-size: var(--multidoc-caption-size); color: var(--multidoc-text-secondary); }
.section { margin-top: var(--multidoc-section-gap); }
.section-head { max-width: var(--multidoc-text-measure); margin-bottom: var(--multidoc-space-32); }
.section-head h2 { margin-bottom: var(--multidoc-space-16); }
.section-head > p:last-child { color: var(--multidoc-text-secondary); }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--multidoc-space-24); padding: 0; margin: 0; list-style: none; }
.step { min-width: 0; padding: var(--multidoc-card-padding); border-radius: var(--multidoc-radius-card); background: var(--multidoc-lavender); }
.step:nth-child(2) { background: var(--multidoc-mint); }
.step:nth-child(3) { background: var(--multidoc-peach); }
.step-top { display: flex; justify-content: space-between; align-items: center; color: var(--multidoc-primary); margin-bottom: var(--multidoc-space-32); }
.step-number { font-size: var(--multidoc-number-size); font-weight: var(--multidoc-weight-number); line-height: var(--multidoc-number-line-height); }
.step h3 { margin-bottom: var(--multidoc-space-16); }
.step p { color: var(--multidoc-text-secondary); }
.connection-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--multidoc-space-48); background: var(--multidoc-lavender); border-radius: var(--multidoc-radius-hero); padding: var(--multidoc-hero-padding); align-items: center; }
.connection-copy { min-width: 0; }
.connection-copy h2 { margin-bottom: var(--multidoc-space-24); }
.check-list { list-style: none; padding: 0; margin: var(--multidoc-space-24) 0; display: grid; gap: var(--multidoc-space-12); }
.check-list li { display: flex; gap: var(--multidoc-space-12); align-items: flex-start; }
.check-list .icon { color: var(--multidoc-primary); margin-top: var(--multidoc-space-4); }
.connection-note { margin-bottom: var(--multidoc-space-16); }
.inline-link { display: inline-flex; align-items: center; gap: var(--multidoc-space-8); min-height: var(--multidoc-touch-target); font-weight: var(--multidoc-weight-label); font-size: var(--multidoc-label-size); }
.contact-visual { padding: var(--multidoc-space-32); background: var(--multidoc-gradient); border-radius: var(--multidoc-radius-hero); min-width: 0; }
.contact-card { background: var(--multidoc-surface); padding: var(--multidoc-card-padding); border-radius: var(--multidoc-radius-card); }
.contact-avatar { width: var(--multidoc-space-96); height: var(--multidoc-space-96); object-fit: cover; object-position: center 24%; border-radius: var(--multidoc-radius-pill); margin: 0 0 var(--multidoc-space-16); }
.contact-card h3 { margin-bottom: var(--multidoc-space-24); }
.contact-method { display: flex; gap: var(--multidoc-space-12); align-items: center; padding-block: var(--multidoc-space-16); border-top: var(--multidoc-border-width) solid var(--multidoc-divider); }
.contact-method strong { display: block; font-size: var(--multidoc-label-size); font-weight: var(--multidoc-weight-heading); }
.contact-method span:not(.icon-disc) { display: block; font-size: var(--multidoc-caption-size); color: var(--multidoc-text-secondary); }
.contact-note { margin-top: var(--multidoc-space-16); }
.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--multidoc-space-24); }
.person-card { background: var(--multidoc-surface); border-radius: var(--multidoc-radius-card); min-width: 0; }
.person-photo { position: relative; }
.person-photo > img { width: 100%; height: auto; aspect-ratio: 1.1; object-fit: cover; object-position: center 27%; border-radius: var(--multidoc-radius-card); }
.person-photo .md-chip { position: absolute; bottom: var(--multidoc-space-16); left: var(--multidoc-space-16); background: var(--multidoc-surface); }
.person-copy { padding: var(--multidoc-card-padding); }
.person-copy .eyebrow { margin-bottom: var(--multidoc-space-8); }
.person-copy h3 { margin-bottom: var(--multidoc-space-16); }
.person-copy > p:last-child { color: var(--multidoc-text-secondary); }
.team-disclosure { max-width: var(--multidoc-text-measure); margin-top: var(--multidoc-space-24); }
.story-layout { display: grid; grid-template-columns: 1fr 1fr; gap: var(--multidoc-space-48); align-items: center; }
.story-copy { min-width: 0; }
.story-copy h2 { margin-bottom: var(--multidoc-space-24); }
.story-copy > p:not(.md-caption) { color: var(--multidoc-text-secondary); }
.story-result { display: flex; gap: var(--multidoc-space-16); align-items: flex-start; background: var(--multidoc-mint); padding: var(--multidoc-space-24); border-radius: var(--multidoc-radius-field); margin-block: var(--multidoc-space-24); }
.story-result .icon { color: var(--multidoc-success); margin-top: var(--multidoc-space-4); }
.story-photo { min-width: 0; margin: 0; }
.story-photo img { width: 100%; aspect-ratio: 1.1; height: auto; object-fit: cover; border-radius: var(--multidoc-radius-hero); }
.story-photo figcaption { margin-top: var(--multidoc-space-12); }
.conditions-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--multidoc-space-24); }
.location-card, .price-card { min-width: 0; background: var(--multidoc-surface); border-radius: var(--multidoc-radius-card); padding: var(--multidoc-card-padding); }
.location-card > .icon-disc { margin-bottom: var(--multidoc-space-24); }
.location-details { margin: var(--multidoc-space-24) 0; display: grid; gap: var(--multidoc-space-24); }
.location-details dt { font-size: var(--multidoc-caption-size); color: var(--multidoc-text-secondary); margin-bottom: var(--multidoc-space-4); }
.location-details dd { margin: 0; }
.location-card > .md-caption { margin-top: var(--multidoc-space-16); }
.primary-price { border: var(--multidoc-border-width) solid var(--multidoc-primary); }
.price-card > .md-chip { margin-bottom: var(--multidoc-space-24); }
.price-card h3 { margin-bottom: var(--multidoc-space-24); }
.price-number { font-size: var(--multidoc-number-size); font-weight: var(--multidoc-weight-number); line-height: var(--multidoc-number-line-height); margin-bottom: var(--multidoc-space-24); }
.price-number span { font-weight: var(--multidoc-weight-heading); }
.price-status { margin-bottom: var(--multidoc-space-24); }
.price-includes { list-style: none; padding: 0; margin: 0 0 var(--multidoc-space-24); display: grid; gap: var(--multidoc-space-12); }
.price-includes li { display: flex; gap: var(--multidoc-space-12); }
.price-includes li::before { content: '✓'; color: var(--multidoc-primary); font-weight: var(--multidoc-weight-heading); }
.repeat-price { background: var(--multidoc-lavender); }
.repeat-price > .md-chip { background: var(--multidoc-surface); }
.conditions-disclosure { margin-top: var(--multidoc-space-24); }
.faq-layout { display: grid; grid-template-columns: 1fr 2fr; gap: var(--multidoc-space-64); align-items: start; }
.faq-heading h2 { margin-bottom: var(--multidoc-space-24); }
.faq-heading > p:not(.eyebrow) { color: var(--multidoc-text-secondary); }
.faq-items { display: grid; gap: var(--multidoc-space-12); min-width: 0; }
.faq-item { background: var(--multidoc-surface); border-radius: var(--multidoc-radius-field); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: var(--multidoc-space-24); padding: var(--multidoc-space-24); min-height: var(--multidoc-control-height); list-style: none; cursor: pointer; font-weight: var(--multidoc-weight-label); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; display: flex; align-items: center; justify-content: center; color: var(--multidoc-primary); font-size: var(--multidoc-h3-size); width: var(--multidoc-space-32); height: var(--multidoc-space-32); border-radius: var(--multidoc-radius-pill); background: var(--multidoc-lavender); flex-shrink: 0; }
.faq-item[open] summary::after { content: '−'; }
.faq-item summary:hover { color: var(--multidoc-primary); }
.faq-answer { padding: 0 var(--multidoc-space-24) var(--multidoc-space-24); color: var(--multidoc-text-secondary); }
.booking-layout { display: grid; grid-template-columns: 1fr 1fr; gap: var(--multidoc-space-64); background: var(--multidoc-lavender); border-radius: var(--multidoc-radius-hero); padding: var(--multidoc-hero-padding); align-items: center; }
.booking-copy { min-width: 0; }
.booking-copy h2 { margin-bottom: var(--multidoc-space-24); }
.booking-copy > p:not(.eyebrow) { color: var(--multidoc-text-secondary); }
.booking-date { display: flex; align-items: center; gap: var(--multidoc-space-12); margin-top: var(--multidoc-space-24); font-weight: var(--multidoc-weight-label); }
.booking-date .icon, .booking-hint .icon { color: var(--multidoc-primary); }
.booking-hint { display: flex; align-items: flex-start; gap: var(--multidoc-space-12); margin-top: var(--multidoc-space-32); font-size: var(--multidoc-caption-size); }
.booking-hint .icon { margin-top: var(--multidoc-space-4); }
.booking-form { padding: var(--multidoc-space-32); background: var(--multidoc-surface); border-radius: var(--multidoc-radius-card); min-width: 0; }
.booking-form h3 { margin-bottom: var(--multidoc-space-12); }
.form-demo-note { margin-bottom: var(--multidoc-space-24); }
.form-field { display: grid; gap: var(--multidoc-space-8); margin-bottom: var(--multidoc-space-24); }
.form-field label { font-size: var(--multidoc-label-size); line-height: var(--multidoc-label-line-height); font-weight: var(--multidoc-weight-label); }
.form-field input { width: 100%; height: var(--multidoc-control-height); padding: var(--multidoc-space-16); background: var(--multidoc-surface); border: var(--multidoc-border-width) solid var(--multidoc-field-border); border-radius: var(--multidoc-radius-field); min-width: 0; }
.form-field input:hover { border-color: var(--multidoc-primary); }
.form-field input::placeholder { color: var(--multidoc-text-secondary); opacity: 1; }
.form-field input[aria-invalid="true"] { border-color: var(--multidoc-error); }
.field-error { font-size: var(--multidoc-caption-size); color: var(--multidoc-error); }
.form-submit { width: 100%; }
.form-result { margin-top: var(--multidoc-space-16); padding: var(--multidoc-space-16); border-radius: var(--multidoc-radius-field); color: var(--multidoc-text-secondary); background: var(--multidoc-lavender); font-size: var(--multidoc-caption-size); margin-bottom: 0; }
.site-footer { margin-top: var(--multidoc-section-gap); border-top: var(--multidoc-border-width) solid var(--multidoc-divider); background: var(--multidoc-surface); padding-block: var(--multidoc-space-32); }
.footer-layout { display: flex; align-items: center; justify-content: space-between; gap: var(--multidoc-space-24); }
.footer-layout > p { margin: 0; }
.footer-layout > .inline-link .icon { transform: rotate(180deg); }
.mobile-booking { display: none; }
.noscript-note { margin-block: var(--multidoc-space-24); }

@media (max-width: 1199px) {
  .header-inner { gap: var(--multidoc-space-16); }
  .site-nav { gap: var(--multidoc-space-16); }
  .header-cta { display: none; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .hero { padding: var(--multidoc-space-32); background: var(--multidoc-surface); grid-template-columns: minmax(0,1fr); gap: var(--multidoc-space-32); }
  .hero-copy { padding: 0; }
  .hero h1 { font-size: var(--multidoc-h1-tablet-size); }
  .mobile-map { display: block; width: 100%; height: auto; border-radius: var(--multidoc-radius-card); }
  .map-route { display: none; }
  .visit-countdown { position: static; margin-top: var(--multidoc-space-16); padding: var(--multidoc-space-24); background: var(--multidoc-lavender); }
  .map-caption { position: static; display: block; padding: 0; margin-top: var(--multidoc-space-12); background: none; }
  .connection-layout, .booking-layout { padding: var(--multidoc-space-32); gap: var(--multidoc-space-24); }
  .contact-visual { padding: var(--multidoc-space-16); }
  .story-layout { gap: var(--multidoc-space-24); }
  .conditions-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .location-card { grid-column: 1 / -1; }
  .location-details { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .team-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .person-card:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
  .person-card:last-child .person-photo > img { aspect-ratio: 1.2; }
  .faq-layout { gap: var(--multidoc-space-32); }
  .booking-form { padding: var(--multidoc-space-24); }
}
@media (max-width: 767px) {
  html { scroll-padding-top: var(--multidoc-space-96); }
  .prototype-strip { text-align: left; }
  .header-inner { padding-block: var(--multidoc-space-12); flex-wrap: wrap; }
  .site-nav { display: none; flex-basis: 100%; order: 3; flex-direction: column; align-items: stretch; gap: var(--multidoc-space-4); padding-bottom: var(--multidoc-space-8); }
  .site-nav[data-open="true"] { display: flex; }
  .site-nav a { padding: var(--multidoc-space-8) var(--multidoc-space-16); border-radius: var(--multidoc-radius-field); background: var(--multidoc-page); }
  .menu-toggle { display: inline-flex; }
  .hero { display: block; padding: var(--multidoc-mobile-hero-padding); margin-top: var(--multidoc-space-24); background: var(--multidoc-surface); }
  .hero-copy { padding: 0; }
  .hero h1 { font-size: var(--multidoc-h1-mobile-size); }
  .hero .eyebrow { align-items: flex-start; }
  .hero .eyebrow .icon { margin-top: var(--multidoc-space-4); }
  .hero h1 br { display: none; }
  .hero-price { gap: var(--multidoc-space-4); }
  .hero-price .md-caption { width: 100%; }
  .hero-map { margin-top: var(--multidoc-space-24); }
  .mobile-map { display: block; width: 100%; height: auto; border-radius: var(--multidoc-radius-field); }
  .map-topline { display: block; position: static; margin-top: var(--multidoc-space-16); }
  .map-route { padding: 0; justify-content: space-between; gap: var(--multidoc-space-4); background: none; border-radius: 0; }
  .visit-countdown { position: static; margin-top: var(--multidoc-space-16); padding: var(--multidoc-space-16); background: var(--multidoc-lavender); gap: var(--multidoc-space-12); border-radius: var(--multidoc-radius-field); }
  .countdown-icon { width: var(--multidoc-space-32); height: var(--multidoc-space-32); background: none; }
  .countdown-body > .md-caption:last-child { display: none; }
  .countdown-body p { margin-bottom: 0; }
  .map-caption { display: block; position: static; padding: 0; margin-top: var(--multidoc-space-12); background: none; border-radius: 0; }
  .section { margin-top: var(--multidoc-mobile-section-gap); }
  .section-head { margin-bottom: var(--multidoc-space-24); }
  .steps, .team-grid, .story-layout, .conditions-grid, .faq-layout, .booking-layout, .connection-layout { grid-template-columns: minmax(0,1fr); }
  .step-top { margin-bottom: var(--multidoc-space-24); }
  .step h3 br { display: none; }
  .connection-layout { padding: var(--multidoc-mobile-hero-padding); gap: var(--multidoc-space-32); }
  .contact-visual { padding: var(--multidoc-space-16); }
  .contact-card { padding: var(--multidoc-space-24); }
  .contact-method { gap: var(--multidoc-space-8); }
  .contact-method .icon-disc { width: var(--multidoc-space-32); height: var(--multidoc-space-32); background: transparent; }
  .person-photo > img { aspect-ratio: 1.1; }
  .story-layout { gap: var(--multidoc-space-24); }
  .story-photo img { aspect-ratio: 1.2; }
  .faq-layout { gap: var(--multidoc-space-24); }
  .faq-heading h2 br { display: none; }
  .faq-item summary { gap: var(--multidoc-space-16); }
  .booking-layout { padding: var(--multidoc-mobile-hero-padding); gap: var(--multidoc-space-32); }
  .booking-copy h2 br { display: none; }
  .booking-form { padding: var(--multidoc-space-24); }
  .booking-date { align-items: flex-start; }
  .booking-date .icon { margin-top: var(--multidoc-space-4); }
  .booking-hint { margin-top: var(--multidoc-space-24); }
  .site-footer { margin-top: var(--multidoc-mobile-section-gap); padding-bottom: calc(var(--multidoc-space-32) + var(--multidoc-space-96)); }
  .footer-layout { flex-direction: column; align-items: flex-start; }
  .mobile-booking { display: block; position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; padding: var(--multidoc-space-12) var(--multidoc-space-16) calc(var(--multidoc-space-12) + env(safe-area-inset-bottom)); background: var(--multidoc-surface); border-top: var(--multidoc-border-width) solid var(--multidoc-divider); }
  .mobile-booking .md-btn { width: 100%; }
  .mobile-booking[data-suppressed="true"] { display: none; }
}
@media (max-width: 359px) {
  .contact-card { padding: var(--multidoc-space-16); }
  .booking-form { padding: var(--multidoc-space-16); }
  .md-btn .icon { display: none; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
