/*
=========================================
  L'Amour Luxury Weddings
  Material Design 3 (Material You) — v2.0
=========================================
*/

/* ── Google Fonts ─────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400&family=Roboto:wght@300;400;500;700&family=Montserrat:wght@300;400;500;600;700&display=swap');

/* ── M3 Color Tokens ──────────────────────────────── */
:root {
  /* Brand-tuned M3 Seed Colors */
  --md-primary:             #7D3B47;   /* Rose Gold Dark */
  --md-on-primary:          #FFFFFF;
  --md-primary-container:   #FFD9DC;   /* Blush */
  --md-on-primary-container:#410011;

  --md-secondary:           #C5A059;   /* Champagne Gold */
  --md-on-secondary:        #3E2800;
  --md-secondary-container: #FFECC8;
  --md-on-secondary-container: #261A00;

  --md-tertiary:            #B76E79;   /* Rose Gold Mid */
  --md-on-tertiary:         #FFFFFF;
  --md-tertiary-container:  #FFD9DC;
  --md-on-tertiary-container:#3E0020;

  --md-error:               #B3261E;
  --md-on-error:            #FFFFFF;
  --md-error-container:     #F9DEDC;
  --md-on-error-container:  #410E0B;

  --md-surface:             #FFFBFE;   /* Near-white cream */
  --md-on-surface:          #1C1B1F;
  --md-surface-variant:     #F4E1E2;   /* Soft pink */
  --md-on-surface-variant:  #524345;

  --md-surface-container-lowest:  #FFFFFF;
  --md-surface-container-low:     #FFF1F1;
  --md-surface-container:         #FDEEF0;  /* Section tint */
  --md-surface-container-high:    #F8E4E6;
  --md-surface-container-highest: #F2D9DC;

  --md-outline:             #857375;
  --md-outline-variant:     #D8C2C4;

  --md-inverse-surface:     #312020;
  --md-inverse-on-surface:  #FBE9EA;
  --md-inverse-primary:     #FFB2BA;
  --md-shadow:              #000000;
  --md-scrim:               #000000;

  /* M3 Elevation Overlays (surface tint with primary) */
  --md-elevation-1: 0 1px 2px rgba(0,0,0,.15), 0 1px 3px 1px rgba(0,0,0,.10);
  --md-elevation-2: 0 1px 2px rgba(0,0,0,.2),  0 2px 6px 2px rgba(0,0,0,.12);
  --md-elevation-3: 0 4px 8px 3px rgba(0,0,0,.12), 0 1px 3px rgba(0,0,0,.18);
  --md-elevation-4: 0 6px 10px 4px rgba(0,0,0,.12), 0 2px 3px rgba(0,0,0,.2);
  --md-elevation-5: 0 8px 12px 6px rgba(0,0,0,.12), 0 4px 4px rgba(0,0,0,.2);

  /* M3 Shape Scale */
  --md-shape-none:        0px;
  --md-shape-xs:          4px;
  --md-shape-s:           8px;
  --md-shape-m:           12px;
  --md-shape-l:           16px;
  --md-shape-xl:          28px;
  --md-shape-2xl:         32px;
  --md-shape-full:        9999px;

  /* M3 Typography Scale Sizes */
  --md-display-l:    clamp(3rem,   8vw, 3.5rem);
  --md-display-m:    clamp(2.5rem, 7vw, 2.875rem);
  --md-display-s:    clamp(2rem,   5vw, 2.25rem);
  --md-headline-l:   clamp(1.75rem,4vw, 2rem);
  --md-headline-m:   clamp(1.5rem, 3vw, 1.75rem);
  --md-headline-s:   clamp(1.25rem,2vw, 1.5rem);
  --md-title-l:      1.375rem;
  --md-title-m:      1rem;
  --md-title-s:      0.875rem;
  --md-body-l:       1rem;
  --md-body-m:       0.875rem;
  --md-body-s:       0.75rem;
  --md-label-l:      0.875rem;
  --md-label-m:      0.75rem;
  --md-label-s:      0.6875rem;

  /* Font Families */
  --font-display:  'Cormorant Garamond', Georgia, serif;
  --font-body:     'Montserrat', 'Roboto', sans-serif;

  /* State Layer Opacities */
  --md-state-hover:   0.08;
  --md-state-pressed: 0.12;
  --md-state-focused: 0.12;
  --md-state-dragged: 0.16;

  /* Legacy aliases kept for existing HTML compatibility */
  --rose-gold:             var(--md-primary);
  --rose-gold-light:       #e0a899;
  --rose-gold-dark:        #8c4f58;
  --champagne-gold:        var(--md-secondary);
  --champagne-light:       var(--md-secondary-container);
  --ivory-white:           var(--md-surface);
  --soft-pink:             var(--md-surface-container);
  --dark-charcoal:         #111111;
  --medium-charcoal:       #1a1a1a;
  --light-charcoal:        #2a2a2a;
  --muted-text:            var(--md-on-surface-variant);
  --white:                 #ffffff;
  --gold-gradient:         linear-gradient(135deg, #c5a059 0%, #f3e5ab 50%, #b76e79 100%);
  --rose-gold-gradient:    linear-gradient(135deg, #b76e79 0%, #e0a899 50%, #8c4f58 100%);
  --transition-smooth:     all 0.35s cubic-bezier(0.2, 0, 0, 1);
  --transition-fast:       all 0.2s cubic-bezier(0.2, 0, 0, 1);
  --font-heading:          var(--font-display);
}

/* ── Base Reset ───────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  overflow-x: hidden;
  width: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  background-color: var(--md-surface);
  color: var(--md-on-surface);
  line-height: 1.7;
  font-size: var(--md-body-l);
}

a { text-decoration: none; color: inherit; transition: var(--transition-fast); }

/* M3 Focus ring */
:focus-visible {
  outline: 3px solid var(--md-secondary);
  outline-offset: 3px;
  border-radius: var(--md-shape-xs);
}

/* ── Custom Scrollbar ─────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--md-surface-container-low); }
::-webkit-scrollbar-thumb { background: var(--md-primary); border-radius: var(--md-shape-full); }
::-webkit-scrollbar-thumb:hover { background: var(--md-tertiary); }

/* ── M3 Typography Helpers ────────────────────────── */
.font-heading, h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: 0.5px;
}

/* ── Background Utilities ─────────────────────────── */
.bg-ivory                { background-color: var(--md-surface) !important; }
.bg-soft-pink            { background-color: var(--md-surface-container) !important; }
.bg-charcoal             { background-color: #111111 !important; color: rgba(255,255,255,.85) !important; }
.text-gold               { color: var(--md-secondary) !important; }
.text-rose               { color: var(--md-primary) !important; }

/* ── M3 Filled Button ─────────────────────────────── */
.btn-gold-gradient {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--md-secondary);
  color: var(--md-on-secondary) !important;
  font-family: var(--font-body);
  font-size: var(--md-label-l);
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: none;
  border-radius: var(--md-shape-full);
  padding: 12px 28px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition: var(--transition-smooth);
  box-shadow: var(--md-elevation-1);
}
.btn-gold-gradient::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--md-on-secondary);
  opacity: 0;
  border-radius: inherit;
  transition: opacity 0.2s ease;
}
.btn-gold-gradient:hover { box-shadow: var(--md-elevation-2); }
.btn-gold-gradient:hover::before { opacity: var(--md-state-hover); }
.btn-gold-gradient:active::before { opacity: var(--md-state-pressed); }

