/* ============================================================
   campaign.css — /lp/ campaign landing page ("The New Era of Exploration").
   Chrome/type/two-col/content/form come from /site.css. New here: anchor tabs,
   navy story bands, destination carousel row, partner/voyage/expert card grids,
   quote card, logo rows, and the navy enquiry form treatment.
   ============================================================ */

.cp-hero { height: 982px; }

/* ---- anchor tabs under the hero ---- */
.cp-tabs {
  display: flex; justify-content: center; gap: 40px;
  padding: 26px 0 0; border-bottom: 1px solid #e6e6e6;
}
.cp-tabs a {
  font-size: 16px; letter-spacing: -0.02em; color: var(--ink);
  padding-bottom: 14px; border-bottom: 2px solid transparent;
}
.cp-tabs a.is-active { border-bottom-color: var(--navy); font-weight: 500; }

/* the campaign runs the shared logo strip directly under the tabs */
.cp-tabs + .logos { padding: 56px 0 44px; }

/* ---- recurring centred section head (serif + 24px sub + small intro) ---- */
.cp-head { text-align: center; }
.cp-head .serif-title { margin-bottom: 18px; }
.cp-sub {
  font-size: 24px; line-height: 30px; letter-spacing: -0.03em;
  color: var(--ink); margin-bottom: 18px;
}
.cp-intro { font-size: 15px; line-height: 23px; color: var(--ink-soft); max-width: 1220px; margin: 0 auto 44px; }

/* ---- A New Era of Travel ---- */
.cp-newera { padding: 146px 0 126px; }
.cp-newera .two-col { max-width: 1232px; margin: 0 auto; gap: 40px; }
.cp-newera .media img { aspect-ratio: 596 / 745; }
.cp-h2-left { margin-bottom: 34px; }
.cp-lead-bold { font-weight: 700; color: var(--ink); margin-bottom: 26px; }
.cp-newera .content { padding-top: 90px; }

/* ---- navy story bands (Collection / Guide / Is This For You) ---- */
.cp-collection, .cp-guide, .cp-isthis { padding: 68px 0; color: var(--white); }
.cp-collection { padding-bottom: 44px; }
.cp-band-text .serif-title { color: #c9d6e2; font-size: 56px; line-height: 66px; margin-bottom: 26px; }
.cp-band-text h3 { font-size: 24px; line-height: 32px; font-weight: 500; letter-spacing: -0.03em; margin-bottom: 20px; }
.cp-band-text p { font-size: 15px; line-height: 23px; color: rgba(255,255,255,.92); margin-bottom: 28px; max-width: 560px; }
.cp-collection-grid, .cp-guide-grid, .cp-isthis-grid { max-width: 1232px; margin: 0 auto; gap: 40px; align-items: center; }
.cp-collection .media img { aspect-ratio: 596 / 540; }
.cp-isthis .media img { aspect-ratio: 572 / 500; }
.cp-guide .media img { aspect-ratio: 572 / 500; }

.pill-white {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 16px; font-weight: 500; letter-spacing: -0.03em;
  border-radius: 999px; padding: 13px 28px; white-space: nowrap;
  background: var(--white); color: var(--navy);
}

/* ---- Where Will You Go ---- */
.cp-where { padding: 100px 0 96px; }
.cp-where-sub { font-size: 24px; line-height: 34px; letter-spacing: -0.03em; color: var(--ink); max-width: 1160px; margin: 0 auto 30px; }
.cp-dots { display: flex; justify-content: center; gap: 12px; margin-bottom: 34px; }
.cp-dots span { width: 12px; height: 12px; border-radius: 999px; border: 1.5px solid var(--teal); }
.cp-dots span.on { background: var(--teal); }
.cp-dest-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; max-width: 1232px; margin: 0 auto; }
.cp-dest-grid img { width: 100%; aspect-ratio: 384 / 258; object-fit: cover; }
.cp-carousel-ctrls { display: flex; justify-content: center; gap: 20px; margin-top: 42px; }
.cp-carousel-ctrls img { width: 36px; height: 36px; display: block; }

/* ---- Featured Expedition Partners ---- */
.cp-partners { padding: 40px 0 90px; }
.cp-partner-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 44px; max-width: 1232px; margin: 0 auto; text-align: center; }
.cp-plogo { height: 88px; display: flex; align-items: center; justify-content: center; margin-bottom: 26px; }
.cp-plogo img { max-height: 88px; max-width: 100%; object-fit: contain; }
.cp-ptag { font-size: 15px; font-weight: 600; color: var(--ink); margin-bottom: 12px; }
.cp-ptitle { font-size: 19px; line-height: 27px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 14px; }
.cp-pdesc { font-size: 15px; line-height: 24px; color: var(--ink-soft); margin-bottom: 22px; }
.cp-offer-tag { font-size: 14px; font-weight: 600; letter-spacing: .02em; color: var(--woodfire); margin-bottom: 10px; }
.cp-offer { font-size: 17px; line-height: 28px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink); }
.cp-partners .posts-more { padding-top: 64px; }

