/* ===========================================
   Tree Launcher — Tour Page (App Tour Video)
   =========================================== */

.tour { max-width: 960px; margin: 0 auto; padding: 112px 24px 96px; }

.tour-header { text-align: center; margin-bottom: 32px; }
.tour-header h1 { font-size: 36px; font-weight: 700; letter-spacing: -1.5px; margin-bottom: 12px; }
.tour-subtitle { font-size: 16px; line-height: 1.6; color: var(--text-secondary); max-width: 520px; margin: 0 auto; }

/* Responsive 16:9 video embed in a green highlight frame */
.tour-video {
  padding: 10px;
  background: var(--green-50);
  border: 1px solid var(--green-100);
  border-radius: 20px;
}
.tour-video iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 12px;
  background: var(--neutral-900);
}

.tour-more { text-align: center; margin-top: 48px; }
.tour-more p { font-size: 15px; color: var(--text-tertiary); margin-bottom: 20px; }
.tour-links {
  display: flex; flex-direction: column; align-items: center;
  gap: 12px;
}

/* Mobile — primary audience arrives here from the app */
@media (max-width: 768px) {
  .tour { padding: 88px 16px 64px; }
  .tour-header { margin-bottom: 20px; }
  .tour-header h1 { font-size: 28px; }
  .tour-subtitle { font-size: 15px; }
  .tour-video { padding: 6px; border-radius: 14px; }
  .tour-video iframe { border-radius: 9px; }
  .tour-more { margin-top: 36px; }
  .tour-links .btn-primary { width: 100%; justify-content: center; }
}