/* ── M3 Outlined Button ───────────────────────────── */
.btn-outline-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--md-secondary) !important;
  font-family: var(--font-body);
  font-size: var(--md-label-l);
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: 1.5px solid var(--md-secondary);
  border-radius: var(--md-shape-full);
  padding: 12px 28px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition: var(--transition-smooth);
}
.btn-outline-gold::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--md-secondary);
  opacity: 0;
  border-radius: inherit;
  transition: opacity 0.2s ease;
}
.btn-outline-gold:hover::before { opacity: var(--md-state-hover); }
.btn-outline-gold:active::before { opacity: var(--md-state-pressed); }
.btn-outline-gold:hover { border-color: var(--md-primary); box-shadow: var(--md-elevation-1); }

/* ── M3 Tonal Button ──────────────────────────────── */
.btn-tonal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--md-secondary-container);
  color: var(--md-on-secondary-container) !important;
  font-family: var(--font-body);
  font-size: var(--md-label-l);
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  border: none;
  border-radius: var(--md-shape-full);
  padding: 12px 28px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition: var(--transition-smooth);
}

/* ── M3 Extended FAB ──────────────────────────────── */
.btn-fab-extended {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--md-primary-container);
  color: var(--md-on-primary-container) !important;
  font-family: var(--font-body);
  font-size: var(--md-label-l);
  font-weight: 600;
  letter-spacing: 1px;
  border: none;
  border-radius: var(--md-shape-l);
  padding: 16px 24px;
  box-shadow: var(--md-elevation-3);
  cursor: pointer;
  transition: var(--transition-smooth);
  position: fixed;
  bottom: 90px;
  right: 24px;
  z-index: 500;
  text-transform: uppercase;
}
.btn-fab-extended:hover { box-shadow: var(--md-elevation-4); transform: translateY(-2px); }
@media (min-width: 992px) { .btn-fab-extended { bottom: 30px; } }

/* ── M3 Navigation Bar ────────────────────────────── */
.navbar-m3 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  height: 72px;
  display: flex;
  align-items: center;
  padding: 0 24px;
  background: transparent;
  transition: background 0.3s cubic-bezier(0.2,0,0,1),
              box-shadow 0.3s cubic-bezier(0.2,0,0,1),
              backdrop-filter 0.3s ease;
}
.navbar-m3.scrolled {
  background: rgba(255,251,254,0.92);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  box-shadow: var(--md-elevation-2);
  border-bottom: 1px solid var(--md-outline-variant);
}
.navbar-m3.scrolled .brand-m3 { color: var(--md-primary) !important; }
.navbar-m3.scrolled .nav-link-m3 { color: var(--md-on-surface) !important; }
.navbar-m3.scrolled .nav-link-m3:hover { color: var(--md-primary) !important; }
.navbar-m3.scrolled .hamburger-m3 span { background: var(--md-on-surface); }
.navbar-m3.scrolled .nav-cta-m3 { background: var(--md-secondary); color: var(--md-on-secondary) !important; }

/* Solid nav for inner pages */
.navbar-m3.nav-solid {
  background: rgba(255,251,254,0.96);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  box-shadow: var(--md-elevation-2);
  border-bottom: 1px solid var(--md-outline-variant);
}
.navbar-m3.nav-solid .brand-m3 { color: var(--md-primary) !important; }
.navbar-m3.nav-solid .nav-link-m3 { color: var(--md-on-surface) !important; }
.navbar-m3.nav-solid .nav-link-m3:hover,
.navbar-m3.nav-solid .nav-link-m3.active { color: var(--md-primary) !important; }
.navbar-m3.nav-solid .nav-link-m3.active::after { background: var(--md-primary); }
.navbar-m3.nav-solid .hamburger-m3 span { background: var(--md-on-surface); }
.navbar-m3.nav-solid .nav-cta-m3 { background: var(--md-secondary); color: var(--md-on-secondary) !important; }

/* Brand */
.brand-m3 {
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: 4px;
  color: var(--md-secondary);
  white-space: nowrap;
  flex-shrink: 0;
  transition: var(--transition-fast);
}

/* Nav links container */
.nav-links-m3 {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0 auto;
}

/* Individual nav link */
.nav-link-m3 {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  font-family: var(--font-body);
  font-size: var(--md-label-l);
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85) !important;
  border-radius: var(--md-shape-full);
  transition: var(--transition-fast);
  white-space: nowrap;
  overflow: hidden;
}
.nav-link-m3::before {
  content: '';
  position: absolute;
  inset: 0;
  background: currentColor;
  opacity: 0;
  border-radius: inherit;
  transition: opacity 0.15s ease;
}
.nav-link-m3:hover::before  { opacity: 0.08; }
.nav-link-m3:active::before { opacity: 0.12; }
.nav-link-m3.active {
  background: rgba(255,255,255,0.16);
  color: #fff !important;
}
.nav-link-m3.active::after {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 2px;
  border-radius: 2px;
  background: var(--md-secondary);
}

/* Nav actions (CTA + hamburger) */
.nav-actions-m3 {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.nav-cta-m3 {
  display: none;
  padding: 10px 22px;
  background: rgba(255,255,255,0.15);
  border: 1.5px solid rgba(255,255,255,0.4);
  color: #fff !important;
  font-family: var(--font-body);
  font-size: var(--md-label-m);
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border-radius: var(--md-shape-full);
  cursor: pointer;
  transition: var(--transition-fast);
  white-space: nowrap;
  backdrop-filter: blur(8px);
}
.nav-cta-m3:hover {
  background: rgba(255,255,255,0.25);
  box-shadow: var(--md-elevation-1);
}
@media (min-width: 992px) { .nav-cta-m3 { display: inline-flex; } }

/* ── Hamburger Button ─────────────────────────────── */
.hamburger-m3 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  background: transparent;
  border: none;
  cursor: pointer;
  border-radius: var(--md-shape-full);
  padding: 8px;
  transition: var(--transition-fast);
  position: relative;
}
.hamburger-m3::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.1);
  border-radius: inherit;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.hamburger-m3:hover::before { opacity: 1; }
.hamburger-m3 span {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: var(--transition-fast);
}
.hamburger-m3.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger-m3.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger-m3.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media (min-width: 992px) { .hamburger-m3 { display: none; } }

