/* Layout when the screen is taller than wide (portrait / aspect ratio <= 1/1) */
@media (max-aspect-ratio: 1/1), (orientation: portrait) {
  /* if roadmap is present, stack steps vertically */
  .roadmap-steps {
    flex-direction: column;
    gap: 1rem;
  }

  /* main content: stack columns vertically */
  .content-wrapper,
  .content {
    flex-direction: column;
    gap: 1.25rem;
    min-height: auto;
  }

  .content-left,
  .content-right {
    flex: none;
    width: 100%;
    text-align: left;
  }

  /* Make video containers full width and keep aspect */
  .video-container,
  .video-wrapper,
  #video-player {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: contain;
  }

  /* Typography and spacing tweaks for narrow/tall screens */
  .section-title { font-size: clamp(1.6rem, 6vw, 2.4rem); }
  .section-subtitle { max-width: 90vw; margin: 0 auto 1rem; }

  .cookie-banner-card,
  .cookie-modal-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .cookie-banner-actions,
  .cookie-modal-actions {
    width: 100%;
  }

  .cookie-btn {
    width: 100%;
    justify-content: center;
  }

  .cookie-modal-card {
    margin: 1rem auto;
  }
}