.tour-teaser { padding: 5rem 0; background: #f4f4f4; scroll-margin-top: 100px; }
.tour-teaser-card {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  overflow: hidden;
  border-radius: 24px;
  background: #04133f;
  box-shadow: 0 24px 64px rgba(4, 19, 63, .12);
}
.tour-teaser-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 3.5rem 2.75rem;
  background: radial-gradient(ellipse at 0 100%, rgba(192, 159, 80, .13), transparent 65%);
}
.tour-teaser-copy .section-label { font-size: .72rem; letter-spacing: 1.7px; }
.tour-teaser-copy h2 { color: #fff; font-size: clamp(1.8rem, 2.7vw, 2.6rem); letter-spacing: -.8px; margin: .6rem 0 1.25rem; }
.tour-teaser-copy > p { color: #c7cede; font-size: .98rem; line-height: 1.85; max-width: 340px; }
.tour-teaser-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem; margin-top: 2rem; }
.tour-teaser-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  min-height: 50px;
  padding: .8rem 1.5rem;
  border-radius: 999px;
  font-family: var(--font-heading);
  font-size: .84rem;
  font-weight: 600;
  color: #04133f;
  background: #d9bb75;
}
.tour-teaser-action:hover { background: #ebce88; transform: translateY(-2px); }
.tour-teaser-action-secondary { color: #fff; font-size: .84rem; font-weight: 500; padding: .6rem 0; }
.tour-teaser-action-secondary:hover { color: #d9bb75; }
.tour-teaser-preview { position: relative; min-width: 0; display: flex; flex-direction: column; background: #f3f1eb; }
.tour-teaser-preview-header { padding: 1.5rem 1.7rem 0; color: #04133f; font-size: .8rem; font-weight: 500; }
.tour-teaser-stage { position: relative; flex: 1; min-height: 340px; }
.tour-teaser-poster { position: absolute; width: 100%; height: 100%; object-fit: contain; }
.tour-teaser-stage canvas { position: absolute; width: 100%; height: 100%; touch-action: pan-y; }
.tour-teaser-preview.is-ready .tour-teaser-poster { visibility: hidden; }
.tour-teaser-preview.is-ready .tour-teaser-stage { cursor: grab; }
.tour-teaser-preview.is-ready .tour-teaser-stage:active { cursor: grabbing; }
.tour-teaser-hint { visibility: hidden; text-align: center; padding: .3rem 1rem 1.25rem; color: #747976; font-size: .7rem; }
.tour-teaser-preview.is-ready .tour-teaser-hint { visibility: visible; }
.tour-teaser :is(a, canvas):focus-visible { outline: 3px solid #c09f50; outline-offset: -3px; }
@media (max-width: 1000px) {
  .tour-teaser-copy { padding: 2.75rem 2rem; }
  .tour-teaser-actions { gap: 1rem; }
  .tour-teaser-preview-header { padding: 1.4rem 1.2rem 0; }
}
@media (max-width: 760px) {
  .tour-teaser { padding: 3rem 0; }
  .tour-teaser-card { grid-template-columns: 1fr; border-radius: 20px; }
  .tour-teaser-copy { padding: 2.5rem 1.75rem; }
  .tour-teaser-copy h2 { font-size: 2rem; }
  .tour-teaser-actions { margin-top: 1.5rem; }
  .tour-teaser-stage { height: 320px; flex: none; min-height: 0; }
  .tour-teaser-preview-header { padding: 1.4rem 1.4rem 0; }
}
@media (max-width: 420px) {
  .tour-teaser > .container { padding: 0 1rem; }
  .tour-teaser-copy { padding: 2.25rem 1.4rem; }
  .tour-teaser-copy h2 { font-size: 1.8rem; }
  .tour-teaser-action { font-size: .78rem; padding: .8rem 1.2rem; }
  .tour-teaser-action-secondary { font-size: .78rem; }
  .tour-teaser-stage { height: 295px; }
}
@media (prefers-reduced-motion: reduce) {
  .tour-teaser a { transition: none; }
  .tour-teaser-action:hover { transform: none; }
}