/* ===== 響應式版面 ===== */

/* 平板以下 */
@media (max-width: 820px) {
  .nav-links {
    gap: 1.1rem;
  }

  .nav-links a {
    font-size: 0.8rem;
  }

  .notes-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* 手機 */
@media (max-width: 640px) {
  /* 導覽列：手機只留品牌與主要連結 */
  .nav-links {
    gap: 0.9rem;
  }

  .nav-links a.nav-optional {
    display: none;
  }

  /* 新人介紹改上下排列 */
  .couple-grid {
    grid-template-columns: 1fr;
    max-width: 340px;
  }

  /* 時間軸改單欄靠左 */
  .story-timeline::before {
    left: 8px;
  }

  .story-item {
    grid-template-columns: 1fr;
    gap: 1rem;
    padding-left: 2rem;
  }

  .story-item::before {
    left: 8px;
    top: 10px;
    transform: translate(-50%, 0);
  }

  .story-item:nth-child(even) .story-media {
    order: 1;
  }

  .story-item:nth-child(even) .story-body {
    order: 2;
    text-align: left;
  }

  /* 婚宴按鈕改單欄 */
  .venue-actions {
    grid-template-columns: 1fr;
  }

  .venue-times {
    gap: 1.6rem;
  }

  /* 交通資訊單欄 */
  .transport-grid {
    grid-template-columns: 1fr;
  }

  /* 相簿：橫向滑動 */
  .gallery-grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 0.9rem;
    padding-bottom: 0.8rem;
    -webkit-overflow-scrolling: touch;
  }

  .gallery-item {
    flex: 0 0 72%;
    scroll-snap-align: center;
  }

  /* 佔位圖路徑在窄卡片內完整顯示 */
  .ph-label .ph-path {
    font-size: 0.55rem;
    padding-inline: 0.6em;
    max-width: 100%;
  }

  /* 注意事項單欄 */
  .notes-grid {
    grid-template-columns: 1fr;
    max-width: 420px;
  }

  .lightbox-prev { left: 0.2rem; }
  .lightbox-next { right: 0.2rem; }
}

/* 極小螢幕（320px 起） */
@media (max-width: 360px) {
  .hero-names {
    font-size: 1.75rem;
  }

  .hero-tagline {
    font-size: 0.7rem;
    margin-bottom: 0.7rem;
  }

  .hero-parents p {
    font-size: 0.78rem;
  }

  .hero-date {
    font-size: 0.98rem;
  }

  .countdown-cell {
    min-width: 64px;
  }

  .nav-links a {
    letter-spacing: 0.06em;
  }
}

/* 桌面加寬時避免內容過度拉伸 */
@media (min-width: 1400px) {
  .container {
    max-width: var(--container-max);
  }
}
