diff --git a/src/app/globals.css b/src/app/globals.css
index 8d34461..58ceb9c 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -33,225 +33,275 @@
   font-display: swap;
 }
 
-:root {
-  --bg-cream: #faf8f5;
-  --bg-dark: #1a1a1a;
-  --bg-darker: #0f0f0f;
-  --text-dark: #2d2d2d;
-  --text-light: #f5f5f5;
-  --text-muted: #6b6b6b;
-  --accent-gold: #c9a962;
-  --accent-lavender: #d4c4e8;
-  --accent-pink: #e8c4d4;
-  --accent-mint: #c4e8d4;
-  --accent-rose: #e8d4c4;
-}
+/* Base reset & defaults — in @layer base so Tailwind utilities can override */
+@layer base {
+  :root {
+    --bg-cream: #faf8f5;
+    --bg-dark: #1a1a1a;
+    --bg-darker: #0f0f0f;
+    --text-dark: #2d2d2d;
+    --text-light: #f5f5f5;
+    --text-muted: #6b6b6b;
+    --accent-gold: #c9a962;
+    --accent-lavender: #d4c4e8;
+    --accent-pink: #e8c4d4;
+    --accent-mint: #c4e8d4;
+    --accent-rose: #e8d4c4;
+  }
 
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
+  * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+  }
 
-html {
-  scroll-behavior: smooth;
-}
+  html {
+    scroll-behavior: smooth;
+  }
 
-body {
-  background: var(--bg-cream);
-  color: var(--text-dark);
-  font-family: var(--font-cormorant), 'Cormorant Garamond', Georgia, serif;
-  line-height: 1.8;
-}
+  body {
+    background: var(--bg-cream);
+    color: var(--text-dark);
+    font-family: var(--font-cormorant), 'Cormorant Garamond', Georgia, serif;
+    line-height: 1.8;
+  }
 
