/* Integrated Spa & Wellness — Shared Styles */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Font imports */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=DM+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Pinyon+Script&display=swap');

/* Base resets */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: 'DM Sans', sans-serif;
  color: #1C1C1B;
  background: #F5F4F0;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

/* Typography */
.font-display { font-family: 'Cormorant Garamond', serif; }
.font-script { font-family: 'Pinyon Script', cursive; }
.tracking-display { letter-spacing: -0.03em; }

/* Depth layers */
.shadow-elevated {
  box-shadow: 0 4px 12px rgba(106, 96, 82, 0.08),
              0 8px 24px rgba(106, 96, 82, 0.05);
}
.shadow-floating {
  box-shadow: 0 8px 24px rgba(106, 96, 82, 0.12),
              0 16px 48px rgba(106, 96, 82, 0.08);
}

/* Interactive states — spring easing */
.interactive {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
              opacity 0.2s ease;
}
.interactive:hover { transform: translateY(-2px) scale(1.01); }
.interactive:active { transform: translateY(0) scale(0.99); }
.interactive:focus-visible {
  outline: 2px solid #6A6052;
  outline-offset: 3px;
}

/* CTA buttons */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  background: #6A6052;
  color: #FAFAF8;
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  font-size: 0.9rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  cursor: pointer;
  min-height: 48px;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
              background 0.2s ease, opacity 0.2s ease;
}
.btn-primary:hover { background: #574E43; transform: translateY(-1px); }
.btn-primary:active { transform: translateY(0); }
.btn-primary:focus-visible { outline: 2px solid #6A6052; outline-offset: 3px; }

.btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  background: transparent;
  color: #FAFAF8;
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  font-size: 0.9rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid rgba(250, 250, 248, 0.4);
  cursor: pointer;
  min-height: 48px;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
              border-color 0.2s ease, opacity 0.2s ease;
}
.btn-ghost:hover { border-color: #FAFAF8; transform: translateY(-1px); }
.btn-ghost:active { transform: translateY(0); }
.btn-ghost:focus-visible { outline: 2px solid #FAFAF8; outline-offset: 3px; }

/* Image treatment */
.img-warm {
  position: relative;
  overflow: hidden;
}
.img-warm::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(28,28,27,0.6), transparent 60%),
              rgba(106, 96, 82, 0.15);
  mix-blend-mode: multiply;
  pointer-events: none;
}

/* Mobile floating book button */
.floating-book {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 50;
  padding: 16px 40px;
  min-height: 52px;
}

/* Section spacing */
.section-pad { padding: 96px 24px; }
@media (min-width: 768px) { .section-pad { padding: 128px 48px; } }
@media (min-width: 1024px) { .section-pad { padding: 128px 64px; } }