* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Inter", sans-serif;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Faustina", serif;
}


html {
  scroll-behavior: smooth;
}

.bg-pattern {
  background-color: #fafafa;
  background-image: linear-gradient(
      135deg,
      rgba(255, 94, 21, 0.02) 0%,
      transparent 50%
    ),
    linear-gradient(
      30deg,
      #f8f9fa 12%,
      transparent 12.5%,
      transparent 87%,
      #f8f9fa 87.5%,
      #f8f9fa
    ),
    linear-gradient(
      150deg,
      #f8f9fa 12%,
      transparent 12.5%,
      transparent 87%,
      #f8f9fa 87.5%,
      #f8f9fa
    );
  background-size: 100% 100%, 80px 140px, 80px 140px;
  background-position: 0 0, 0 0, 40px 70px;
}
.glass-button {
  position: relative;
  background: linear-gradient(
    135deg,
    rgba(255, 94, 21, 1),
    rgba(229, 77, 10, 1)
  );
  border: 1px solid rgba(255, 255, 255, 0.4);
  /* --- Changed Shadow --- */
  box-shadow: 
        /* The new clean, gray floating shadow */ 0 8px 25px
      rgba(0, 0, 0, 0.15),
    /* Kept the inner shadows for the 3D glass effect */ inset 0 2px 0 0
      rgba(255, 255, 255, 0.5),
    inset 0 -2px 0 0 rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(10px);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateY(0) scale(1);
  overflow: hidden;
}

/* This shine effect remains unchanged */
.glass-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.3),
    transparent
  );
  transition: left 0.5s;
}

.glass-button:hover::before {
  left: 100%;
}

/* Hover effect with the updated gray shadow */
.glass-button:hover {
  transform: translateY(-3px) scale(1.02);
  /* --- Changed Shadow on Hover --- */
  box-shadow: 
        /* The shadow becomes bigger and softer on hover */ 0 12px
      35px rgba(0, 0, 0, 0.2),
    /* Inner shadows get slightly stronger */ inset 0 2px 0 0
      rgba(255, 255, 255, 0.6),
    inset 0 -2px 0 0 rgba(0, 0, 0, 0.15);
}

.glass-button:active {
  transform: translateY(-1px) scale(0.98);
}

.glass-card {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.98),
    rgba(255, 255, 255, 0.95)
  );
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.08),
    inset 0 1px 0 0 rgba(255, 255, 255, 0.8);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-card:hover {
  box-shadow: 0 16px 48px 0 rgba(31, 38, 135, 0.12),
    inset 0 1px 0 0 rgba(255, 255, 255, 1), 0 0 0 1px rgba(255, 94, 21, 0.1);
}

.premium-text-gradient {
  background: linear-gradient(135deg, #ff5e15, #e54d0a, #d4af37);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.gradient-overlay {
  position: relative;
}

.gradient-overlay::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    135deg,
    rgba(255, 94, 21, 0.92),
    rgba(229, 77, 10, 0.88),
    rgba(212, 175, 55, 0.1)
  );
  z-index: 1;
}

.gradient-overlay > * {
  position: relative;
  z-index: 2;
}

.floating-animation {
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-20px);
  }
}

.shine-effect {
  position: relative;
  overflow: hidden;
}

.shine-effect::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    45deg,
    transparent 30%,
    rgba(255, 255, 255, 0.1) 50%,
    transparent 70%
  );
  transform: rotate(45deg);
  animation: shine 3s infinite;
}

@keyframes shine {
  0% {
    transform: translateX(-100%) translateY(-100%) rotate(45deg);
  }
  100% {
    transform: translateX(100%) translateY(100%) rotate(45deg);
  }
}

.luxury-border {
  position: relative;
}

.luxury-border::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 2px;
  background: linear-gradient(135deg, #ff5e15, #d4af37, #e54d0a);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.4s;
}

.luxury-border:hover::before {
  opacity: 1;
}

.premium-shadow {
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1),
    0 10px 30px rgba(255, 94, 21, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.pulse-dot {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
.faq-answer {
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s ease-out;
}
.faq-answer.active {
  grid-template-rows: 1fr;
}
.faq-answer > div {
  overflow: hidden;
}