/* Custom styles for Jasmine Floral Studio - Modern Romanticism Editorial Aesthetic */

/* Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;1,600&family=Montserrat:wght@300;400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap');

/* Base style overrides */
html {
  scroll-behavior: smooth;
}

body {
  background-color: #fdf8f8; /* background */
  color: #000000; /* primary */
  overflow-x: hidden;
  font-family: 'Montserrat', sans-serif;
}

/* Sharp geometry elements - no-radius overrides */
.no-radius,
input,
button,
textarea,
select {
  border-radius: 0px !important;
}

/* Material symbols adjustments */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
  display: inline-block;
  vertical-align: middle;
}

/* Thin editorial gold or grey dividers */
.editorial-line {
  height: 1px;
  background-color: #c4c7c7; /* outline-variant */
  width: 100%;
}

/* Countdown container boxes */
.countdown-box {
  background-color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid #c4c7c7; /* outline-variant */
  padding: 1rem;
  text-align: center;
  min-width: 80px;
}

/* Hide default scrollbars for the reviews container */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/* Sticky Header styling */
header.sticky-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background-color: rgba(253, 248, 248, 0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(196, 199, 199, 0.5);
}

/* Mobile Menu overlay animations */
#mobile-menu {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

#mobile-menu.hidden-menu {
  transform: translateX(-100%);
}

#mobile-menu.show-menu {
  transform: translateX(0);
}

/* Intersection observer fade-in and slide-up animations */
.reveal-item {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1), transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-item.active {
  opacity: 1;
  transform: translateY(0);
}