-/* Typography */
-h1, h2, h3, h4 {
-  font-family: var(--font-cormorant), 'Cormorant Garamond', Georgia, serif;
-  font-weight: 300;
-  letter-spacing: 0.05em;
-}
-
-.font-sans-alt {
-  font-family: var(--font-montserrat), 'Montserrat', sans-serif;
-}
-
-/* Navigation */
-.nav-link {
-  font-family: var(--font-montserrat), 'Montserrat', sans-serif;
-  font-size: 0.75rem;
-  letter-spacing: 0.15em;
-  text-transform: uppercase;
-  text-decoration: none;
-  color: var(--text-dark);
-  transition: color 0.3s ease;
-  padding: 0.5rem 1rem;
-}
-
-.nav-link:hover {
-  color: var(--accent-gold);
-}
-
-/* Elegant button styles */
-.btn-outline {
-  display: inline-block;
-  padding: 0.875rem 2rem;
-  border: 1px solid var(--text-dark);
-  border-radius: 50px;
-  font-family: var(--font-montserrat), 'Montserrat', sans-serif;
-  font-size: 0.7rem;
-  letter-spacing: 0.2em;
-  text-transform: uppercase;
-  text-decoration: none;
-  color: var(--text-dark);
-  transition: all 0.3s ease;
-  background: transparent;
-  cursor: pointer;
-}
-
-.btn-outline:hover {
-  background: var(--text-dark);
-  color: var(--bg-cream);
-}
-
-.btn-outline-light {
-  border-color: var(--text-light);
-  color: var(--text-light);
-}
-
-.btn-outline-light:hover {
-  background: var(--text-light);
-  color: var(--bg-dark);
-}
-
-.btn-filled {
-  display: inline-block;
-  padding: 0.875rem 2rem;
-  background: var(--text-dark);
-  border: 1px solid var(--text-dark);
-  border-radius: 50px;
-  font-family: var(--font-montserrat), 'Montserrat', sans-serif;
-  font-size: 0.7rem;
-  letter-spacing: 0.2em;
-  text-transform: uppercase;
-  text-decoration: none;
-  color: var(--bg-cream);
-  transition: all 0.3s ease;
-  cursor: pointer;
-}
-
-.btn-filled:hover {
-  background: transparent;
-  color: var(--text-dark);
-}
-
-/* Service cards */
-.service-card {
-  padding: 3rem 2rem;
-  border-radius: 1rem;
-  text-align: center;
-  transition: transform 0.3s ease, box-shadow 0.3s ease;
-  background: white;
-}
-
-.service-card:hover {
-  transform: translateY(-5px);
-  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
-}
-
-.service-card.lavender { background: var(--accent-lavender); }
-.service-card.pink { background: var(--accent-pink); }
-.service-card.mint { background: var(--accent-mint); }
-.service-card.rose { background: var(--accent-rose); }
-
-/* Section spacing */
-.section {
-  padding: 6rem 2rem;
-}
-
-@media (min-width: 768px) {
-  .section {
-    padding: 8rem 4rem;
+  h1, h2, h3, h4 {
+    font-family: var(--font-cormorant), 'Cormorant Garamond', Georgia, serif;
+    font-weight: 300;
+    letter-spacing: 0.05em;
   }
 }
 
-/* Decorative elements */
-.divider {
-  width: 60px;
-  height: 1px;
-  background: var(--accent-gold);
-  margin: 2rem auto;
+/* Component styles — in @layer components so Tailwind utilities can override */
+@layer components {
+  .font-sans-alt {
+    font-family: var(--font-montserrat), 'Montserrat', sans-serif;
+  }
+
+  /* Navigation */
+  .nav-link {
+    font-family: var(--font-montserrat), 'Montserrat', sans-serif;
+    font-size: 0.75rem;
+    letter-spacing: 0.15em;
+    text-transform: uppercase;
+    text-decoration: none;
+    color: var(--text-dark);
+    transition: color 0.3s ease;
+    padding: 0.5rem 1rem;
+  }
+
+  .nav-link:hover {
+    color: var(--accent-gold);
+  }
+
+  /* Elegant button styles */
+  .btn-outline {
+    display: inline-block;
+    padding: 0.875rem 2rem;
+    border: 1px solid var(--text-dark);
+    border-radius: 50px;
+    font-family: var(--font-montserrat), 'Montserrat', sans-serif;
+    font-size: 0.7rem;
+    letter-spacing: 0.2em;
+    text-transform: uppercase;
+    text-decoration: none;
+    color: var(--text-dark);
+    transition: all 0.3s ease;
+    background: transparent;
+    cursor: pointer;
+  }
+
+  .btn-outline:hover {
+    background: var(--text-dark);
+    color: var(--bg-cream);
+  }
+
+  .btn-outline-light {
+    border-color: var(--text-light);
+    color: var(--text-light);
+  }
+
+  .btn-outline-light:hover {
+    background: var(--text-light);
+    color: var(--bg-dark);
+  }
+
+  .btn-filled {
+    display: inline-block;
+    padding: 0.875rem 2rem;
+    background: var(--text-dark);
+    border: 1px solid var(--text-dark);
+    border-radius: 50px;
+    font-family: var(--font-montserrat), 'Montserrat', sans-serif;
+    font-size: 0.7rem;
+    letter-spacing: 0.2em;
+    text-transform: uppercase;
+    text-decoration: none;
+    color: var(--bg-cream);
+    transition: all 0.3s ease;
+    cursor: pointer;
+  }
+
+  .btn-filled:hover {
+    background: transparent;
+    color: var(--text-dark);
+  }
+
+  /* Service cards */
+  .service-card {
+    padding: 3rem 2rem;
+    border-radius: 1rem;
+    text-align: center;
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+    background: white;
+  }
+
+  .service-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
+  }
+
+  .service-card.lavender { background: var(--accent-lavender); }
+  .service-card.pink { background: var(--accent-pink); }
+  .service-card.mint { background: var(--accent-mint); }
+  .service-card.rose { background: var(--accent-rose); }
+
+  /* Section spacing */
+  .section {
+    padding: 6rem 2rem;
+  }
+
+  @media (min-width: 768px) {
+    .section {
+      padding: 8rem 4rem;
+    }
+  }
+
+  /* Decorative elements */
+  .divider {
+    width: 60px;
+    height: 1px;
+    background: var(--accent-gold);
+    margin: 2rem auto;
+  }
+
+  .divider-wide {
+    width: 120px;
+  }
+
+  /* Image placeholder */
+  .img-placeholder {
+    background: linear-gradient(135deg, var(--accent-lavender) 0%, var(--accent-pink) 100%);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--text-dark);
+    font-size: 0.75rem;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+  }
+
+  /* Testimonial */
+  .testimonial {
+    font-style: italic;
+    font-size: 1.125rem;
+    max-width: 600px;
+    margin: 0 auto;
+    text-align: center;
+  }
+
+  .testimonial-card {
+    background: white;
+    padding: 2.5rem;
+    border-radius: 1rem;
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
+    text-align: center;
+  }
+
+  /* Footer */
+  .footer-link {
+    font-family: var(--font-montserrat), 'Montserrat', sans-serif;
+    font-size: 0.75rem;
+    letter-spacing: 0.1em;
+    color: var(--text-light);
+    text-decoration: none;
+    opacity: 0.7;
+    transition: opacity 0.3s;
+  }
+
+  .footer-link:hover {
+    opacity: 1;
+  }
+
+  /* Hero section */
+  .hero-gradient {
+    background: linear-gradient(
+      180deg,
+      var(--bg-cream) 0%,
+      rgba(212, 196, 232, 0.2) 50%,
+      var(--bg-cream) 100%
+    );
+  }
+
+  /* Dark sections */
+  .dark-section {
+    background: var(--bg-dark);
+    color: var(--text-light);
+  }
+
+  .darker-section {
+    background: var(--bg-darker);
+    color: var(--text-light);
+  }
+
+  /* Quote styling */
+  .quote-mark {
+    font-size: 4rem;
+    line-height: 1;
+    color: var(--accent-gold);
+    opacity: 0.5;
+  }
+
+  /* Glassmorphism effect */
+  .glass {
+    background: rgba(255, 255, 255, 0.7);
+    backdrop-filter: blur(10px);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+  }
+
+  /* Mobile menu */
+  .mobile-menu {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: var(--bg-cream);
+    z-index: 100;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 2rem;
+  }
+
+  /* Event cards */
+  .event-card {
+    background: rgba(255, 255, 255, 0.05);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: 1rem;
+    padding: 2rem;
+    transition: all 0.3s ease;
+  }
+
+  .event-card:hover {
+    background: rgba(255, 255, 255, 0.08);
+    border-color: var(--accent-gold);
+  }
 }
 
