/* Zweck: regionale Philippinen-Inhalte und Attraktionskarten | Schicht: Seitentyp | Ladende Seiten: DE/EN-Regions- und Provinzseiten */

.philippines-attractions {
  margin-top: 1.6rem;
}

.philippines-attraction-list {
  display: grid;
  gap: 1.25rem;
}

.philippines-attraction {
  display: grid;
  grid-template-columns: minmax(230px, .86fr) minmax(0, 1.14fr);
  gap: 1rem;
  align-items: stretch;
  min-width: 0;
  padding: 1rem;
  border: 1px solid rgba(0, 112, 118, .18);
  border-radius: 8px;
  background: rgba(255, 255, 255, .78);
}

.philippines-attraction--image-right .philippines-attraction__media {
  order: 2;
}

.philippines-attraction--image-right .philippines-attraction__copy {
  order: 1;
}

.philippines-attraction__media {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
}

.philippines-attraction__media img,
.philippines-attraction__placeholder {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  border: 1px solid rgba(0, 112, 118, .16);
  border-radius: 8px;
  object-fit: cover;
  background: #eef6f4;
}

.philippines-attraction__placeholder {
  display: grid;
  place-items: center;
  align-content: center;
  gap: .25rem;
  padding: 1rem;
  color: var(--book-muted);
  font-family: var(--book-sans);
  text-align: center;
}

.philippines-attraction__placeholder span {
  color: var(--book-accent);
  font-weight: 850;
}

.philippines-attraction__placeholder small {
  font-size: .76rem;
  line-height: 1.25;
}

.philippines-attraction__copy {
  min-width: 0;
}

.philippines-attraction__copy h3 {
  margin: .2rem 0 .5rem;
  font-size: 1.12rem;
}

.philippines-attraction__copy p {
  margin: .55rem 0;
}

.philippines-attraction__status {
  padding-top: .5rem;
  border-top: 1px solid rgba(0, 112, 118, .12);
  color: var(--book-muted);
  font-family: var(--book-sans);
  font-size: .78rem;
  line-height: 1.4;
}

.philippines-attraction-outro {
  margin-top: 1.25rem;
  padding: 1rem;
  border: 1px solid rgba(0, 112, 118, .18);
  border-radius: 8px;
  background: rgba(247, 251, 250, .88);
}

.philippines-image-credits {
  margin-top: 1rem;
  padding-top: .75rem;
  border-top: 1px solid rgba(0, 112, 118, .12);
  font-size: .78rem;
  line-height: 1.45;
}

.philippines-image-credits h3 {
  margin: 0 0 .5rem;
  color: var(--book-muted);
  font-family: var(--book-sans);
  font-size: .82rem;
}

@media (max-width: 760px) {
  .philippines-attraction {
    grid-template-columns: 1fr;
  }

  .philippines-attraction--image-right .philippines-attraction__media,
  .philippines-attraction--image-right .philippines-attraction__copy {
    order: initial;
  }
}

html[data-theme="dark"] .philippines-attraction,
html[data-theme="dark"] .philippines-attraction-outro {
  background: var(--amg-paper);
  border-color: var(--amg-line);
  color: var(--amg-ink);
}

html[data-theme="dark"] .philippines-attraction__placeholder {
  background: var(--amg-mint-soft);
  border-color: var(--amg-line);
  color: var(--amg-muted);
}

html[data-theme="dark"] .philippines-attraction__placeholder span {
  color: var(--amg-ink);
}