/* ── M3 Navigation Drawer (Mobile) ───────────────── */
.nav-drawer-m3 {
  position: fixed;
  top: 72px;
  left: 0;
  right: 0;
  z-index: 999;
  background: var(--md-surface-container-lowest);
  border-bottom: 1px solid var(--md-outline-variant);
  box-shadow: var(--md-elevation-3);
  padding: 16px 0 24px;
  clip-path: inset(0 0 100% 0);
  transition: clip-path 0.35s cubic-bezier(0.2, 0, 0, 1);
  border-radius: 0 0 var(--md-shape-xl) var(--md-shape-xl);
  overflow: hidden;
}
.nav-drawer-m3.open {
  clip-path: inset(0 0 0% 0);
}
.drawer-links-m3 {
  display: flex;
  flex-direction: column;
  padding: 0 16px;
  gap: 4px;
}
.drawer-link-m3 {
  display: flex;
  align-items: center;
  padding: 14px 20px;
  font-family: var(--font-body);
  font-size: var(--md-title-m);
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--md-on-surface) !important;
  border-radius: var(--md-shape-full);
  position: relative;
  overflow: hidden;
  transition: var(--transition-fast);
}
.drawer-link-m3::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--md-primary);
  opacity: 0;
  border-radius: inherit;
  transition: opacity 0.15s ease;
}
.drawer-link-m3:hover::before  { opacity: 0.08; }
.drawer-link-m3.active {
  background: var(--md-primary-container);
  color: var(--md-on-primary-container) !important;
  font-weight: 700;
}
.drawer-divider-m3 {
  height: 1px;
  background: var(--md-outline-variant);
  margin: 12px 16px;
}
.drawer-cta-m3 {
  margin: 8px 16px 0;
  text-align: center;
  padding: 14px 24px;
  background: var(--md-secondary);
  color: var(--md-on-secondary) !important;
  font-family: var(--font-body);
  font-size: var(--md-label-l);
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border-radius: var(--md-shape-full);
  display: block;
  transition: var(--transition-fast);
  box-shadow: var(--md-elevation-1);
}
.drawer-cta-m3:hover { box-shadow: var(--md-elevation-2); transform: translateY(-1px); }

/* ── M3 Bottom Navigation Bar (Mobile) ───────────── */
.bottom-nav-m3 {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 900;
  background: var(--md-surface-container-lowest);
  border-top: 1px solid var(--md-outline-variant);
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 8px 0 max(8px, env(safe-area-inset-bottom));
  box-shadow: 0 -2px 8px rgba(0,0,0,.08);
}
@media (min-width: 992px) { .bottom-nav-m3 { display: none !important; } }

.bottom-nav-item-m3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex: 1;
  padding: 4px 8px;
  cursor: pointer;
  position: relative;
  text-decoration: none;
  transition: var(--transition-fast);
}
.bottom-nav-indicator-m3 {
  width: 64px;
  height: 32px;
  border-radius: var(--md-shape-full);
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  transition: var(--transition-fast);
  position: relative;
}
.bottom-nav-indicator-m3::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--md-secondary-container);
  border-radius: inherit;
  transform: scale(0);
  transition: transform 0.3s cubic-bezier(0.2,0,0,1);
}
.bottom-nav-item-m3.active .bottom-nav-indicator-m3::before { transform: scale(1); }
.bottom-nav-item-m3.active .bottom-nav-indicator-m3 { color: var(--md-on-secondary-container); }
.bottom-nav-label-m3 {
  font-family: var(--font-body);
  font-size: var(--md-label-s);
  font-weight: 500;
  letter-spacing: 0.5px;
  color: var(--md-on-surface-variant);
  white-space: nowrap;
}
.bottom-nav-item-m3.active .bottom-nav-label-m3 { color: var(--md-secondary); font-weight: 700; }

/* Add bottom padding to body so content isn't hidden behind bottom nav */
@media (max-width: 991.98px) { body { padding-bottom: 72px; } }

/* ── Hero Section ─────────────────────────────────── */
.hero-slider-section {
  position: relative;
  height: 100vh;
  min-height: 600px;
  overflow: hidden;
}
.hero-slider-section .hero-slide-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transform: scale(1.05);
  animation: zoomBg 22s ease-in-out infinite alternate;
}
.hero-slider-section::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom,
    rgba(20,10,15,0.55) 0%,
    rgba(20,10,15,0.45) 40%,
    rgba(20,10,15,0.75) 100%);
}
@keyframes zoomBg {
  from { transform: scale(1.02); }
  to   { transform: scale(1.12); }
}
.hero-content {
  position: relative;
  z-index: 10;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 24px;
}
.hero-title {
  font-family: var(--font-display);
  font-size: var(--md-display-l);
  color: #fff;
  line-height: 1.1;
  font-weight: 300;
  margin-bottom: 24px;
  letter-spacing: 1px;
}
.hero-subtitle {
  font-family: var(--font-body);
  color: var(--md-secondary);
  font-size: var(--md-label-l);
  text-transform: uppercase;
  letter-spacing: 6px;
  margin-bottom: 20px;
  display: block;
}
.hero-scroll-indicator {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 15;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  text-decoration: none;
}
.hero-scroll-indicator span {
  font-family: var(--font-body);
  font-size: var(--md-label-s);
  text-transform: uppercase;
  letter-spacing: 3px;
  color: rgba(255,255,255,.5);
}
.hero-scroll-indicator .scroll-mouse {
  width: 24px;
  height: 38px;
  border: 2px solid rgba(255,255,255,.35);
  border-radius: var(--md-shape-full);
  display: flex;
  justify-content: center;
  padding-top: 6px;
}
.hero-scroll-indicator .scroll-wheel {
  width: 4px;
  height: 8px;
  background: var(--md-secondary);
  border-radius: 2px;
  animation: scrollWheel 1.6s ease-in-out infinite;
}
@keyframes scrollWheel {
  0%  { transform: translateY(0);    opacity: 1; }
  80% { transform: translateY(10px); opacity: 0; }
  100%{ transform: translateY(0);    opacity: 0; }
}