-.divider-wide {
-  width: 120px;
-}
-
-/* Image placeholder */
-.img-placeholder {
-  background: linear-gradient(135deg, var(--accent-lavender) 0%, var(--accent-pink) 100%);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--text-dark);
-  font-size: 0.75rem;
-  letter-spacing: 0.1em;
-  text-transform: uppercase;
-}
-
-/* Testimonial */
-.testimonial {
-  font-style: italic;
-  font-size: 1.125rem;
-  max-width: 600px;
-  margin: 0 auto;
-  text-align: center;
-}
-
-.testimonial-card {
-  background: white;
-  padding: 2.5rem;
-  border-radius: 1rem;
-  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
-  text-align: center;
-}
-
-/* Footer */
-.footer-link {
-  font-family: var(--font-montserrat), 'Montserrat', sans-serif;
-  font-size: 0.75rem;
-  letter-spacing: 0.1em;
-  color: var(--text-light);
-  text-decoration: none;
-  opacity: 0.7;
-  transition: opacity 0.3s;
-}
-
-.footer-link:hover {
-  opacity: 1;
-}
-
-/* Hero section */
-.hero-gradient {
-  background: linear-gradient(
-    180deg,
-    var(--bg-cream) 0%,
-    rgba(212, 196, 232, 0.2) 50%,
-    var(--bg-cream) 100%
-  );
-}
-
-/* Dark sections */
-.dark-section {
-  background: var(--bg-dark);
-  color: var(--text-light);
-}
-
-.darker-section {
-  background: var(--bg-darker);
-  color: var(--text-light);
-}
-
-/* Animations */
+/* Animations — keep unlayered so they always apply */
 @keyframes fadeIn {
   from { opacity: 0; transform: translateY(20px); }
   to { opacity: 1; transform: translateY(0); }
@@ -275,48 +325,3 @@ h1, h2, h3, h4 {
 .stagger-2 { animation-delay: 0.2s; }
 .stagger-3 { animation-delay: 0.3s; }
 .stagger-4 { animation-delay: 0.4s; }
-
-/* Quote styling */
-.quote-mark {
-  font-size: 4rem;
-  line-height: 1;
-  color: var(--accent-gold);
-  opacity: 0.5;
-}
-
-/* Glassmorphism effect */
-.glass {
-  background: rgba(255, 255, 255, 0.7);
-  backdrop-filter: blur(10px);
-  border: 1px solid rgba(255, 255, 255, 0.3);
-}
-
-/* Mobile menu */
-.mobile-menu {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: var(--bg-cream);
-  z-index: 100;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 2rem;
-}
-
-/* Event cards */
-.event-card {
-  background: rgba(255, 255, 255, 0.05);
-  border: 1px solid rgba(255, 255, 255, 0.1);
-  border-radius: 1rem;
-  padding: 2rem;
-  transition: all 0.3s ease;
-}
-
-.event-card:hover {
-  background: rgba(255, 255, 255, 0.08);
-  border-color: var(--accent-gold);
-}