/* Global Styles */
body {
  font-family: 'YAFdJpCEKCQ-0', sans-serif; /* Applying custom font */
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  background-color: #ffd0cd; /* Light pastel pink background */
  color: #231f20; /* Dark text color */
  overflow: hidden; /* Prevent scroll during splash screen */
  transition: overflow 0.3s ease; /* Smooth transition for overflow change */
}

/* Splash Screen Styles */
.splash-screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ffd0cd; /* Pastel pink background */
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  transition: opacity 0.5s ease;
  opacity: 1;
}

.splash-screen.hidden {
  opacity: 0;
  visibility: hidden; /* Hides the element from view */
  pointer-events: none; /* Prevents interaction */
}

/* Button Styles */
.enter-button {
  background: #231f20; /* Dark background for the button */
  color: #ffd0cd; /* Pastel pink text for the button */
  border: 2px solid #231f20; /* Dark border */
  padding: 12px 24px;
  font-size: 16px;
  font-weight: bold;
  text-transform: uppercase;
  border-radius: 25px; /* Rounded button */
  cursor: pointer;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Soft shadow */
  transition: all 0.3s ease;
}

.enter-button::before {
  content: "";
  position: absolute;
  width: 300%;
  height: 300%;
  background: rgba(255, 255, 255, 0.1); /* Subtle highlight effect */
  border-radius: 50%;
  top: -50%;
  left: -50%;
  transition: all 0.3s;
}

.enter-button:hover::before {
  top: 0;
  left: 0;
}

.enter-button:hover {
  background: #ffd0cd; /* Pastel pink background on hover */
  color: #231f20; /* Dark text on hover */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); /* Enhanced shadow on hover */
  transform: scale(1.05); /* Slight scale effect */
}

/* Main Content Styles */
.main-content {
  display: none; /* Hidden initially */
  text-align: center;
  color: #231f20; /* Dark text color */
  animation: fadeInContent 1s ease-out;
}

.main-content.show {
  display: block; /* Show main content */
}

/* Animations */
@keyframes fadeInContent {
  from { opacity: 0; }
  to { opacity: 1; }
}

button {
 position: relative;
 display: inline-block;
 cursor: pointer;
 outline: none;
 border: 0;
 vertical-align: middle;
 text-decoration: none;
 font-family: inherit;
 font-size: 15px;
}

button.book-now {
 font-weight: 600;
 color: #382b22;
 text-transform: uppercase;
 padding: 1.25em 2em;
 background: #fff0f0;
 border: 2px solid #b18597;
 border-radius: 0.75em;
 -webkit-transform-style: preserve-3d;
 transform-style: preserve-3d;
 -webkit-transition: background 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-transform 150ms cubic-bezier(0, 0, 0.58, 1);
 transition: transform 150ms cubic-bezier(0, 0, 0.58, 1), background 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-transform 150ms cubic-bezier(0, 0, 0.58, 1);
}

button.book-now::before {
 position: absolute;
 content: '';
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background: #f9c4d2;
 border-radius: inherit;
 -webkit-box-shadow: 0 0 0 2px #b18597, 0 0.625em 0 0 #ffe3e2;
 box-shadow: 0 0 0 2px #b18597, 0 0.625em 0 0 #ffe3e2;
 -webkit-transform: translate3d(0, 0.75em, -1em);
 transform: translate3d(0, 0.75em, -1em);
 transition: transform 150ms cubic-bezier(0, 0, 0.58, 1), box-shadow 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-transform 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-box-shadow 150ms cubic-bezier(0, 0, 0.58, 1);
}

button.book-now:hover {
 background: #ffe9e9;
 -webkit-transform: translate(0, 0.25em);
 transform: translate(0, 0.25em);
}

button.book-now:hover::before {
 -webkit-box-shadow: 0 0 0 2px #b18597, 0 0.5em 0 0 #ffe3e2;
 box-shadow: 0 0 0 2px #b18597, 0 0.5em 0 0 #ffe3e2;
 -webkit-transform: translate3d(0, 0.5em, -1em);
 transform: translate3d(0, 0.5em, -1em);
}

button.book-now:active {
 background: #ffe9e9;
 -webkit-transform: translate(0em, 0.75em);
 transform: translate(0em, 0.75em);
}

button.book-now:active::before {
 -webkit-box-shadow: 0 0 0 2px #b18597, 0 0 #ffe3e2;
 box-shadow: 0 0 0 2px #b18597, 0 0 #ffe3e2;
 -webkit-transform: translate3d(0, 0, -1em);
 transform: translate3d(0, 0, -1em);
}