/* ── Inner Page Hero ──────────────────────────────── */
.page-hero-section {
  height: 60vh;
  min-height: 380px;
  background-size: cover;
  background-position: center;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.page-hero-section::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom,
    rgba(20,10,15,0.75) 0%,
    rgba(20,10,15,0.55) 50%,
    rgba(20,10,15,0.80) 100%);
  z-index: 1;
}
.page-hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 48px 64px;
  background: rgba(20,10,15,0.4);
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
  border: 1px solid rgba(197,160,89,0.3);
  border-radius: var(--md-shape-xl);
  max-width: 80%;
}
.page-hero-content::before {
  content: '';
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(197,160,89,0.5);
  pointer-events: none;
  border-radius: calc(var(--md-shape-xl) - 4px);
}
.page-hero-title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 3.5rem);
  color: #fff;
  margin-bottom: 16px;
  letter-spacing: 1px;
}
.breadcrumb-custom {
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: var(--md-label-m);
  text-transform: uppercase;
  letter-spacing: 2px;
}
.breadcrumb-custom li { color: rgba(255,255,255,.55); }
.breadcrumb-custom li a { color: var(--md-secondary); }
.breadcrumb-custom li a:hover { color: #fff; }
.breadcrumb-custom li::after {
  content: '♦';
  margin: 0 10px;
  color: rgba(255,255,255,.25);
  font-size: 0.55rem;
}
.breadcrumb-custom li:last-child::after { display: none; }

/* ── Section Header ───────────────────────────────── */
.section-header {
  text-align: center;
  margin-bottom: 56px;
}
.section-header .subtitle {
  font-family: var(--font-body);
  font-size: var(--md-label-m);
  text-transform: uppercase;
  letter-spacing: 5px;
  color: var(--md-primary);
  display: block;
  margin-bottom: 12px;
  font-weight: 600;
}
.section-header .title {
  font-family: var(--font-display);
  font-size: var(--md-headline-l);
  color: var(--md-on-surface);
  position: relative;
  display: inline-block;
  padding-bottom: 20px;
}
.section-header .title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 64px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--md-secondary), transparent);
  border-radius: 2px;
}
.section-header .title::before {
  content: '♦';
  position: absolute;
  bottom: -7px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--md-secondary);
  font-size: 0.75rem;
}
.bg-charcoal .section-header .title { color: #fff; }

/* ── M3 Elevated Card ─────────────────────────────── */
.card-luxury {
  background: var(--md-surface-container-lowest);
  border: none;
  border-radius: var(--md-shape-xl);
  box-shadow: var(--md-elevation-1);
  transition: box-shadow 0.3s cubic-bezier(0.2,0,0,1),
              transform 0.3s cubic-bezier(0.2,0,0,1);
  overflow: hidden;
  position: relative;
}
/* M3 State Layer on card */
.card-luxury::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--md-primary);
  opacity: 0;
  border-radius: inherit;
  transition: opacity 0.2s ease;
  z-index: 1;
  pointer-events: none;
}
.card-luxury:hover {
  box-shadow: var(--md-elevation-3);
  transform: translateY(-4px);
}
.card-luxury:hover::before { opacity: 0.03; }
/* Shimmer sweep */
.card-luxury::after {
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.15) 50%,
    rgba(255,255,255,0) 100%);
  transform: skewX(-20deg);
  z-index: 2;
  pointer-events: none;
  transition: left 0.6s ease;
}
.card-luxury:hover::after { left: 125%; }

.card-luxury .card-img-wrapper {
  overflow: hidden;
  border-radius: var(--md-shape-xl) var(--md-shape-xl) 0 0;
  aspect-ratio: 4 / 3;
}
.card-luxury .card-img-wrapper img,
.card-luxury .card-img-top {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s cubic-bezier(0.2,0,0,1);
}
.card-luxury:hover .card-img-wrapper img,
.card-luxury:hover .card-img-top { transform: scale(1.06); }

/* ── Category Circles ─────────────────────────────── */
.category-circle-card { text-align: center; margin-bottom: 24px; }
.category-circle-img {
  width: 100%;
  max-width: 160px;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 16px;
  border: 3px solid var(--md-outline-variant);
  box-shadow: var(--md-elevation-2);
  transition: var(--transition-smooth);
}
.category-circle-card:hover .category-circle-img {
  transform: scale(1.06);
  border-color: var(--md-secondary);
  box-shadow: var(--md-elevation-3);
}

/* ── M3 Statistics Counters ───────────────────────── */
.counter-box {
  text-align: center;
  padding: 40px 20px;
}
.counter-number {
  font-family: var(--font-display);
  font-size: clamp(3rem, 7vw, 4.5rem);
  color: var(--md-secondary);
  line-height: 1;
  margin-bottom: 8px;
  font-weight: 500;
}
.counter-title {
  text-transform: uppercase;
  font-size: var(--md-label-m);
  letter-spacing: 3px;
  color: rgba(255,255,255,.6);
  font-weight: 500;
}

/* ── M3 Testimonial Carousel ──────────────────────── */
.testimonial-carousel .carousel-item { padding: 20px clamp(16px, 8vw, 80px); }
.testimonial-quote {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-style: italic;
  font-weight: 300;
  line-height: 1.5;
  color: var(--md-on-surface);
  margin-bottom: 28px;
}
.testimonial-author {
  font-family: var(--font-body);
  text-transform: uppercase;
  font-size: var(--md-label-l);
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--md-primary);
}
.testimonial-location {
  font-size: var(--md-label-m);
  color: var(--md-on-surface-variant);
  letter-spacing: 1px;
  margin-top: 4px;
}
.testimonial-stars {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  margin-bottom: 20px;
}
.testimonial-stars i {
  color: var(--md-secondary);
  font-size: 1rem;
  animation: starPop 0.3s ease both;
}
.testimonial-stars i:nth-child(1) { animation-delay: 0.00s; }
.testimonial-stars i:nth-child(2) { animation-delay: 0.08s; }
.testimonial-stars i:nth-child(3) { animation-delay: 0.16s; }
.testimonial-stars i:nth-child(4) { animation-delay: 0.24s; }
.testimonial-stars i:nth-child(5) { animation-delay: 0.32s; }
@keyframes starPop {
  0%  { transform: scale(0.4); opacity: 0; }
  70% { transform: scale(1.2); }
  100%{ transform: scale(1);   opacity: 1; }
}

/* ── M3 FAQ Accordion ─────────────────────────────── */
.accordion-luxury .accordion-item {
  background: var(--md-surface-container-lowest);
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-shape-l) !important;
  margin-bottom: 12px;
  overflow: hidden;
  box-shadow: var(--md-elevation-1);
}
.accordion-luxury .accordion-button {
  background: var(--md-surface-container-lowest);
  color: var(--md-on-surface);
  font-family: var(--font-display);
  font-size: var(--md-headline-s);
  border-radius: var(--md-shape-l) !important;
  padding: 20px 24px;
  box-shadow: none;
}
.accordion-luxury .accordion-button:not(.collapsed) {
  color: var(--md-primary);
  background: var(--md-primary-container);
}
.accordion-luxury .accordion-body {
  padding: 8px 24px 24px;
  font-family: var(--font-body);
  font-size: var(--md-body-l);
  color: var(--md-on-surface-variant);
  border-top: 1px solid var(--md-outline-variant);
}

/* ── M3 Contact Info Card ─────────────────────────── */
.contact-info-box {
  background: var(--md-surface-container-low);
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-shape-xl);
  padding: 40px;
  box-shadow: var(--md-elevation-1);
}
.contact-icon-wrapper {
  width: 48px;
  height: 48px;
  border-radius: var(--md-shape-full);
  background: var(--md-primary-container);
  color: var(--md-on-primary-container);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  margin-bottom: 16px;
}