/* ---- Featured Voyages / Norway ---- */
.cp-voyages { padding: 84px 0 40px; }
.cp-norway { padding: 60px 0 40px; }
.cp-voyage-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; max-width: 1232px; margin: 0 auto; }
.cp-voyage img { width: 100%; aspect-ratio: 384 / 252; object-fit: cover; display: block; }
.cp-vbody { background: var(--water); padding: 28px 24px 34px; text-align: center; }
.cp-vbrand { font-size: 15px; color: var(--ink); margin-bottom: 10px; }
.cp-vtitle { font-size: 19px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 8px; }
.cp-vdate { font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 14px; }
.cp-vdesc { font-size: 15px; line-height: 24px; color: var(--ink-soft); margin-bottom: 20px; }
.cp-voyage .cp-offer { font-size: 16px; line-height: 27px; margin-bottom: 22px; }
.cp-voyages .posts-more { padding-top: 40px; }

/* ---- Is This For You ---- */
.cp-quoteline { font-weight: 700; font-size: 16px; line-height: 24px; color: var(--white); margin-bottom: 22px; max-width: 620px; }

/* ---- Your Exploration Specialists ---- */
.cp-experts { padding: 100px 0 90px; }
.cp-expert-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 44px; max-width: 1232px; margin: 0 auto; }
.cp-ename { font-size: 17px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 6px; }
.cp-eyears { font-size: 15px; color: var(--ink-soft); margin-bottom: 16px; }
.cp-expert img { width: 100%; aspect-ratio: 278 / 172; object-fit: cover; margin-bottom: 18px; }
.cp-emeta { display: grid; grid-template-columns: 96px 1fr; gap: 10px 12px; font-size: 12px; line-height: 17px; }
.cp-emeta .k { color: var(--ink); }
.cp-emeta .v { font-weight: 700; color: var(--ink); }

/* ---- What Travellers Say ---- */
.cp-say { padding: 40px 0 90px; }
.cp-say .two-col { max-width: 1232px; margin: 0 auto; gap: 40px; align-items: center; }
.cp-say .media img { aspect-ratio: 596 / 604; }
.cp-say-right .serif-title { text-align: center; font-size: 56px; line-height: 68px; margin-bottom: 48px; }
.cp-quote-row { display: flex; align-items: center; gap: 18px; }
.cp-qarrow { flex: none; }
.cp-qarrow img { width: 36px; height: 36px; display: block; }
.cp-quote { background: var(--sand); border-radius: 24px; padding: 34px 40px; }
.cp-quote p { font-size: 16px; line-height: 24px; color: var(--ink); margin-bottom: 22px; }
.cp-quote footer { font-size: 15px; font-weight: 700; color: var(--ink); }

/* ---- Why Travellers Choose Us ---- */
.cp-why { padding: 60px 0 100px; }
.cp-why-intro { max-width: 1220px; }
.cp-why-logos {
  display: flex; align-items: center; justify-content: space-between; gap: 40px;
  max-width: 1340px; margin: 24px auto 0;
}
.cp-why-logos img { height: 96px; width: auto; object-fit: contain; }

/* ---- Start Your Journey (navy enquiry form) ---- */
.cp-enquire { padding: 96px 0 110px; color: var(--white); }
.cp-enquire .serif-title { color: #c9d6e2; }
.cp-enquire .cp-sub { color: var(--white); }
.cp-enquire .cp-intro { color: rgba(255,255,255,.88); margin-bottom: 56px; }
.cp-form { max-width: 806px; margin: 0 auto; }
.cp-form .field label { color: var(--white); }

@media (max-width: 900px) {
  .cp-hero { height: 640px; }
  .cp-tabs { gap: 18px; flex-wrap: wrap; padding-top: 18px; }
  .cp-newera { padding: 64px 0 70px; }
  .cp-newera .content { padding-top: 0; }
  .cp-band-text .serif-title { font-size: 40px; line-height: 48px; }
  .cp-dest-grid, .cp-voyage-grid { grid-template-columns: 1fr; max-width: 480px; }
  .cp-partner-grid, .cp-expert-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .cp-say-right .serif-title { font-size: 40px; line-height: 48px; }
  .cp-quote-row { flex-direction: column; }
  .cp-why-logos { flex-wrap: wrap; justify-content: center; }
  .cp-why-logos img { height: 64px; }
}
@media (max-width: 560px) {
  .cp-partner-grid, .cp-expert-grid { grid-template-columns: 1fr; }
}

/* the navy pill sits on a water-coloured card — its water sweep would dissolve
   into the background, so a navy ring keeps the edge (outline: no layout shift,
   paints above the sweep panel; colour arrives timed to the panel) */
.cp-vbody .pill-navy {
  outline: 1.5px solid transparent; outline-offset: -1.5px;
  transition: background .3s ease, color .35s ease, border-color .3s ease,
              box-shadow .35s ease, opacity .2s ease, outline-color .25s ease .15s;
}
.cp-vbody .pill-navy:hover { outline-color: var(--navy); }
