:root {
  --background: 330 66% 98%;
  --foreground: 0 0% 17%;
  --primary: 338 70% 66%;
  --primary-foreground: 0 0% 100%;
  --secondary: 205 86% 94%;
  --secondary-foreground: 0 0% 17%;
  --muted: 38 38% 96%;
  --muted-foreground: 0 0% 42%;
  --destructive: 0 75% 58%;
  --border: 338 34% 86%;
  --card: 0 0% 100%;
  --accent: 41 45% 60%;
  --shadow-sm: 0 8px 24px rgba(200, 169, 107, 0.14);
  --shadow-md: 0 18px 45px rgba(214, 125, 164, 0.18);
  --shadow-lg: 0 30px 80px rgba(43, 43, 43, 0.14);
  --transition-fast: 180ms ease;
  --transition-smooth: 480ms cubic-bezier(.22,1,.36,1);
  --radius-sm: 16px;
  --radius-md: 24px;
  --radius-lg: 34px;
}
.dark {
  --background: 330 18% 10%;
  --foreground: 35 58% 94%;
  --primary: 338 63% 72%;
  --primary-foreground: 330 18% 10%;
  --secondary: 215 24% 18%;
  --secondary-foreground: 35 58% 94%;
  --muted: 330 16% 15%;
  --muted-foreground: 35 18% 72%;
  --destructive: 0 72% 62%;
  --border: 330 18% 26%;
  --card: 330 18% 13%;
  --accent: 41 48% 64%;
}
* { box-sizing: border-box; }
html { scroll-padding-top: 90px; }
body { margin: 0; font-family: Inter, sans-serif; background: hsl(var(--background)); color: hsl(var(--foreground)); }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
input, select, textarea { font-size: max(16px, 1rem); }
.glass-nav { background: hsl(var(--card) / .64); backdrop-filter: blur(22px); border-bottom: 1px solid hsl(var(--border) / .65); }
.glass-card { border: 1px solid hsl(var(--border) / .75); background: linear-gradient(135deg, rgba(255,255,255,.62), rgba(255,255,255,.25)); backdrop-filter: blur(18px); box-shadow: var(--shadow-sm); }
.luxury-text { background: linear-gradient(100deg, hsl(var(--primary)), hsl(var(--accent)), hsl(205 80% 70%)); -webkit-background-clip: text; color: transparent; }
.section-wrap { position: relative; padding: 5rem 1rem; }
.eyebrow { display: inline-flex; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: hsl(var(--primary)); font-size: .78rem; }
.section-title { margin-top: .6rem; font-family: 'Playfair Display', serif; font-weight: 800; font-size: clamp(2.35rem, 7vw, 4.5rem); line-height: 1.05; text-align: center; }
.section-subtitle { margin: 1rem auto 0; max-width: 760px; font-size: 1.05rem; line-height: 1.8; color: hsl(var(--foreground) / .68); }
.hero-orb { position: absolute; border-radius: 999px; filter: blur(44px); opacity: .65; animation: float 8s ease-in-out infinite; }
.hero-orb-one { width: 360px; height: 360px; left: -120px; top: 120px; background: hsl(var(--primary) / .35); }
.hero-orb-two { width: 340px; height: 340px; right: -90px; top: 190px; background: hsl(var(--secondary) / .95); animation-delay: -2s; }
.hero-orb-three { width: 220px; height: 220px; right: 24%; bottom: 50px; background: hsl(var(--accent) / .22); animation-delay: -4s; }
.particle { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: hsl(var(--primary) / .42); animation: drift 9s linear infinite; }
.particle-1 { left: 8%; top: 30%; } .particle-2 { left: 22%; top: 72%; animation-delay: -3s; } .particle-3 { right: 12%; top: 22%; animation-delay: -1s; } .particle-4 { right: 22%; bottom: 18%; animation-delay: -5s; } .particle-5 { left: 55%; top: 18%; animation-delay: -2s; } .particle-6 { left: 72%; top: 64%; animation-delay: -7s; }
.portrait-card { min-height: 540px; border-radius: 46px; padding: 1px; background: linear-gradient(145deg, hsl(var(--primary)), hsl(var(--secondary)), hsl(var(--accent))); box-shadow: var(--shadow-lg); transform: rotate(1deg); }
.portrait-inner { height: 100%; min-height: 540px; border-radius: 45px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: radial-gradient(circle at 50% 22%, rgba(255,255,255,.9), transparent 30%), linear-gradient(160deg, #FCE4EC, #F9F9F9 45%, #E3F2FD); text-align: center; overflow: hidden; }
.portrait-face { width: 220px; height: 220px; border-radius: 45% 55% 50% 50%; display: grid; place-items: center; font-size: 5rem; color: hsl(var(--accent)); background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(252,228,236,.72)); box-shadow: inset 0 0 45px rgba(200,169,107,.18), var(--shadow-md); animation: float 5s ease-in-out infinite; }
.portrait-inner p { margin-top: 2rem; font-family: 'Playfair Display', serif; font-weight: 800; font-size: 2.3rem; }
.portrait-inner span { color: hsl(var(--foreground) / .58); font-weight: 700; }
.floating-note { position: absolute; border-radius: 999px; padding: .8rem 1rem; background: rgba(255,255,255,.62); border: 1px solid hsl(var(--border)); box-shadow: var(--shadow-md); backdrop-filter: blur(16px); font-weight: 800; color: hsl(var(--primary)); animation: float 4.8s ease-in-out infinite; }
.service-card { position: relative; overflow: hidden; min-height: 280px; border: 1px solid hsl(var(--border) / .72); border-radius: var(--radius-lg); padding: 1.5rem; background: hsl(var(--card) / .72); box-shadow: var(--shadow-sm); transition: var(--transition-smooth); }
.service-card:before { content: ''; position: absolute; inset: -40% -30% auto auto; width: 200px; height: 200px; border-radius: 50%; background: hsl(var(--primary) / .14); transition: var(--transition-smooth); }
.service-card:hover { transform: translateY(-8px) scale(1.015); box-shadow: var(--shadow-lg); }
.service-card:hover:before { transform: scale(1.8); }
.service-blue:before { background: hsl(var(--secondary) / .9); } .service-pink:before { background: hsl(var(--primary) / .16); } .service-gold:before { background: hsl(var(--accent) / .16); }
.service-icon { position: relative; z-index: 1; margin-bottom: 1.3rem; display: grid; place-items: center; width: 62px; height: 62px; border-radius: 22px; color: hsl(var(--primary)); background: hsl(var(--primary) / .12); }
.bridal-card { position: relative; display: grid; grid-template-columns: 110px 1fr; gap: 1rem; align-items: center; overflow: hidden; border-radius: var(--radius-lg); border: 1px solid hsl(var(--accent) / .42); background: rgba(255,255,255,.54); padding: 1rem; box-shadow: var(--shadow-md); backdrop-filter: blur(18px); }
.bridal-image { height: 140px; border-radius: 28px; display: grid; place-items: center; font-size: 3.5rem; background: linear-gradient(135deg, hsl(var(--primary) / .24), hsl(var(--secondary)), hsl(var(--accent) / .14)); }
.before-card { position: relative; min-height: 360px; overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); background: hsl(var(--muted)); }
.before-panel { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; font-size: 4rem; }
.before-panel b { font-size: 1rem; border-radius: 999px; padding: .6rem 1rem; background: rgba(255,255,255,.7); }
.before-base { background: linear-gradient(135deg, hsl(var(--muted)), hsl(var(--secondary))); }
.before-reveal { overflow: hidden; background: linear-gradient(135deg, hsl(var(--primary) / .42), hsl(var(--card)), hsl(var(--accent) / .28)); border-right: 2px solid white; }
.reveal-range { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; }
.before-label { position: absolute; left: 1rem; right: 1rem; bottom: 1rem; border-radius: 24px; padding: 1rem; background: rgba(255,255,255,.62); backdrop-filter: blur(14px); }
.before-label h3 { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 1.35rem; }
.testimonial-card, .contact-card { border: 1px solid hsl(var(--border)); border-radius: var(--radius-lg); background: linear-gradient(135deg, rgba(255,255,255,.72), rgba(255,255,255,.36)); padding: clamp(1.2rem, 4vw, 2.2rem); box-shadow: var(--shadow-md); backdrop-filter: blur(20px); }
.avatar { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: hsl(var(--primary) / .14); color: hsl(var(--primary)); font-weight: 900; }
.about-visual { min-height: 430px; border-radius: var(--radius-lg); background: radial-gradient(circle at 50% 30%, rgba(255,255,255,.95), transparent 26%), linear-gradient(135deg, #FCE4EC, #F9F9F9, #E3F2FD); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; text-align: center; }
.about-medallion { display: grid; place-items: center; width: 190px; height: 190px; border-radius: 50%; border: 1px solid hsl(var(--accent) / .55); background: rgba(255,255,255,.48); color: hsl(var(--primary)); font-family: 'Playfair Display', serif; font-size: 2.4rem; font-weight: 900; box-shadow: var(--shadow-md); }
.stat-card, .mini-feature { border: 1px solid hsl(var(--border)); border-radius: 24px; padding: 1rem; background: rgba(255,255,255,.48); box-shadow: var(--shadow-sm); }
.stat-card b { display: block; font-family: 'Playfair Display', serif; font-size: 1.7rem; color: hsl(var(--primary)); }
.stat-card span { color: hsl(var(--foreground) / .62); font-weight: 700; }
.mini-feature { display: flex; align-items: center; gap: .6rem; font-weight: 800; color: hsl(var(--foreground) / .70); }
.contact-line { display: flex; align-items: flex-start; gap: .8rem; color: hsl(var(--foreground) / .72); font-weight: 650; line-height: 1.6; }
.contact-line svg { flex-shrink: 0; color: hsl(var(--primary)); margin-top: .15rem; }
.social-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: 999px; padding: .8rem 1.1rem; background: hsl(var(--primary) / .12); color: hsl(var(--primary)); font-weight: 900; }
.map-card { min-height: 230px; border-radius: 30px; display: grid; place-items: center; text-align: center; background: linear-gradient(135deg, hsl(var(--secondary)), hsl(var(--muted)), hsl(var(--primary) / .14)); border: 1px solid hsl(var(--border)); }
.map-card b { display: block; font-family: 'Playfair Display', serif; font-size: 1.7rem; }
.map-card span { display: block; margin-top: .4rem; color: hsl(var(--foreground) / .62); font-weight: 800; }
.input { width: 100%; min-height: 52px; border: 1px solid hsl(var(--border)); border-radius: 20px; background: rgba(255,255,255,.7); padding: .9rem 1rem; outline: none; transition: var(--transition-fast); }
.input:focus { border-color: hsl(var(--primary)); box-shadow: 0 0 0 4px hsl(var(--primary) / .12); }
.whatsapp-float { position: fixed; right: 1rem; bottom: calc(5.8rem + env(safe-area-inset-bottom)); z-index: 45; width: 60px; height: 60px; border-radius: 50%; display: grid; place-items: center; background: #25D366; color: white; box-shadow: 0 0 0 0 rgba(37,211,102,.55), 0 18px 36px rgba(37,211,102,.35); animation: pulse 1.9s infinite; }
.footer-gradient { background: linear-gradient(135deg, hsl(var(--primary) / .16), hsl(var(--card)), hsl(var(--secondary))); }
.footer-icon { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.luxury-loader { text-align: center; font-weight: 800; color: hsl(var(--primary)); }
.luxury-loader span { display: block; width: 54px; height: 54px; margin: 0 auto 1rem; border-radius: 50%; border: 3px solid hsl(var(--primary) / .18); border-top-color: hsl(var(--primary)); animation: spin .8s linear infinite; }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-16px); } }
@keyframes drift { 0% { transform: translateY(0) scale(1); opacity: .2; } 50% { opacity: .85; } 100% { transform: translateY(-80px) scale(1.4); opacity: 0; } }
@keyframes pulse { 70% { box-shadow: 0 0 0 18px rgba(37,211,102,0), 0 18px 36px rgba(37,211,102,.35); } 100% { box-shadow: 0 0 0 0 rgba(37,211,102,0), 0 18px 36px rgba(37,211,102,.35); } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (min-width: 1024px) { .section-wrap { padding: 7rem 2rem; } .whatsapp-float { bottom: 1.5rem; right: 1.5rem; } }
@media (max-width: 640px) { .portrait-card, .portrait-inner { min-height: 420px; } .portrait-face { width: 160px; height: 160px; } .bridal-card { grid-template-columns: 1fr; } .section-title { text-align: center !important; } }
