/* ==========================================================================
   Raja Ampat Diving — foto tambahan: kartu, section teks, latar kepala halaman & CTA
   Markup disisipkan oleh inc/content-structure.php + inc/content-images.php.
   ========================================================================== */

/* ---------- foto di kartu .why ---------- */
.bcht-swiper--why .swiper-slide.has-img { padding: 0 0 22px; }
.bcht-swiper--why .swiper-slide.has-img > :not(.card-img) { margin-inline: 22px; }
.card-img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; margin: 0 0 16px; }
/* kartu yang sudah punya foto tidak menampilkan ikon emoji */
.bcht-swiper--why .has-img .ic { display: none; }

/* ---------- section teks + foto ---------- */
.bcht-media { display: grid; gap: 24px; align-items: center; }
.bcht-media__text > :last-child { margin-bottom: 0; }
.bcht-media__text > h2::after { content: ""; display: block; width: 44px; height: 3px; margin-top: 14px; background: var(--gold); border-radius: 2px; }
.bcht-media__fig { margin: 0; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); background: var(--cream); }
.bcht-media__fig img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
@media (min-width: 900px) {
  .bcht-media { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 64px); }
  .bcht-media__fig img { aspect-ratio: 4 / 3; }
  .bcht-section--alt .bcht-media__fig { order: -1; }
}

/* ---------- latar foto: kepala halaman & CTA ---------- */
.bcht-pagehead.has-bg, .cta-block.has-bg { position: relative; overflow: hidden; isolation: isolate; }
.bcht-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.bcht-pagehead.has-bg::before, .cta-block.has-bg::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.bcht-pagehead.has-bg::before { background: rgba(11, 34, 57, 0.8); }
@media (min-width: 900px) {
  .bcht-pagehead.has-bg::before { background: linear-gradient(90deg, rgba(11, 34, 57, 0.94) 0%, rgba(11, 34, 57, 0.8) 55%, rgba(11, 34, 57, 0.5) 100%); }
}
.cta-block.has-bg::before { background: linear-gradient(180deg, rgba(11, 34, 57, 0.7) 0%, rgba(11, 34, 57, 0.88) 100%); }