.attraction {
 position: relative;
 width: 100%;
 padding: 120px 0 20px 0;
 background-color: #fff;
}

.attraction .container {
 max-width: 1440px;
 margin: 0 auto;
 padding: 0 24px;
}

.attraction-content {
 display: flex;
 flex-direction: column;
 gap: 34px;
}

.attraction-header {
 display: flex;
 flex-direction: column;
}

.attraction-number {
 font-family: "Playfair Display", serif;
 font-size: 36px;
 font-weight: 400;
 font-style: italic;
 line-height: 1.33;
 color: #2d363d;
}

.attraction-title {
 font-family: "Playfair Display", serif;
 font-size: 60px;
 font-weight: 400;
 line-height: 1.1;
 color: #2d363d;
 margin: 0;
}

.attraction-subtitle {
 font-family: "Raleway", sans-serif;
 font-size: 28px;
 font-weight: 400;
 line-height: 1.33;
 color: #2d363d;

 i {
  font-style: italic;
  font-family: "Playfair Display", serif;
 }
}

.attraction-text {
 display: flex;
 flex-direction: column;
 gap: 24px;
 margin-top: 24px;
}

.attraction-text p {
 font-family: "Raleway", sans-serif;
 font-size: 16px;
 font-weight: 400;
 line-height: 1.5;
 color: #292b33;
}

.attraction-text p:first-child {
 font-size: 20px;
 line-height: 1.3;
}

.attraction-text-1 {
 margin-top: 24px;
 font-size: 16px;

 font-weight: 400;
 line-height: 1.33;
}

.attraction-text-2 {
 margin-top: 32px;
 font-size: 36px;
 font-family: "Playfair Display", serif;
 font-weight: 400;
 line-height: 1.33;
}
.attraction-images {
 position: relative;
 width: 225px;
 height: 530px;
 margin: 0 auto;
}

.attraction-image {
 width: 100%;
 height: 100%;
 display: block;
 position: relative;
 z-index: 3;
 object-fit: cover;
}

.purple {
 font-weight: 700;
 color: #8d8cc4;
}
.attraction-texture {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 /* Image not found in assets, commenting out to avoid 404 errors */
 /* background-image: url("../../../assets/images/texture-1.png"); */
 background-repeat: repeat;
 opacity: 0.1;
 z-index: 4;
}

.desktop {
 display: none;
}

.mobile {
 display: block;
}
/* Desktop styles */
@media (min-width: 1024px) {
 .mobile {
  display: none;
 }
 .desktop {
  display: block;
 }
 .attraction {
  padding: 180px 0 0 0;
 }

 .attraction-text-content {
  display: flex;
  flex-direction: column;
  gap: 50px;
 }

 .attraction-content {
  flex-direction: row;
  gap: 33px;
 }

 .attraction-header {
  max-width: 633px;
 }
 .attraction-text {
  gap: 40px;
 }

 .attraction-text-2 {
  font-size: 50px !important;
 }
 .attraction-number {
  font-size: 55px;
  line-height: 0.95;
 }

 .attraction-title {
  font-size: 140px;
 }

 .attraction-subtitle {
  font-size: 35px;
 }

 .attraction-text {
  max-width: 754px;
 }

 .attraction-text-1 {
  margin-top: 113px;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.33;
 }

 .attraction-text p {
  font-size: 20px;
  line-height: 1.3;
 }

 .attraction-text p:first-child {
  font-size: 26px;
  line-height: 1.23;
 }

 .attraction-images {
  order: -1; /* Move to the left */
  margin: 0;
  width: 487px;
  height: auto;
 }

 .attraction-image {
  height: auto;
 }
}