/* LACEY INTERIORS - CORE STYLESHEET */

/* Google Fonts Imports */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600;1,700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600;1,700&family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap');

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

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: #FAF8F5;
  color: #171717;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, .font-editorial {
  font-family: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
}

/* One progressive-enhancement reveal state, overriding page utility transitions. */
.reveal-on-scroll, .js-reveal, .gallery-reveal {
  transition-property: opacity, transform !important;
  transition-duration: 1100ms !important;
  transition-timing-function: cubic-bezier(.22, 1, .36, 1) !important;
}
.reveal-pending { opacity: 0 !important; transform: translateY(24px) !important; }
.reveal-on-scroll.is-revealed, .js-reveal.is-revealed, .gallery-reveal.is-visible {
  opacity: 1; transform: translateY(0);
}

/* Delays */
.delay-75 { transition-delay: 75ms; }
.delay-100 { transition-delay: 120ms; }
.delay-150 { transition-delay: 180ms; }
.delay-200 { transition-delay: 240ms; }
.delay-300 { transition-delay: 360ms; }
.delay-400 { transition-delay: 480ms; }

/* Desktop Navigation Expanding Underline */
.nav-link {
  position: relative;
}

.nav-link::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0%;
  height: 1px;
  background-color: #C59B5F;
  transition: width 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.nav-link:hover::after,
.nav-link[aria-current="page"]::after {
  width: 100%;
}

/* Service Circular Item Hover & Mobile Active Ring */
.service-circle-wrap {
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
}

.service-circle-wrap:hover {
  box-shadow: 0 16px 32px -8px rgba(184, 147, 94, 0.22);
  border-color: #C59B5F;
  background-color: #EDE7DC;
}

.service-item-active .service-circle-wrap {
  border-color: #C87A1E !important;
  box-shadow: 0 0 0 3px rgba(200, 122, 30, 0.25), 0 12px 24px -4px rgba(200, 122, 30, 0.3) !important;
  transform: translateY(-4px) scale(1.03);
}

.service-item-active .service-label {
  color: #C87A1E !important;
  font-weight: 600 !important;
}

/* Cinematic Hero Dark Gradient Overlay */
.hero-cinematic-overlay {
  background: linear-gradient(to right, rgba(17,17,17,0.88) 0%, rgba(17,17,17,0.65) 55%, rgba(17,17,17,0.32) 100%),
              linear-gradient(to top, rgba(17,17,17,0.85) 0%, transparent 40%);
}

/* Bespoke 2-Line Hamburger Menu Morph */
.menu-line-top,
.menu-line-bottom {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), width 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease;
  transform-origin: center;
}

.is-menu-open .menu-line-top {
  transform: translateY(4px) rotate(45deg);
  width: 24px !important;
}

.is-menu-open .menu-line-bottom {
  transform: translateY(-4px) rotate(-45deg);
  width: 24px !important;
}

/* FAQ Accordion Transitions */
.faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.faq-content.is-open {
  max-height: 800px;
}

/* Reduced Motion Overrides */
@media (prefers-reduced-motion: reduce) {
  .reveal-on-scroll,
  .js-reveal,
  .gallery-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  * {
    transition-duration: 0.001s !important;
    animation-duration: 0.001s !important;
  }
}

/* The Media Walls export toggles display instead of animating max-height. */
[data-faq-local] .faq-content {
  max-height: none;
}

.faq-heading { text-align: center; margin-left: auto; margin-right: auto; }
.faq-heading > .flex { justify-content: center; }
.testimonial-stage { height: 30rem; align-items: flex-start; }
.testimonial-quote { max-height: 24rem; overflow-y: auto; white-space: pre-line; scrollbar-width: thin; padding: 0 4px; }
.testimonial-pause { font-size: 11px; color: #78654b; padding: 8px; }
.testimonial-stage + div { flex-wrap: wrap; }
@media (min-width: 768px) { .testimonial-stage { height: 29rem; } }
@media (prefers-reduced-motion: reduce) {
  .reveal-on-scroll, .js-reveal, .gallery-reveal { transition: none !important; }
}
header .group:focus-within > div { opacity: 1; pointer-events: auto; }