/* =========================================
   NEARBY ATTRACTIONS PAGE — Styles
   ========================================= */

/* --- Attraction Items --- */
.attraction-item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-3xl);
  align-items: center;
  padding: var(--sp-3xl) 0;
  border-bottom: 1px solid var(--c-border-light);
}

.attraction-item:last-child {
  border-bottom: none;
}

/* Alternate layout — image on right */
.attraction-item-reverse {
  direction: rtl;
}

.attraction-item-reverse > * {
  direction: ltr;
}

.attraction-img {
  width: 100%;
  height: 300px;
}

.attraction-content h2 {
  font-size: var(--fs-2xl);
  margin-bottom: var(--sp-md);
}

.attraction-content p {
  font-size: var(--fs-md);
  line-height: 1.8;
}

/* =========================================
   RESPONSIVE
   ========================================= */
@media (max-width: 1024px) {
  .attraction-item {
    gap: var(--sp-xl);
  }

  .attraction-img {
    height: 250px;
  }
}

@media (max-width: 768px) {
  .attraction-item,
  .attraction-item-reverse {
    grid-template-columns: 1fr;
    direction: ltr;
    gap: var(--sp-lg);
    padding: var(--sp-xl) 0;
  }

  .attraction-img {
    height: 220px;
  }

  .attraction-content h2 {
    font-size: var(--fs-xl);
  }
}