/* ============================================================
   post.css — TRAVEL JOURNAL ARTICLE (post) page-specific styles.
   Shared chrome + post-cards + primitives in /site.css.
   ============================================================ */

/* ---- ARTICLE HEAD ---- */
.art-head { padding: 130px 0 34px; text-align: center; }
.art-head h1 { font-size: 80px; line-height: 88px; max-width: 880px; margin: 0 auto; }
.art-banner img { width: 100%; height: 640px; object-fit: cover; display: block; }
.art-cap {
  max-width: calc(var(--container) + var(--gutter) * 2); margin: 0 auto;
  padding: 10px var(--pad) 0; font-size: 12px; line-height: 16px; color: var(--cap);
}
.art-cap .dot { color: var(--teal); }

/* ---- ARTICLE BODY ---- */
.article { padding: 48px 0 100px; }
.art-text { max-width: 808px; margin: 0 auto; }
.art-text h2 { font-family: var(--sans); font-weight: 400; font-size: 32px; line-height: 40px; letter-spacing: -0.03em; color: var(--ink); margin: 108px 0 24px; }
.art-text .bold { font-weight: 700; font-size: 15px; color: var(--ink); margin-bottom: 16px; }
.art-text p { color: var(--ink-soft); font-size: 15px; line-height: 26px; margin-bottom: 22px; }

/* full-width media rows */
.art-media { margin: 60px 0 16px; }
.art-row { display: grid; gap: 24px; }
.art-row.cols-2 { grid-template-columns: 1fr 1fr; }
.art-row.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
.art-row figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.art-row.cols-2 figure img { aspect-ratio: 3 / 2; }
.art-row figcaption { margin-top: 10px; font-size: 12px; line-height: 16px; color: var(--cap); }
.art-row figcaption .dot { color: var(--teal); }
.art-single img { width: 100%; aspect-ratio: 1232 / 770; object-fit: cover; display: block; }
.art-single figcaption { margin-top: 10px; font-size: 12px; line-height: 16px; color: var(--cap); }

/* ---- CRUISE LIST ---- */
.cruise-item { display: grid; grid-template-columns: 420px 1fr; gap: 48px; align-items: center; margin-bottom: 64px; }
.cruise-item img { width: 100%; aspect-ratio: 380 / 256; object-fit: cover; }
.cruise-name { font-family: var(--serif); font-weight: 400; font-size: 34px; line-height: 42px; color: var(--ink); margin-bottom: 10px; }
.cruise-meta { font-size: 13px; color: var(--ink); font-weight: 600; margin-bottom: 6px; }
.cruise-ship { font-size: 13px; color: var(--cap); margin-bottom: 16px; }
.cruise-item p { color: var(--ink-soft); font-size: 15px; line-height: 24px; }

/* ---- PLAN box ---- */
.plan-box { max-width: 808px; margin: 30px auto 0; background: var(--sand); border-radius: 12px; padding: 38px 44px; }
.plan-box .bold { font-weight: 700; font-size: 15px; color: var(--ink); margin-bottom: 16px; }
.plan-box p { color: var(--ink-soft); font-size: 15px; line-height: 25px; margin-bottom: 18px; }
.plan-box .pill-navy { margin-top: 6px; }

/* ---- SPEAK CTA ---- */
.speak { padding: 110px 0 120px; text-align: center; }
.speak h2 { font-family: var(--serif); font-weight: 400; font-size: 40px; line-height: 48px; color: var(--ink); margin-bottom: 30px; }
.speak-phones { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-bottom: 18px; }
.phone-pill { border: 1px solid #c6d0d8; border-radius: 999px; padding: 14px 26px; font-size: 15px; color: var(--navy); }
.speak-email { font-size: 14px; color: var(--ink-soft); }
.speak-email a { color: var(--navy); text-decoration: underline; }

/* ---- GET INSPIRED (water band, shared .post cards) ---- */
.inspired { background: var(--water); padding: 76px 0 90px; text-align: center; }
.inspired .serif-title { margin-bottom: 14px; }
.inspired .insp-sub { color: var(--ink-soft); font-size: 17px; margin-bottom: 24px; }
.inspired .pill-navy { margin-bottom: 48px; }
.inspired .post-grid { text-align: left; }

@media (max-width: 900px) {
  .art-head h1 { font-size: 48px; line-height: 56px; }
  .art-text { max-width: 100%; }
  .art-row.cols-2, .art-row.cols-3 { grid-template-columns: 1fr; }
  .cruise-item { grid-template-columns: 1fr; gap: 20px; }
}