/* ── M3 Form Inputs (Filled style) ───────────────── */
.form-luxury .form-control,
.form-luxury .form-select {
  border-radius: var(--md-shape-xs) var(--md-shape-xs) 0 0;
  border: none;
  border-bottom: 2px solid var(--md-outline);
  padding: 16px 14px 8px;
  background-color: var(--md-surface-variant);
  font-family: var(--font-body);
  font-size: var(--md-body-l);
  color: var(--md-on-surface);
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.form-luxury .form-control:focus,
.form-luxury .form-select:focus {
  border-color: var(--md-secondary);
  background-color: var(--md-surface-container);
  box-shadow: none;
  outline: none;
}
.form-luxury label {
  font-size: var(--md-label-m);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
  color: var(--md-on-surface-variant);
  margin-bottom: 4px;
}

/* Input group (newsletter) */
.form-luxury .input-group {
  border-radius: var(--md-shape-full);
  overflow: hidden;
  box-shadow: var(--md-elevation-1);
}
.form-luxury .input-group .form-control {
  border-radius: var(--md-shape-full) 0 0 var(--md-shape-full);
  border: none;
  background: rgba(255,255,255,.1);
  color: #fff;
  padding: 14px 20px;
}
.form-luxury .input-group .form-control::placeholder { color: rgba(255,255,255,.5); }
.form-luxury .input-group .form-control:focus { background: rgba(255,255,255,.15); box-shadow: none; }

/* ── M3 Gallery & Portfolio ───────────────────────── */
.gallery-filter-btn {
  font-family: var(--font-body);
  font-size: var(--md-label-m);
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding: 8px 20px;
  border-radius: var(--md-shape-full);
  border: 1.5px solid var(--md-outline);
  background: transparent;
  color: var(--md-on-surface-variant);
  margin: 4px;
  transition: var(--transition-fast);
  cursor: pointer;
}
.gallery-filter-btn.active,
.gallery-filter-btn:hover {
  background: var(--md-secondary);
  color: var(--md-on-secondary);
  border-color: var(--md-secondary);
  box-shadow: var(--md-elevation-1);
}
.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: var(--md-shape-l);
  margin-bottom: 24px;
  box-shadow: var(--md-elevation-1);
}
.gallery-overlay {
  position: absolute;
  inset: 0;
  background: rgba(20,10,15,0.75);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: opacity 0.35s cubic-bezier(0.2,0,0,1);
  backdrop-filter: blur(4px);
  border-radius: inherit;
}
.gallery-item:hover .gallery-overlay { opacity: 1; }
.gallery-item img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  transition: transform 0.45s cubic-bezier(0.2,0,0,1);
}
.gallery-item:hover img { transform: scale(1.08); }
.gallery-title {
  color: #fff;
  font-family: var(--font-display);
  font-size: var(--md-title-l);
  margin-bottom: 8px;
}
.gallery-category {
  color: var(--md-secondary);
  font-size: var(--md-label-m);
  text-transform: uppercase;
  letter-spacing: 2px;
}

/* ── Timeline ─────────────────────────────────────── */
.timeline-wedding { position: relative; padding: 40px 0; }
.timeline-wedding::after {
  content: '';
  position: absolute;
  width: 2px;
  background: linear-gradient(to bottom, transparent, var(--md-secondary), transparent);
  top: 0; bottom: 0; left: 50%;
  margin-left: -1px;
}
.timeline-item {
  padding: 20px 32px;
  position: relative;
  background: transparent;
  width: 50%;
}
.timeline-item-left  { left: 0; text-align: right; }
.timeline-item-right { left: 50%; text-align: left; }
.timeline-item::after {
  content: '';
  position: absolute;
  width: 14px; height: 14px;
  right: -7px;
  background: var(--md-surface);
  border: 3px solid var(--md-primary);
  top: 28px;
  border-radius: 50%;
  z-index: 1;
  box-shadow: var(--md-elevation-1);
}
.timeline-item-right::after { left: -7px; }
.timeline-date {
  font-family: var(--font-display);
  font-size: var(--md-headline-s);
  color: var(--md-primary);
  margin-bottom: 4px;
}
.timeline-content-card {
  background: var(--md-surface-container-lowest);
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-shape-l);
  padding: 24px;
  box-shadow: var(--md-elevation-1);
}
@media (max-width: 768px) {
  .timeline-wedding::after { left: 20px; }
  .timeline-item { width: 100%; padding-left: 48px; padding-right: 0; text-align: left; }
  .timeline-item-right { left: 0; }
  .timeline-item::after { left: 12px; right: auto; }
}

/* ── Countdown Box ────────────────────────────────── */
.countdown-box {
  background: var(--md-surface-container-lowest);
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-shape-xl);
  padding: clamp(24px,5vw,40px);
  box-shadow: var(--md-elevation-2);
}
.countdown-item { text-align: center; padding: 0 clamp(8px,2vw,20px); }
.countdown-number {
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 8vw, 4rem);
  color: var(--md-primary);
  font-weight: 600;
  display: block;
  line-height: 1.1;
  margin-bottom: 6px;
}
.countdown-label {
  font-family: var(--font-body);
  font-size: var(--md-label-s);
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--md-on-surface-variant);
  font-weight: 600;
}

/* ── Checklist ────────────────────────────────────── */
.checklist-wrapper {
  background: var(--md-surface-container-lowest);
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-shape-xl);
  padding: 40px;
  box-shadow: var(--md-elevation-1);
}
.checklist-item {
  padding: 14px 0;
  border-bottom: 1px solid var(--md-outline-variant);
  display: flex;
  align-items: center;
}
.checklist-item:last-child { border-bottom: none; }
.checklist-checkbox {
  width: 20px; height: 20px;
  border: 2px solid var(--md-primary);
  border-radius: var(--md-shape-xs);
  margin-right: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: var(--transition-fast);
}
.checklist-checkbox.checked { background: var(--md-primary); }
.checklist-checkbox.checked::after { content: '✓'; color: #fff; font-size: 0.75rem; font-weight: 700; }
.checklist-text { font-size: var(--md-body-l); color: var(--md-on-surface); transition: var(--transition-fast); }
.checklist-checkbox.checked + .checklist-text { text-decoration: line-through; color: var(--md-on-surface-variant); }

/* ── Packages Table ───────────────────────────────── */
.table-comparison th {
  background-color: #111;
  color: #fff;
  font-family: var(--font-display);
  font-size: var(--md-headline-s);
  font-weight: 400;
  padding: 20px;
  text-align: center;
  border: 1px solid rgba(255,255,255,.08);
}
.table-comparison td {
  padding: 16px 18px;
  font-size: var(--md-body-m);
  text-align: center;
  background: var(--md-surface-container-lowest);
  border: 1px solid var(--md-outline-variant);
}
.table-comparison td:first-child { text-align: left; font-weight: 600; }

/* ── Video Overlays ───────────────────────────────── */
.video-card-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.4);
  display: flex;
  justify-content: center;
  align-items: center;
  transition: var(--transition-smooth);
}
.video-card-overlay .play-btn {
  width: 64px; height: 64px;
  background: var(--md-surface);
  color: var(--md-primary);
  border-radius: var(--md-shape-full);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  box-shadow: var(--md-elevation-3);
  transition: var(--transition-smooth);
}
.video-card-overlay:hover .play-btn {
  transform: scale(1.12);
  background: var(--md-primary);
  color: var(--md-on-primary);
}

/* ── Partner Logos ────────────────────────────────── */
.partner-logo {
  filter: grayscale(100%);
  opacity: 0.35;
  transition: var(--transition-smooth);
  max-width: 130px;
}
.partner-logo:hover { filter: grayscale(0%); opacity: 0.8; }

/* ── M3 Lightbox Modal ────────────────────────────── */
.lightbox-modal .modal-content { background: transparent; border: none; }
.lightbox-modal .modal-body { padding: 0; position: relative; }
.lightbox-modal .btn-close { position: absolute; top: -40px; right: 0; filter: invert(1); opacity: .8; }

