/* ============================================================
   partners.css — PARTNERS page-specific styles.
   Shared chrome + hero + two-col + primitives in /site.css.
   ============================================================ */

.hero { height: 982px; }

/* ---- INTRO ---- */
.p-intro { padding: 92px 0 0; text-align: center; }
.p-intro .lead-p { color: var(--ink-soft); font-size: 17px; line-height: 27px; max-width: 980px; margin: 0 auto 56px; }
.p-intro-grid { gap: 56px; align-items: center; text-align: left; }
.p-intro-grid p { color: var(--ink-soft); font-size: 15px; line-height: 24px; max-width: 540px; }
.p-intro-media img { aspect-ratio: 596 / 434; object-fit: cover; }

/* ---- PARTNER SECTION (repeated: hotel / cruise / experience) ---- */
.psec { padding: 142px 0 56px; }
.psec > .container > .serif-title { text-align: center; margin-bottom: 60px; }
.psec-grid { gap: 56px; align-items: center; margin-bottom: 76px; }
.psec-media img { aspect-ratio: 596 / 540; object-fit: cover; }
.psec-cap { margin-top: 12px; font-size: 12px; line-height: 16px; letter-spacing: -0.02em; color: var(--cap); }
.psec-cap .dot { color: var(--teal); }
.psec-sub { font-family: var(--serif); font-weight: 400; font-size: 30px; line-height: 38px; letter-spacing: -0.01em; color: var(--ink); margin-bottom: 22px; max-width: 480px; }
.psec-text p { color: var(--ink-soft); font-size: 15px; line-height: 24px; max-width: 520px; }

/* logo strip */
.logo-strip { display: grid; grid-template-columns: repeat(6, 1fr); gap: 32px; align-items: center; margin-bottom: 44px; }
.logo-strip img { width: 100%; max-height: 56px; object-fit: contain; opacity: .9; }

/* perks box */
.perks { background: var(--sand); border-radius: 12px; padding: 38px 48px; margin-bottom: 60px; }
.perks-title { font-weight: 600; font-size: 15px; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 18px; }
.perks-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 48px; }
.perks-cols ul { list-style: disc; padding-left: 20px; margin: 0; }
.perks-cols li { color: var(--ink-soft); font-size: 15px; line-height: 26px; }

/* tagline + cta */
.psec-cta { text-align: center; padding-bottom: 48px; }
.psec-cta .tagline { font-family: var(--serif); font-weight: 400; font-size: 28px; line-height: 38px; letter-spacing: -0.01em; color: var(--ink); max-width: 760px; margin: 0 auto 28px; }
.psec-cta .btn-row { display: flex; gap: 14px; justify-content: center; }

/* ---- DISCOVER THE DIFFERENCE ---- */
.difference { padding: 90px 0 96px; }
.diff-grid { gap: 64px; align-items: center; }
.diff-text .serif-title { font-size: 56px; line-height: 64px; margin-bottom: 26px; }
.diff-text .d-lead { font-weight: 600; font-size: 15px; color: var(--ink); margin-bottom: 14px; }
.diff-text p { color: var(--ink-soft); font-size: 15px; line-height: 24px; margin-bottom: 18px; max-width: 540px; }
.diff-media img { aspect-ratio: 612 / 445; object-fit: cover; }
.diff-cap { margin-top: 10px; font-size: 12px; line-height: 16px; color: var(--cap); }
.diff-cap .dot { color: var(--teal); }

/* ---- RESPONSIVE ---- */
@media (max-width: 1024px) {
  .p-intro-grid, .psec-grid, .diff-grid { grid-template-columns: 1fr; gap: 32px; }
  .logo-strip { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .perks-cols { grid-template-columns: 1fr; }
}
@media (max-width: 560px) { .logo-strip { grid-template-columns: repeat(2, 1fr); } }