/* ── Pagination ───────────────────────────────────── */
.pagination-luxury .page-item { margin: 0 4px; }
.pagination-luxury .page-link {
  width: 40px; height: 40px;
  line-height: 40px;
  text-align: center;
  padding: 0;
  border-radius: var(--md-shape-full) !important;
  border: 1.5px solid var(--md-outline-variant);
  background: var(--md-surface-container-lowest);
  color: var(--md-on-surface) !important;
  font-family: var(--font-body);
  font-size: var(--md-body-m);
  transition: var(--transition-fast);
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: var(--md-elevation-1);
}
.pagination-luxury .page-item.active .page-link {
  background: var(--md-secondary);
  color: var(--md-on-secondary) !important;
  border-color: var(--md-secondary);
  box-shadow: var(--md-elevation-2);
}
.pagination-luxury .page-link:hover {
  background: var(--md-primary-container);
  color: var(--md-on-primary-container) !important;
  border-color: var(--md-primary);
}

/* ── M3 Footer ────────────────────────────────────── */
.footer-luxury {
  background-color: #111111;
  color: rgba(255,255,255,.8);
  padding: 80px 0 32px;
  border-top: 1px solid rgba(197,160,89,.25);
  font-size: var(--md-body-m);
}
.footer-luxury p, .footer-luxury .text-muted { color: rgba(255,255,255,.65) !important; }
.footer-title {
  color: #fff !important;
  font-family: var(--font-display);
  font-size: var(--md-title-l);
  margin-bottom: 24px;
  position: relative;
  padding-bottom: 12px;
}
.footer-title::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 40px; height: 2px;
  background: var(--md-secondary);
  border-radius: 2px;
}
.footer-title i { color: var(--md-secondary) !important; font-size: 18px !important; vertical-align: baseline; margin-right: 10px; }
.footer-links { list-style: none; padding: 0; }
.footer-links li { margin-bottom: 12px; }
.footer-links li a { color: rgba(255,255,255,.7) !important; transition: var(--transition-fast); }
.footer-links li a::before { content: '♦'; color: var(--md-secondary); margin-right: 8px; font-size: 0.55rem; transition: var(--transition-fast); }
.footer-links li a:hover { color: var(--md-secondary) !important; padding-left: 4px; }
.footer-links li a:hover::before { color: #fff; }
.footer-social-icons a {
  width: 40px; height: 40px;
  border-radius: var(--md-shape-full);
  background: rgba(255,255,255,.08);
  color: #fff !important;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-right: 8px;
  transition: var(--transition-fast);
  border: 1px solid rgba(255,255,255,.12);
}
.footer-social-icons a:hover { background: var(--md-primary); border-color: var(--md-primary); transform: translateY(-2px); box-shadow: var(--md-elevation-2); }
.footer-social-icons a i { color: #fff !important; font-size: 16px !important; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.08);
  margin-top: 48px;
  padding-top: 28px;
  font-size: var(--md-label-m);
  color: rgba(255,255,255,.45);
}
.footer-bottom a { color: rgba(255,255,255,.45) !important; }
.footer-bottom a:hover { color: var(--md-secondary) !important; }
.footer-credit-link {
  color: var(--md-secondary) !important;
  font-weight: 700;
  transition: var(--transition-fast);
  border-bottom: 1px solid transparent;
}
.footer-credit-link:hover { color: var(--md-tertiary) !important; border-bottom-color: var(--md-tertiary); }
.footer-credit-heart { color: var(--md-primary) !important; font-size: 0.7rem; }

/* ── Back to Top ──────────────────────────────────── */
.back-to-top {
  position: fixed;
  bottom: 90px;
  right: 24px;
  width: 48px; height: 48px;
  border-radius: var(--md-shape-full);
  background: var(--md-primary);
  color: var(--md-on-primary);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition-smooth);
  z-index: 800;
  box-shadow: var(--md-elevation-3);
}
.back-to-top.show { opacity: 1; visibility: visible; }
.back-to-top:hover { background: var(--md-secondary); transform: translateY(-3px); box-shadow: var(--md-elevation-4); }
@media (min-width: 992px) { .back-to-top { bottom: 30px; right: 24px; } }

/* ── Scroll Reveal ────────────────────────────────── */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.6s cubic-bezier(0.2,0,0,1), transform 0.6s cubic-bezier(0.2,0,0,1); }
.reveal.active { opacity: 1; transform: translateY(0); }

/* ── Responsive ───────────────────────────────────── */
@media (max-width: 768px) {
  .hero-title { font-size: clamp(2.2rem, 9vw, 3rem); }
  .page-hero-content { padding: 32px 24px; max-width: 92%; }
  .page-hero-title { font-size: clamp(1.6rem, 7vw, 2.5rem); }
  .counter-number { font-size: 2.5rem; }
  .testimonial-quote { font-size: clamp(1.2rem, 4vw, 1.8rem); }
  .section-header .title { font-size: clamp(1.6rem, 6vw, 2.2rem); }
}

/* ── Dark Theme (M3 Dark) ─────────────────────────── */
[data-theme="dark"] body {
  background-color: #1C1B1F !important;
  color: #E6E1E5 !important;
}
[data-theme="dark"] .bg-ivory  { background-color: #1C1B1F !important; }
[data-theme="dark"] .bg-soft-pink { background-color: #2B2627 !important; }
[data-theme="dark"] .navbar-m3.scrolled,
[data-theme="dark"] .navbar-m3.nav-solid {
  background: rgba(28,27,31,0.95) !important;
  border-bottom-color: rgba(255,255,255,.1) !important;
}
[data-theme="dark"] .navbar-m3.scrolled .nav-link-m3,
[data-theme="dark"] .navbar-m3.nav-solid .nav-link-m3 { color: #E6E1E5 !important; }
[data-theme="dark"] .nav-drawer-m3 {
  background: #2B2627 !important;
  border-bottom-color: rgba(255,255,255,.1) !important;
}
[data-theme="dark"] .drawer-link-m3 { color: #E6E1E5 !important; }
[data-theme="dark"] .bottom-nav-m3 {
  background: #2B2627 !important;
  border-top-color: rgba(255,255,255,.1) !important;
}
[data-theme="dark"] .bottom-nav-label-m3 { color: #CAC4D0 !important; }
[data-theme="dark"] .card-luxury { background-color: #2B2627 !important; color: #E6E1E5 !important; }
[data-theme="dark"] .card-luxury .text-dark,
[data-theme="dark"] .card-luxury h4,
[data-theme="dark"] .card-luxury h5,
[data-theme="dark"] .card-luxury p  { color: #E6E1E5 !important; }
[data-theme="dark"] .card-luxury .text-muted { color: #CAC4D0 !important; }
[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,
[data-theme="dark"] h4,[data-theme="dark"] h5,[data-theme="dark"] h6 { color: #E6E1E5 !important; }
[data-theme="dark"] p, [data-theme="dark"] .text-dark { color: #CAC4D0 !important; }
[data-theme="dark"] .text-muted { color: #9E9599 !important; }
[data-theme="dark"] .section-header .title { color: #E6E1E5; }
[data-theme="dark"] .accordion-luxury .accordion-item { background: #2B2627 !important; border-color: rgba(255,255,255,.1) !important; }
[data-theme="dark"] .accordion-luxury .accordion-button { background: #2B2627 !important; color: #E6E1E5 !important; }
[data-theme="dark"] .accordion-luxury .accordion-button:not(.collapsed) { background: #3D2B2E !important; color: #FFB2BA !important; }
[data-theme="dark"] .accordion-luxury .accordion-body { background: #2B2627 !important; color: #CAC4D0 !important; }
[data-theme="dark"] .form-luxury .form-control { background: #2B2627 !important; color: #E6E1E5 !important; border-color: rgba(255,255,255,.2) !important; }
[data-theme="dark"] .countdown-box { background: #2B2627 !important; border-color: rgba(255,255,255,.12) !important; }
[data-theme="dark"] .countdown-box h4 { color: #E6E1E5 !important; }
[data-theme="dark"] .checklist-wrapper,
[data-theme="dark"] .timeline-content-card,
[data-theme="dark"] .contact-info-box { background: #2B2627 !important; border-color: rgba(255,255,255,.1) !important; color: #E6E1E5 !important; }
[data-theme="dark"] .footer-luxury { background: #0E0C0D !important; border-top-color: rgba(197,160,89,.15) !important; }
[data-theme="dark"] .gallery-filter-btn { color: #CAC4D0 !important; border-color: rgba(255,255,255,.2) !important; }
[data-theme="dark"] .pagination-luxury .page-link { background: #2B2627 !important; color: #E6E1E5 !important; border-color: rgba(255,255,255,.1) !important; }

/* ============================================================
   DESIGN FURNISHING — v2.1
   Polish, depth, ornament & visual richness refinements
   ============================================================ */

/* ── 1. Richer Section Backgrounds ───────────────────────── */
.bg-ivory {
  background-color: var(--md-surface) !important;
  background-image: radial-gradient(circle, rgba(197,160,89,0.07) 1px, transparent 1px);
  background-size: 28px 28px;
}
.bg-soft-pink {
  background-color: var(--md-surface-container) !important;
  background-image:
    linear-gradient(135deg, rgba(183,110,121,0.04) 25%, transparent 25%),
    linear-gradient(225deg, rgba(183,110,121,0.04) 25%, transparent 25%),
    linear-gradient(45deg,  rgba(183,110,121,0.04) 25%, transparent 25%),
    linear-gradient(315deg, rgba(183,110,121,0.04) 25%, transparent 25%);
  background-size: 20px 20px;
}
.bg-charcoal {
  background-image:
    radial-gradient(circle at 20% 80%, rgba(197,160,89,0.06) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(183,110,121,0.06) 0%, transparent 50%);
}

/* ── 2. Section Header polish ─────────────────────────────── */
.section-header { padding: 0 0 12px; }
.section-header .subtitle { font-size: 0.68rem; letter-spacing: 6px; }
.section-header .title { padding-bottom: 28px; font-size: clamp(1.9rem,5vw,2.6rem); letter-spacing: 1.5px; }
.section-header .title::after { width: 90px; height: 1.5px; background: linear-gradient(90deg, transparent 0%, var(--md-secondary) 30%, var(--md-secondary) 70%, transparent 100%); }
.section-header .title::before { font-size: 0.85rem; bottom: -8px; text-shadow: 0 0 8px rgba(197,160,89,0.5); }

/* ── 3. Section Ornamental Divider ───────────────────────── */
.section-divider { display:flex; align-items:center; justify-content:center; gap:12px; padding:8px 0; overflow:hidden; }
.section-divider::before, .section-divider::after { content:''; flex:1; max-width:180px; height:1px; background:linear-gradient(90deg,transparent,var(--md-outline-variant),transparent); }
.section-divider span { font-size:0.75rem; color:var(--md-secondary); letter-spacing:2px; flex-shrink:0; }

/* ── 4. Brand Logotype — Gold gradient ──────────────────── */
.brand-m3 {
  font-size: 1.9rem;
  letter-spacing: 5px;
  background: linear-gradient(135deg, var(--md-secondary) 30%, #f3e5ab 60%, var(--md-tertiary) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 1px 6px rgba(197,160,89,0.25));
}
.navbar-m3.scrolled .brand-m3, .navbar-m3.nav-solid .brand-m3 {
  background: linear-gradient(135deg, var(--md-primary) 0%, var(--md-secondary) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: none;
}

/* ── 5. Navbar CTA richer pill ──────────────────────────── */
.navbar-m3.scrolled .nav-cta-m3, .navbar-m3.nav-solid .nav-cta-m3 {
  background: linear-gradient(135deg, var(--md-secondary) 0%, #d4b475 50%, var(--md-tertiary) 100%);
  border: none;
  color: var(--md-on-secondary) !important;
  box-shadow: 0 3px 12px rgba(197,160,89,0.35);
}
.navbar-m3.scrolled .nav-cta-m3:hover, .navbar-m3.nav-solid .nav-cta-m3:hover {
  box-shadow: 0 5px 20px rgba(197,160,89,0.45);
  transform: translateY(-1px);
}

/* ── 6. Accordion — Gold accent + depth ─────────────────── */
.accordion-luxury .accordion-item {
  border-radius: var(--md-shape-l) !important;
  border: 1px solid var(--md-outline-variant) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.06) !important;
  transition: box-shadow 0.25s ease, border-color 0.25s ease;
  overflow: hidden;
}
.accordion-luxury .accordion-item:hover {
  box-shadow: 0 4px 16px rgba(125,59,71,0.08), 0 1px 4px rgba(0,0,0,0.06) !important;
  border-color: var(--md-outline) !important;
}
.accordion-luxury .accordion-button {
  font-size: 1.1rem;
  padding: 22px 24px;
  letter-spacing: 0.3px;
  border-radius: var(--md-shape-l) !important;
  transition: background 0.25s ease, color 0.25s ease;
}
.accordion-luxury .accordion-button:not(.collapsed) {
  color: var(--md-primary) !important;
  background: linear-gradient(135deg, var(--md-primary-container) 0%, rgba(255,217,220,0.5) 100%) !important;
  border-bottom: 1px solid rgba(197,160,89,0.2);
  font-weight: 500;
  border-left: 3px solid var(--md-secondary);
}
.accordion-luxury .accordion-button::after {
  filter: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%237D3B47'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.accordion-luxury .accordion-body {
  padding: 4px 24px 28px 24px;
  font-size: 0.9rem;
  line-height: 1.85;
  color: var(--md-on-surface-variant);
  border-top: 1px solid var(--md-outline-variant);
}

/* ── 7. Cards — Warmer shadow & body polish ─────────────── */
.card-luxury {
  box-shadow: 0 1px 3px rgba(125,59,71,0.04), 0 4px 16px rgba(0,0,0,0.06), 0 0 0 1px rgba(216,194,196,0.3) !important;
  border-radius: 20px !important;
}
.card-luxury:hover {
  box-shadow: 0 4px 8px rgba(125,59,71,0.06), 0 12px 36px rgba(0,0,0,0.1), 0 0 0 1px rgba(197,160,89,0.25) !important;
  transform: translateY(-6px) !important;
}
.card-luxury .card-body { padding: 24px 28px 28px !important; }
.card-luxury .card-body h4, .card-luxury .card-body h5 { font-size: 1.3rem; margin-bottom: 10px; letter-spacing: 0.5px; }
.card-luxury .card-body .text-muted { font-size: 0.84rem; line-height: 1.75; }
.card-luxury .card-body a.text-rose { font-size: 0.72rem; letter-spacing: 2px; display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; }
.bg-soft-pink .card-luxury, .bg-ivory .card-luxury {
  background: linear-gradient(165deg, rgba(255,255,255,1) 0%, rgba(255,241,241,0.7) 100%) !important;
}

/* ── 8. Counter numbers — Gold gradient text ─────────────── */
.counter-number {
  background: linear-gradient(135deg, var(--md-secondary) 0%, #e8c880 50%, var(--md-tertiary) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 2px 8px rgba(197,160,89,0.3));
}

/* ── 9. Countdown — Warm glass surface ──────────────────── */
.countdown-box {
  background: linear-gradient(135deg, rgba(255,255,255,0.98) 0%, rgba(255,241,241,0.95) 100%) !important;
  box-shadow: 0 4px 24px rgba(125,59,71,0.08), 0 1px 4px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.9) !important;
}
.countdown-number {
  background: linear-gradient(135deg, var(--md-primary) 0%, var(--md-tertiary) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── 10. Category circle hover ring ─────────────────────── */
.category-circle-img { box-shadow: 0 4px 16px rgba(0,0,0,0.08); transition: all 0.35s cubic-bezier(0.2,0,0,1); }
.category-circle-card:hover .category-circle-img {
  border-color: var(--md-secondary) !important;
  box-shadow: 0 8px 28px rgba(197,160,89,0.25), 0 0 0 4px rgba(197,160,89,0.12);
  transform: scale(1.07) !important;
}

/* ── 11. Testimonial — Opening quote flourish ───────────── */
.testimonial-quote { position: relative; padding: 0 16px; }
.testimonial-quote::before {
  content: '\201C';
  position: absolute;
  top: -24px; left: 0;
  font-family: var(--font-display);
  font-size: 5rem;
  line-height: 1;
  color: var(--md-secondary);
  opacity: 0.22;
  pointer-events: none;
}
.testimonial-carousel .carousel-control-prev,
.testimonial-carousel .carousel-control-next {
  width: 44px; height: 44px;
  top: 50%; transform: translateY(-50%);
  border-radius: 50%;
  background: rgba(125,59,71,0.08);
  border: 1.5px solid rgba(125,59,71,0.15);
  opacity: 0.8;
  transition: all 0.2s ease;
}
.testimonial-carousel .carousel-control-prev { left: -4px; }
.testimonial-carousel .carousel-control-next { right: -4px; }
.testimonial-carousel .carousel-control-prev:hover,
.testimonial-carousel .carousel-control-next:hover { opacity: 1; background: var(--md-primary); border-color: var(--md-primary); }

/* ── 12. Icon wrapper polish ────────────────────────────── */
.contact-icon-wrapper {
  width: 56px; height: 56px;
  font-size: 1.1rem;
  background: linear-gradient(135deg, var(--md-primary-container) 0%, var(--md-secondary-container) 100%);
  box-shadow: 0 3px 12px rgba(125,59,71,0.12);
  border: 1px solid rgba(197,160,89,0.15);
}

/* ── 13. Checklist left accent bar ──────────────────────── */
.checklist-wrapper {
  border-left: 3px solid var(--md-secondary) !important;
  border-radius: 0 var(--md-shape-xl) var(--md-shape-xl) 0 !important;
}
.checklist-item { padding: 16px 0; transition: padding-left 0.2s ease, background 0.2s ease; }
.checklist-item:hover { background: rgba(197,160,89,0.04); padding-left: 8px; border-radius: var(--md-shape-s); }

/* ── 14. Global buttons richer ──────────────────────────── */
.btn-gold-gradient {
  background: linear-gradient(135deg, var(--md-secondary) 0%, #d4b475 60%, var(--md-tertiary) 100%);
  box-shadow: 0 3px 12px rgba(197,160,89,0.3);
  letter-spacing: 2px; font-size: 0.72rem;
}
.btn-gold-gradient:hover {
  box-shadow: 0 6px 24px rgba(197,160,89,0.4);
  background: linear-gradient(135deg, var(--md-tertiary) 0%, var(--md-secondary) 100%);
  transform: translateY(-2px); color: #fff !important;
}

/* ── 15. Hero buttons richer ────────────────────────────── */
.hero-content .btn-gold-gradient {
  background: linear-gradient(135deg, var(--md-secondary) 0%, #e8c880 50%, #d4976a 100%);
  box-shadow: 0 4px 20px rgba(197,160,89,0.4), 0 1px 4px rgba(0,0,0,0.15);
  padding: 14px 34px; font-size: 0.73rem; letter-spacing: 2.5px;
}
.hero-content .btn-gold-gradient:hover { box-shadow: 0 8px 32px rgba(197,160,89,0.5); transform: translateY(-2px); }
.hero-content .btn-outline-gold {
  border: 1.5px solid rgba(255,255,255,0.5);
  color: #fff !important;
  backdrop-filter: blur(8px);
  padding: 14px 34px; font-size: 0.73rem; letter-spacing: 2.5px;
}
.hero-content .btn-outline-gold:hover { background: rgba(255,255,255,0.15); border-color: rgba(255,255,255,0.8); }

/* ── 16. Page hero title richer ─────────────────────────── */
.page-hero-title { letter-spacing: 2px; text-shadow: 0 2px 12px rgba(0,0,0,0.3); }

/* ── 17. Back-to-top gradient + appear animation ─────────── */
.back-to-top { background: linear-gradient(135deg, var(--md-primary) 0%, var(--md-tertiary) 100%); }
.back-to-top.show { animation: fabAppear 0.35s cubic-bezier(0.2,0,0,1) both; }
@keyframes fabAppear { from { opacity:0; transform:translateY(12px) scale(0.85); } to { opacity:1; transform:none; } }
.back-to-top:hover { background: linear-gradient(135deg, var(--md-secondary) 0%, #d4b475 100%); box-shadow: 0 6px 20px rgba(197,160,89,0.4) !important; }

/* ── 18. Dark mode furnishing overrides ─────────────────── */
[data-theme="dark"] .bg-ivory { background-image: radial-gradient(circle, rgba(197,160,89,0.05) 1px, transparent 1px) !important; background-size: 28px 28px !important; }
[data-theme="dark"] .bg-soft-pink { background-image: none !important; }
[data-theme="dark"] .card-luxury { box-shadow: 0 2px 8px rgba(0,0,0,0.2), 0 0 0 1px rgba(255,255,255,0.05) !important; }
[data-theme="dark"] .card-luxury:hover { box-shadow: 0 8px 32px rgba(0,0,0,0.3), 0 0 0 1px rgba(197,160,89,0.15) !important; }
[data-theme="dark"] .bg-soft-pink .card-luxury, [data-theme="dark"] .bg-ivory .card-luxury { background: #2B2627 !important; }
[data-theme="dark"] .countdown-box { background: linear-gradient(135deg, #2B2627 0%, #312020 100%) !important; }
