/* ============================================================
   PUJAJI — WORLD-CLASS PREMIUM DESIGN SYSTEM v2.0
   Inspired by top 2% websites: Apple, Awwwards winners,
   Stripe, Linear, Framer, Vercel dark-mode aesthetics
   ============================================================ */

:root {
  --gold: #c9a84c;
  --gold-light: #e4c76b;
  --gold-pale: #f5e9c8;
  --gold-dim: rgba(201,168,76,0.25);
  --purple-deep: #0a0618;
  --purple-dark: #110d20;
  --purple-mid: #1a1430;
  --purple-card: #1e1838;
  --purple-hover: #251f45;
  --border: rgba(201,168,76,0.18);
  --border-bright: rgba(201,168,76,0.45);
  --text: #f0e8d8;
  --text-soft: rgba(240,232,216,0.7);
  --text-dim: rgba(240,232,216,0.38);
  --grad-gold: linear-gradient(135deg,#c9a84c,#e4c76b,#a07830);
  --grad-gold-h: linear-gradient(135deg,#e4c76b,#c9a84c);
  --shadow-gold: 0 0 40px rgba(201,168,76,0.2);
  --shadow-card: 0 8px 48px rgba(0,0,0,0.45);
  --r: 16px; --r-sm: 8px; --r-pill: 50px;
  --t: 0.3s ease;
  --font-d: 'Playfair Display', Georgia, serif;
  --font-b: 'Inter', sans-serif;
  --font-e: 'Cormorant Garamond', Georgia, serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: var(--font-b); background: var(--purple-deep); color: var(--text); line-height: 1.6; overflow-x: hidden; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { max-width: 100%; height: auto; display: block; }
button { cursor: pointer; border: none; background: none; font-family: inherit; color: inherit; }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--purple-deep); }
::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 3px; }
::selection { background: rgba(201,168,76,0.25); color: var(--gold-light); }

/* ── NOISE TEXTURE ── */
.noise-overlay {
  position: fixed; inset: 0; pointer-events: none; z-index: 1000;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");
  opacity: 0.4;
}

/* ── CUSTOM CURSOR ── */
.cursor-dot {
  position: fixed; width: 8px; height: 8px;
  background: var(--gold); border-radius: 50%;
  pointer-events: none; z-index: 9999;
  transform: translate(-50%,-50%);
  transition: transform 0.1s, width 0.2s, height 0.2s;
}
.cursor-ring {
  position: fixed; width: 36px; height: 36px;
  border: 1.5px solid rgba(201,168,76,0.5); border-radius: 50%;
  pointer-events: none; z-index: 9998;
  transform: translate(-50%,-50%);
  transition: transform 0.12s ease, width 0.25s, height 0.25s, border-color 0.25s;
}
body:has(.magnetic-btn:hover) .cursor-ring { width: 60px; height: 60px; border-color: var(--gold); }
@media (hover: none) { .cursor-dot, .cursor-ring { display: none; } }

/* ── PARTICLES ── */
.particles { position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.particle { position: absolute; border-radius: 50%; pointer-events: none; animation: particleRise linear infinite; opacity: 0; }
@keyframes particleRise { 0%{opacity:0;transform:translateY(100vh) rotate(0deg)} 10%{opacity:.5} 90%{opacity:.2} 100%{opacity:0;transform:translateY(-80px) rotate(360deg)} }

/* ── FLOATING WHATSAPP ── */
.whatsapp-float {
  position: fixed; bottom: 90px; right: 28px; z-index: 500;
  width: 56px; height: 56px; border-radius: 50%;
  background: linear-gradient(135deg,#25d366,#128c7e);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; color: #fff;
  box-shadow: 0 4px 20px rgba(37,211,102,0.4);
  transition: all var(--t); animation: waBounce 3s ease-in-out infinite;
}
.whatsapp-float:hover { transform: scale(1.1); box-shadow: 0 8px 32px rgba(37,211,102,0.6); }
.whatsapp-tooltip {
  position: absolute; right: 65px; white-space: nowrap;
  background: rgba(0,0,0,0.8); color: #fff;
  padding: 6px 12px; border-radius: 6px; font-size: 0.78rem;
  opacity: 0; transform: translateX(10px); transition: all var(--t); pointer-events: none;
}
.whatsapp-float:hover .whatsapp-tooltip { opacity: 1; transform: translateX(0); }
@keyframes waBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }

/* ── BACK TO TOP ── */
.back-to-top {
  position: fixed; bottom: 28px; right: 28px; z-index: 500;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--grad-gold); color: var(--purple-deep);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.9rem; box-shadow: 0 4px 20px rgba(201,168,76,0.35);
  opacity: 0; transform: translateY(20px); transition: all var(--t); pointer-events: none;
}
.back-to-top.visible { opacity: 1; transform: translateY(0); pointer-events: all; }
.back-to-top:hover { transform: translateY(-3px); box-shadow: 0 8px 28px rgba(201,168,76,0.5); }

/* ── TOAST NOTIFICATIONS ── */
.toast-container { position: fixed; top: 24px; right: 24px; z-index: 9990; display: flex; flex-direction: column; gap: 10px; }
.toast {
  background: var(--purple-card); border: 1px solid var(--border-bright);
  border-radius: var(--r); padding: 14px 20px;
  display: flex; align-items: center; gap: 12px;
  min-width: 280px; max-width: 360px;
  box-shadow: var(--shadow-card); animation: toastSlide 0.4s ease;
  font-size: 0.88rem;
}
.toast-icon { font-size: 1.3rem; }
.toast-close { margin-left: auto; color: var(--text-dim); cursor: pointer; font-size: 0.8rem; }
.toast.toast-success { border-color: rgba(34,197,94,0.4); }
.toast.toast-success .toast-icon { color: #22c55e; }
@keyframes toastSlide { from{opacity:0;transform:translateX(40px)} to{opacity:1;transform:translateX(0)} }

/* ── UTILITY ── */
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.section-pad { padding: 100px 0; }
.center { text-align: center; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }

.sec-label {
  font-size: 0.75rem; font-weight: 700; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 14px; display: inline-block;
}
.sec-title {
  font-family: var(--font-d); font-size: clamp(2rem,4vw,3rem);
  font-weight: 800; line-height: 1.15; color: var(--text); margin-bottom: 18px;
}
.sec-title em { font-style: italic; background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.sec-head { margin-bottom: 56px; }
.sec-desc { font-size: 1.05rem; color: var(--text-soft); line-height: 1.8; max-width: 580px; }
.sec-head.center .sec-desc { margin: 0 auto; }

/* ── BUTTONS ── */
.btn-gold {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 32px; border-radius: var(--r-pill);
  background: var(--grad-gold); color: var(--purple-deep);
  font-weight: 700; font-size: 0.95rem; letter-spacing: 0.02em;
  transition: all var(--t); position: relative; overflow: hidden;
  box-shadow: 0 4px 24px rgba(201,168,76,0.3);
}
.btn-gold:hover { transform: translateY(-2px); box-shadow: 0 8px 36px rgba(201,168,76,0.5); }
.btn-full { width: 100%; justify-content: center; }
.btn-outline-gold {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 28px; border-radius: var(--r-pill);
  border: 2px solid var(--gold); color: var(--gold);
  font-weight: 600; font-size: 0.9rem; transition: all var(--t);
}
.btn-outline-gold:hover { background: var(--gold); color: var(--purple-deep); }

.btn-hero-primary {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 16px 36px; border-radius: var(--r-pill);
  background: var(--grad-gold); color: var(--purple-deep);
  font-weight: 800; font-size: 1rem; position: relative; overflow: hidden;
  box-shadow: 0 6px 30px rgba(201,168,76,0.4);
  transition: all var(--t);
}
.btn-hero-primary:hover { transform: translateY(-3px); box-shadow: 0 12px 48px rgba(201,168,76,0.55); }
.btn-inner { display: flex; align-items: center; gap: 10px; position: relative; z-index: 1; }

.btn-hero-ghost {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 16px 36px; border-radius: var(--r-pill);
  border: 1.5px solid rgba(201,168,76,0.3); color: var(--text-soft);
  font-weight: 600; font-size: 1rem;
  backdrop-filter: blur(8px); background: rgba(255,255,255,0.03);
  transition: all var(--t);
}
.btn-hero-ghost:hover { border-color: var(--gold); color: var(--gold-light); background: rgba(201,168,76,0.06); transform: translateY(-3px); }

.pulse-btn { animation: pulsate 2.5s infinite; }
@keyframes pulsate { 0%,100%{box-shadow:0 6px 30px rgba(201,168,76,0.4)} 50%{box-shadow:0 6px 50px rgba(201,168,76,0.7),0 0 70px rgba(201,168,76,0.2)} }

/* ════════════════════════════════════════
   NAVBAR
════════════════════════════════════════ */
.navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  padding: 18px 0; transition: all 0.4s ease;
}
.navbar.scrolled {
  background: rgba(10,6,24,0.92); backdrop-filter: blur(24px) saturate(180%);
  padding: 12px 0; border-bottom: 1px solid var(--border);
  box-shadow: 0 4px 40px rgba(0,0,0,0.5);
}
.nav-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.nav-logo { display: flex; align-items: center; gap: 10px; }
.logo-moon { font-size: 1.7rem; background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1; }
.logo-text-wrap { display: flex; flex-direction: column; }
.logo-name { font-family: var(--font-d); font-size: 1.5rem; font-weight: 700; background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1; }
.logo-tagline { font-size: 0.6rem; color: var(--text-dim); letter-spacing: 0.12em; text-transform: uppercase; margin-top: 3px; }
.nav-links { display: flex; align-items: center; gap: 4px; }
.nav-link { padding: 8px 13px; font-size: 0.85rem; font-weight: 500; color: var(--text-soft); border-radius: var(--r-sm); transition: all var(--t); }
.nav-link:hover { color: var(--gold-light); background: rgba(201,168,76,0.07); }
.nav-link.active { color: var(--gold); }
.nav-cta-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 20px; border-radius: var(--r-pill);
  background: var(--grad-gold); color: var(--purple-deep);
  font-weight: 700; font-size: 0.85rem; transition: all var(--t);
}
.nav-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(201,168,76,0.4); }
.nav-right { display: flex; align-items: center; gap: 10px; }
.nav-login-btn {
  padding: 8px 16px; border-radius: var(--r-pill);
  border: 1px solid var(--border); color: var(--text-soft);
  font-size: 0.82rem; font-weight: 600; transition: all var(--t);
}
.nav-login-btn:hover { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,0.06); }
.hamburger { display: none; flex-direction: column; gap: 5px; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--gold); border-radius: 2px; transition: all var(--t); }

/* ════════════════════════════════════════
   HERO
════════════════════════════════════════ */
.hero {
  min-height: 100vh; position: relative; overflow: hidden;
  display: flex; align-items: center;
  background: radial-gradient(ellipse at 15% 50%, rgba(90,50,180,0.25) 0%,transparent 55%),
              radial-gradient(ellipse at 85% 20%, rgba(180,120,20,0.1) 0%,transparent 45%),
              linear-gradient(180deg,var(--purple-deep) 0%,#0d0a1a 100%);
}
.hero-bg-video { position: absolute; inset: 0; z-index: 0; }
.hero-cosmic-bg { position: absolute; inset: 0; background: url('../images/cosmic-bg.jpg') center/cover no-repeat; opacity: 0.08; }
.hero-gradient-orb { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; animation: orbFloat ease-in-out infinite; }
.orb1 { width: 500px; height: 500px; left: -100px; top: -50px; background: radial-gradient(circle,rgba(120,60,200,0.25),transparent 70%); animation-duration: 12s; }
.orb2 { width: 400px; height: 400px; right: -80px; top: 30%; background: radial-gradient(circle,rgba(201,168,76,0.12),transparent 70%); animation-duration: 16s; animation-delay: -4s; }
.orb3 { width: 300px; height: 300px; left: 40%; bottom: -50px; background: radial-gradient(circle,rgba(80,40,160,0.2),transparent 70%); animation-duration: 10s; animation-delay: -8s; }
@keyframes orbFloat { 0%,100%{transform:translate(0,0) scale(1)} 33%{transform:translate(30px,-20px) scale(1.05)} 66%{transform:translate(-20px,15px) scale(0.97)} }

.hero-grid {
  position: relative; z-index: 2;
  max-width: 1200px; margin: 0 auto; padding: 130px 24px 80px;
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: center; gap: 60px; width: 100%;
}
.hero-content { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.hero-badge-wrap { margin-bottom: 24px; }
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 18px; border-radius: var(--r-pill);
  background: rgba(201,168,76,0.08); border: 1px solid var(--border-bright);
  font-size: 0.78rem; font-weight: 600; color: var(--gold-light); letter-spacing: 0.06em;
  position: relative; overflow: hidden;
}
.badge-pulse {
  width: 8px; height: 8px; border-radius: 50%; background: var(--gold);
  animation: badgePulse 2s infinite; flex-shrink: 0;
}
@keyframes badgePulse { 0%,100%{box-shadow:0 0 0 0 rgba(201,168,76,0.6)} 50%{box-shadow:0 0 0 6px rgba(201,168,76,0)} }
.hero-title {
  font-family: var(--font-d); font-size: clamp(2.6rem,5vw,4rem);
  font-weight: 900; line-height: 1.12; margin-bottom: 20px;
  display: flex; flex-direction: column;
}
.title-line { display: block; opacity: 0; transform: translateY(24px); animation: titleIn 0.7s forwards; }
.title-line:nth-child(1) { animation-delay: 0.1s; }
.title-line:nth-child(2) { animation-delay: 0.25s; }
.title-line:nth-child(3) { animation-delay: 0.4s; }
@keyframes titleIn { to { opacity: 1; transform: translateY(0); } }
.gold-line { background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.hero-sub { font-size: 1.05rem; color: var(--text-soft); line-height: 1.85; margin-bottom: 32px; max-width: 500px; opacity: 0; animation: titleIn 0.7s 0.5s forwards; }
.hero-stats-row { display: flex; align-items: center; gap: 24px; margin-bottom: 36px; flex-wrap: wrap; opacity: 0; animation: titleIn 0.7s 0.65s forwards; }
.hstat { display: flex; flex-direction: column; align-items: center; }
.hstat-n { font-family: var(--font-d); font-size: 2rem; font-weight: 800; background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1; }
.hstat-s { font-size: 1.4rem; font-weight: 800; color: var(--gold); line-height: 1; margin-top: -4px; }
.hstat p { font-size: 0.7rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.1em; margin-top: 3px; }
.hstat-sep { width: 1px; height: 40px; background: var(--border); }
.hero-btns { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 20px; opacity: 0; animation: titleIn 0.7s 0.8s forwards; }
.hero-guarantee { font-size: 0.78rem; color: var(--text-dim); display: flex; align-items: center; gap: 7px; opacity: 0; animation: titleIn 0.7s 0.95s forwards; }
.hero-guarantee i { color: var(--gold); }

/* HERO PHOTO */
.hero-photo-side {
  position: relative; display: flex; align-items: center; justify-content: center;
  opacity: 0; animation: titleIn 0.8s 0.3s forwards;
}
.photo-glow-ring {
  position: absolute; width: 480px; height: 480px; border-radius: 50%;
  background: radial-gradient(circle,rgba(201,168,76,0.12),transparent 65%);
  animation: glowPulse 4s ease-in-out infinite;
}
@keyframes glowPulse { 0%,100%{transform:scale(1);opacity:.7} 50%{transform:scale(1.08);opacity:1} }
.photo-orbit {
  position: absolute; border-radius: 50%;
  border: 1px solid rgba(201,168,76,0.18); top: 50%; left: 50%;
}
.orbit1 { width: 460px; height: 460px; border-style: dashed; transform: translate(-50%,-50%); animation: spin 35s linear infinite; }
.orbit2 { width: 380px; height: 380px; transform: translate(-50%,-50%); animation: spin 22s linear infinite reverse; border-color: rgba(201,168,76,0.1); }
@keyframes spin { from{transform:translate(-50%,-50%) rotate(0deg)} to{transform:translate(-50%,-50%) rotate(360deg)} }
.photo-frame {
  position: relative; z-index: 2;
  width: 320px; height: 420px;
  border-radius: 28px; overflow: hidden;
  border: 2px solid rgba(201,168,76,0.45);
  box-shadow: 0 24px 80px rgba(0,0,0,0.6), 0 0 50px rgba(201,168,76,0.2), inset 0 0 40px rgba(201,168,76,0.04);
  animation: heroFloat 6s ease-in-out infinite;
}
@keyframes heroFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-16px)} }
.hero-img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.photo-float-badge {
  position: absolute; z-index: 5;
  background: rgba(10,6,24,0.88); border: 1px solid var(--border-bright);
  border-radius: 12px; padding: 10px 14px;
  display: flex; align-items: center; gap: 10px;
  backdrop-filter: blur(16px); box-shadow: var(--shadow-card);
}
.photo-float-badge i { font-size: 1.2rem; background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.photo-float-badge strong { display: block; color: var(--gold-light); font-size: 0.88rem; font-weight: 700; line-height: 1.2; }
.photo-float-badge span { font-size: 0.68rem; color: var(--text-dim); }
.fb1 { bottom: 50px; left: -30px; animation: floatBadge1 4s ease-in-out infinite; }
.fb2 { top: 60px; right: -30px; animation: floatBadge2 5s ease-in-out infinite; }
.fb3 { bottom: 140px; right: -24px; animation: floatBadge1 6s ease-in-out infinite; animation-delay: 2s; }
@keyframes floatBadge1 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes floatBadge2 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }
.zodiac-floaters { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.zodiac-floaters span {
  position: absolute; left: var(--x); top: var(--y);
  font-size: 1.1rem; color: rgba(201,168,76,0.55);
  animation: zodiacFloat var(--d) ease-in-out infinite;
  text-shadow: 0 0 10px rgba(201,168,76,0.4);
}
@keyframes zodiacFloat { 0%,100%{transform:translateY(0) rotate(0deg);opacity:.5} 50%{transform:translateY(-14px) rotate(12deg);opacity:.9} }
.hero-scroll-hint {
  position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  font-size: 0.7rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.15em;
  z-index: 2; opacity: 0; animation: titleIn 1s 1.5s forwards;
}
.scroll-line { width: 1px; height: 48px; background: linear-gradient(to bottom,var(--gold),transparent); animation: scrollAnim 2s ease-in-out infinite; }
@keyframes scrollAnim { 0%,100%{opacity:.3;transform:scaleY(1)} 50%{opacity:1;transform:scaleY(1.2)} }

/* ════════════════════════════════════════
   MARQUEE
════════════════════════════════════════ */
.marquee-strip {
  background: rgba(201,168,76,0.06); border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border); padding: 14px 0; overflow: hidden;
}
.marquee-track {
  display: flex; gap: 48px; width: max-content;
  animation: marqueeScroll 25s linear infinite;
}
.marquee-track span { font-size: 0.82rem; font-weight: 600; color: var(--text-soft); white-space: nowrap; letter-spacing: 0.05em; }
.marquee-track span:nth-child(even) { color: var(--gold); }
@keyframes marqueeScroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ════════════════════════════════════════
   SERVICES
════════════════════════════════════════ */
.services { background: linear-gradient(180deg,var(--purple-dark),rgba(17,13,32,0.4)); }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(265px,1fr)); gap: 20px; }
.svc-card {
  background: var(--purple-card); border: 1px solid var(--border);
  border-radius: var(--r); padding: 32px 26px; position: relative;
  overflow: hidden; transition: all var(--t); cursor: default;
}
.svc-glow {
  position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s;
  background: radial-gradient(circle at 50% 50%,rgba(201,168,76,0.07),transparent 70%);
  pointer-events: none;
}
.svc-card:hover { transform: translateY(-8px) scale(1.01); border-color: var(--border-bright); box-shadow: var(--shadow-gold); background: var(--purple-hover); }
.svc-card:hover .svc-glow { opacity: 1; }
.svc-card::before { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:var(--grad-gold); transform:scaleX(0); transform-origin:left; transition:transform 0.4s; }
.svc-card:hover::before { transform:scaleX(1); }
.featured-svc { border-color: rgba(201,168,76,0.4); background: linear-gradient(135deg,rgba(201,168,76,0.08),var(--purple-card)); }
.svc-badge { position:absolute; top:14px; right:14px; background:var(--grad-gold); color:var(--purple-deep); font-size:0.68rem; font-weight:800; padding:4px 12px; border-radius:var(--r-pill); letter-spacing:.04em; }
.svc-icon { font-size:2.4rem; margin-bottom:16px; filter:drop-shadow(0 0 12px rgba(201,168,76,0.3)); display:inline-block; transition:transform 0.3s; }
.svc-card:hover .svc-icon { transform: scale(1.1) rotate(-5deg); }
.svc-card h3 { font-family:var(--font-d); font-size:1.2rem; font-weight:600; color:var(--text); margin-bottom:10px; }
.svc-card p { font-size:0.87rem; color:var(--text-soft); line-height:1.7; margin-bottom:20px; }
.svc-cta { display:inline-flex; align-items:center; gap:7px; font-size:0.82rem; font-weight:600; color:var(--gold); transition:all var(--t); }
.svc-cta:hover { gap:12px; color:var(--gold-light); }

/* ════════════════════════════════════════
   REELS / VIDEO SECTION
════════════════════════════════════════ */
.reels-section {
  background: linear-gradient(135deg,#1a0a35,#0a0618,#14102a);
  position: relative; overflow: hidden;
}
.reels-section::before {
  content:''; position:absolute; top:-100px; left:50%; transform:translateX(-50%);
  width:700px; height:700px;
  background:radial-gradient(circle,rgba(201,168,76,0.06),transparent 65%); pointer-events:none;
}
.reel-filters { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-bottom:36px; }
.reel-filter-btn {
  padding:8px 20px; border-radius:var(--r-pill);
  border:1px solid var(--border); color:var(--text-soft);
  font-size:0.82rem; font-weight:600; transition:all var(--t);
  background:rgba(255,255,255,0.03);
}
.reel-filter-btn:hover, .reel-filter-btn.active {
  background:var(--grad-gold); color:var(--purple-deep); border-color:transparent;
}
.reels-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; margin-bottom:48px;
}
.reels-loading { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:14px; padding:60px 0; color:var(--text-dim); }
.reel-spinner { width:32px; height:32px; border:2px solid var(--border); border-top-color:var(--gold); border-radius:50%; animation:spin2 0.7s linear infinite; }
@keyframes spin2 { to{transform:rotate(360deg)} }
.reel-card {
  background:var(--purple-card); border:1px solid var(--border); border-radius:var(--r);
  overflow:hidden; transition:all var(--t); cursor:pointer;
}
.reel-card:hover { transform:translateY(-6px); border-color:var(--border-bright); box-shadow:var(--shadow-gold); }
.reel-video-wrap { position:relative; aspect-ratio:9/16; max-height:400px; background:#000; overflow:hidden; }
.reel-video-wrap video, .reel-video-wrap iframe { width:100%; height:100%; object-fit:cover; border:none; }
.reel-play-overlay {
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:12px;
  background:rgba(0,0,0,0.45); transition:opacity 0.3s;
}
.reel-play-overlay:hover { opacity:0; }
.reel-play-btn {
  width:64px; height:64px; border-radius:50%;
  background:rgba(201,168,76,0.85); display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; color:var(--purple-deep);
  transition:all var(--t); box-shadow:0 0 30px rgba(201,168,76,0.4);
}
.reel-play-btn:hover { transform:scale(1.1); background:var(--gold); }
.reel-meta { padding:16px 18px; }
.reel-cat { font-size:0.68rem; font-weight:700; color:var(--gold); text-transform:uppercase; letter-spacing:.1em; margin-bottom:6px; }
.reel-title { font-family:var(--font-d); font-size:1rem; font-weight:600; color:var(--text); margin-bottom:8px; }
.reel-desc { font-size:0.82rem; color:var(--text-soft); line-height:1.6; margin-bottom:12px; }
.reel-stats { display:flex; gap:16px; }
.reel-stat { display:flex; align-items:center; gap:5px; font-size:0.78rem; color:var(--text-dim); }
.reel-stat i { color:var(--gold); font-size:0.75rem; }
.reel-like-btn { background:none; border:none; cursor:pointer; display:flex; align-items:center; gap:5px; font-size:0.78rem; color:var(--text-dim); transition:color var(--t); }
.reel-like-btn:hover, .reel-like-btn.liked { color:var(--gold); }
.reel-like-btn.liked i { color:#e25555; }
.yt-thumb-wrap { position:relative; aspect-ratio:16/9; overflow:hidden; cursor:pointer; }
.yt-thumb-wrap img { width:100%; height:100%; object-fit:cover; transition:transform 0.4s; }
.yt-thumb-wrap:hover img { transform:scale(1.05); }
.yt-play-over { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0.35); }
.yt-play-over .reel-play-btn { width:56px; height:56px; font-size:1.2rem; }

/* UPLOAD SECTION */
.upload-reel-section { text-align:center; }
.upload-reel-toggle {
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 28px; border-radius:var(--r-pill);
  border:2px dashed var(--border-bright); color:var(--gold);
  font-size:0.88rem; font-weight:600; transition:all var(--t);
  background:rgba(201,168,76,0.04);
}
.upload-reel-toggle:hover { background:rgba(201,168,76,0.1); border-color:var(--gold); transform:scale(1.02); }
.upload-reel-form {
  margin-top:24px; background:var(--purple-card); border:1px solid var(--border-bright);
  border-radius:var(--r); padding:36px; text-align:left; max-width:720px; margin-left:auto; margin-right:auto;
}
.upload-reel-form h3 { font-family:var(--font-d); font-size:1.4rem; color:var(--text); margin-bottom:8px; display:flex; align-items:center; gap:10px; }
.upload-note { font-size:0.88rem; color:var(--text-soft); margin-bottom:24px; line-height:1.7; }
.upload-instructions { margin-top:24px; padding:20px; background:rgba(201,168,76,0.04); border-radius:var(--r-sm); border:1px solid var(--border); }
.upload-instructions h4 { font-size:0.88rem; color:var(--gold-light); margin-bottom:10px; display:flex; align-items:center; gap:8px; }
.upload-instructions ol { padding-left:18px; }
.upload-instructions ol li { font-size:0.83rem; color:var(--text-soft); line-height:1.9; }

/* ════════════════════════════════════════
   ABOUT
════════════════════════════════════════ */
.about { background:linear-gradient(180deg,rgba(17,13,32,0.5),var(--purple-dark)); }
.about-grid { display:grid; grid-template-columns:1fr 1.15fr; gap:72px; align-items:center; }
.about-photo-wrap { position:relative; }
.about-photo-frame { position:relative; border-radius:24px; overflow:visible; }
.about-photo { width:100%; max-width:400px; height:500px; object-fit:cover; object-position:top center; border-radius:24px; display:block; border:2px solid rgba(201,168,76,0.4); box-shadow:0 30px 80px rgba(0,0,0,0.55), 0 0 40px rgba(201,168,76,0.12); }
.ap-corner { position:absolute; font-size:1.3rem; color:var(--gold); opacity:.7; z-index:3; }
.ap-corner.tl{top:-16px;left:-16px} .ap-corner.tr{top:-16px;right:-16px}
.ap-corner.bl{bottom:-16px;left:-16px} .ap-corner.br{bottom:-16px;right:-16px}
.about-quote-card { margin-top:24px; padding:18px 22px; background:rgba(201,168,76,0.06); border-left:3px solid var(--gold); border-radius:0 var(--r-sm) var(--r-sm) 0; }
.about-quote-card span { display:block; font-family:var(--font-e); font-size:1.05rem; font-style:italic; color:var(--text-soft); line-height:1.7; }
.about-quote-card cite { display:block; margin-top:8px; font-size:0.82rem; color:var(--gold); font-weight:600; }
.about-p { font-size:0.95rem; color:var(--text-soft); line-height:1.9; margin-bottom:18px; }
.about-p strong { color:var(--gold-light); }
.achievements-list { display:flex; flex-direction:column; gap:14px; padding:24px; background:rgba(201,168,76,0.05); border:1px solid var(--border); border-radius:var(--r); margin:24px 0; }
.ach-item { display:flex; align-items:flex-start; gap:14px; }
.ach-icon { width:38px; height:38px; background:rgba(201,168,76,0.12); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ach-icon i { font-size:0.85rem; background:var(--grad-gold); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.ach-item strong { display:block; color:var(--text); font-size:0.93rem; margin-bottom:2px; }
.ach-item span { font-size:0.8rem; color:var(--text-dim); }
.about-closing { font-size:0.95rem; color:var(--text-soft); line-height:1.9; margin-bottom:28px; }
.about-closing strong { color:var(--gold-light); }

/* ════════════════════════════════════════
   BENTO GRID (LIFE AREAS)
════════════════════════════════════════ */
.areas-section { background:linear-gradient(135deg,#14082a,#0a0618,#1a0e30); position:relative; overflow:hidden; }
.bento-grid { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:120px; gap:14px; }
.bento-item {
  background:rgba(255,255,255,0.03); border:1px solid rgba(201,168,76,0.1);
  border-radius:var(--r); display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:10px;
  transition:all var(--t); cursor:default; padding:16px;
}
.bento-item:hover { border-color:var(--border-bright); background:rgba(201,168,76,0.07); transform:translateY(-4px) scale(1.02); box-shadow:0 8px 30px rgba(201,168,76,0.15); }
.bi-icon { font-size:2rem; filter:drop-shadow(0 0 8px rgba(201,168,76,0.3)); display:block; transition:transform 0.3s; }
.bento-item:hover .bi-icon { transform:scale(1.15); }
.bento-item span { font-size:0.78rem; color:var(--text-soft); font-weight:500; text-align:center; line-height:1.3; }
.bi-large { grid-column:span 2; background:rgba(201,168,76,0.06); border-color:rgba(201,168,76,0.2); }
.bi-large .bi-icon { font-size:2.8rem; }
.bi-large span { font-size:0.9rem; }
.bi-tall { grid-row:span 2; }
.bi-wide { grid-column:span 2; }
.bi-large-2 { grid-column:span 2; background:rgba(120,60,200,0.06); }

/* ════════════════════════════════════════
   TESTIMONIALS
════════════════════════════════════════ */
.testimonials { background:linear-gradient(180deg,rgba(17,13,32,0.5),var(--purple-dark)); }
.testi-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:22px; }
.testi-card {
  background:var(--purple-card); border:1px solid var(--border);
  border-radius:var(--r); padding:28px 24px; position:relative;
  transition:all var(--t);
}
.testi-card::before { content:'"'; position:absolute; top:14px; left:20px; font-family:var(--font-d); font-size:5rem; color:rgba(201,168,76,0.08); line-height:1; pointer-events:none; }
.testi-card:hover { transform:translateY(-5px); border-color:var(--border-bright); box-shadow:var(--shadow-gold); }
.featured-testi { border-color:rgba(201,168,76,0.35); background:linear-gradient(135deg,rgba(201,168,76,0.07),var(--purple-card)); }
.testi-stars { color:var(--gold); letter-spacing:3px; margin-bottom:14px; }
.testi-card p { font-size:0.88rem; color:var(--text-soft); line-height:1.85; margin-bottom:20px; font-style:italic; }
.testi-author { display:flex; align-items:center; gap:12px; }
.ta-avatar { width:42px; height:42px; border-radius:50%; background:var(--grad-gold); display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--purple-deep); flex-shrink:0; }
.testi-author strong { display:block; font-size:0.88rem; color:var(--text); }
.testi-author span { font-size:0.75rem; color:var(--text-dim); }

/* ════════════════════════════════════════
   PRICING
════════════════════════════════════════ */
.pricing { background:linear-gradient(180deg,var(--purple-dark),var(--purple-deep)); }
.pricing-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; align-items:start; }
.price-card { background:var(--purple-card); border:1px solid var(--border); border-radius:var(--r); padding:36px 28px; transition:all var(--t); position:relative; }
.price-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-gold); }
.price-featured { border-color:rgba(201,168,76,0.5); background:linear-gradient(135deg,rgba(201,168,76,0.1),var(--purple-card)); box-shadow:0 8px 60px rgba(201,168,76,0.18); transform:scale(1.03); }
.price-featured:hover { transform:scale(1.03) translateY(-6px); }
.pc-popular { position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:var(--grad-gold); color:var(--purple-deep); font-size:0.72rem; font-weight:800; padding:5px 18px; border-radius:var(--r-pill); white-space:nowrap; }
.pc-icon { font-size:2.4rem; margin-bottom:12px; display:block; }
.price-card h3 { font-family:var(--font-d); font-size:1.3rem; color:var(--text); margin-bottom:16px; }
.pc-price { display:flex; align-items:baseline; gap:6px; margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid var(--border); }
.pc-price span { font-family:var(--font-d); font-size:2.8rem; font-weight:900; background:var(--grad-gold); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.pc-price small { font-size:0.85rem; color:var(--text-dim); }
.price-card ul { display:flex; flex-direction:column; gap:10px; margin-bottom:28px; }
.price-card ul li { display:flex; align-items:center; gap:9px; font-size:0.87rem; color:var(--text-soft); }
.price-card ul li i { color:var(--gold); font-size:0.78rem; }
.pc-btn { display:block; text-align:center; padding:13px 24px; border-radius:var(--r-pill); border:2px solid var(--gold); color:var(--gold); font-weight:700; font-size:0.9rem; transition:all var(--t); }
.pc-btn:hover { background:var(--gold); color:var(--purple-deep); }
.pc-btn-gold { background:var(--grad-gold); color:var(--purple-deep); border-color:transparent; box-shadow:0 4px 20px rgba(201,168,76,0.3); }
.pc-btn-gold:hover { box-shadow:0 8px 36px rgba(201,168,76,0.5); background:var(--grad-gold-h); }

/* ════════════════════════════════════════
   PAYMENT SECTION
════════════════════════════════════════ */
.payment-section {
  padding: 100px 0;
  background: linear-gradient(180deg, var(--purple-deep), #080510);
  border-top: 1px solid var(--border);
}
.pay-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; margin-bottom:32px; }
.pay-card {
  background:var(--purple-card); border:1px solid var(--border); border-radius:var(--r);
  padding:28px 22px; display:flex; flex-direction:column; gap:14px; transition:all var(--t);
}
.pay-card:hover { border-color:var(--border-bright); transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,0,0,0.3); }
.pay-logo { display:flex; align-items:center; gap:10px; margin-bottom:4px; }
.pay-logo span { font-size:1.2rem; font-weight:800; }
.pay-logo i { font-size:1.8rem; }
.pay-logo.paypal i { color:#003087; background:#fff; border-radius:4px; padding:2px 5px; font-size:1.4rem; }
.pay-logo.paypal span { background:linear-gradient(135deg,#003087,#009cde); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.venmo-v { display:inline-flex; width:34px; height:34px; background:#3d95ce; color:#fff; border-radius:7px; align-items:center; justify-content:center; font-weight:900; font-size:1.1rem; }
.pay-logo.venmo span { color:#3d95ce; font-weight:900; }
.zelle-z { display:inline-flex; width:34px; height:34px; background:linear-gradient(135deg,#6e1cef,#a843f9); color:#fff; border-radius:50%; align-items:center; justify-content:center; font-weight:900; font-size:1.1rem; }
.pay-logo.zelle span { background:linear-gradient(135deg,#6e1cef,#a843f9); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.pay-logo.card-pay i { color:var(--gold); }
.pay-logo.card-pay span { color:var(--text); }
.pay-card p { font-size:0.83rem; color:var(--text-soft); line-height:1.7; }
.pay-detail { display:flex; flex-direction:column; gap:3px; padding:10px 14px; background:rgba(255,255,255,0.03); border-radius:var(--r-sm); border:1px dashed var(--border); }
.pay-detail span { font-size:0.7rem; color:var(--text-dim); text-transform:uppercase; letter-spacing:.08em; }
.pay-detail strong { font-size:0.9rem; color:var(--gold-light); }
.card-brands { display:flex; gap:8px; align-items:center; }
.cb { padding:4px 10px; border-radius:4px; font-size:0.7rem; font-weight:800; letter-spacing:.05em; }
.cb.visa { background:#1a1f71; color:#fff; }
.cb.mc { background:linear-gradient(135deg,#eb001b,#f79e1b); color:#fff; }
.cb.amex { background:#007bc1; color:#fff; }
.pay-btn {
  display:flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 20px; border-radius:var(--r-pill); font-weight:700; font-size:0.85rem;
  transition:all var(--t); cursor:pointer; text-align:center;
}
.paypal-btn { background:#003087; color:#fff; }
.paypal-btn:hover { background:#002060; transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,48,135,0.4); }
.venmo-btn { background:#3d95ce; color:#fff; }
.venmo-btn:hover { background:#2c7ab5; transform:translateY(-2px); }
.venmo-v-sm { display:inline-flex; width:20px; height:20px; background:#fff; color:#3d95ce; border-radius:4px; align-items:center; justify-content:center; font-weight:900; font-size:0.75rem; }
.zelle-btn { background:linear-gradient(135deg,#6e1cef,#a843f9); color:#fff; cursor:default; }
.zelle-z-sm { display:inline-flex; width:20px; height:20px; background:rgba(255,255,255,0.2); color:#fff; border-radius:50%; align-items:center; justify-content:center; font-weight:900; font-size:0.75rem; }
.card-btn { background:var(--grad-gold); color:var(--purple-deep); }
.card-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(201,168,76,0.4); }
.pay-security { display:flex; justify-content:center; flex-wrap:wrap; gap:28px; padding:20px; border:1px solid var(--border); border-radius:var(--r); background:rgba(201,168,76,0.03); }
.pay-security span { display:flex; align-items:center; gap:8px; font-size:0.82rem; color:var(--text-soft); }
.pay-security i { color:var(--gold); }

/* ════════════════════════════════════════
   BOOKING SECTION (TABS)
════════════════════════════════════════ */
.booking-section { background:linear-gradient(135deg,rgba(80,40,160,0.1),transparent 50%), linear-gradient(180deg,var(--purple-deep),var(--purple-dark)); }
.booking-tabs-wrap { background:var(--purple-card); border:1px solid var(--border); border-radius:20px; overflow:hidden; }
.booking-tab-nav { display:flex; background:rgba(0,0,0,0.3); border-bottom:1px solid var(--border); overflow-x:auto; }
.btab {
  flex:1; min-width:150px; padding:18px 20px; font-size:0.88rem; font-weight:600;
  color:var(--text-soft); display:flex; align-items:center; justify-content:center; gap:8px;
  border-bottom:3px solid transparent; transition:all var(--t); white-space:nowrap;
}
.btab:hover { color:var(--gold-light); background:rgba(201,168,76,0.05); }
.btab.active { color:var(--gold); border-bottom-color:var(--gold); background:rgba(201,168,76,0.06); }
.btab-content { display:none; padding:40px 36px; }
.btab-content.active { display:block; }
.booking-two-col { display:grid; grid-template-columns:1.2fr 0.8fr; gap:48px; align-items:start; }
.booking-form-col h3 { font-family:var(--font-d); font-size:1.4rem; color:var(--text); margin-bottom:8px; display:flex; align-items:center; gap:10px; }
.form-note { font-size:0.85rem; color:var(--text-soft); margin-bottom:24px; line-height:1.6; }

/* FORM ELEMENTS */
.form-group { margin-bottom:18px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group label { display:block; font-size:0.78rem; font-weight:700; color:var(--text-soft); text-transform:uppercase; letter-spacing:.09em; margin-bottom:7px; }
.form-group input, .form-group select, .form-group textarea {
  width:100%; padding:12px 16px;
  background:rgba(255,255,255,0.04); border:1px solid rgba(201,168,76,0.18);
  border-radius:var(--r-sm); color:var(--text); font-family:var(--font-b);
  font-size:0.9rem; transition:all var(--t); outline:none; appearance:none;
}
.form-group select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='%23c9a84c' d='M6 8L0 0h12z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:38px; cursor:pointer; }
.form-group select option { background:var(--purple-card); color:var(--text); }
.form-group input::placeholder, .form-group textarea::placeholder { color:var(--text-dim); }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--gold); background:rgba(201,168,76,0.05); box-shadow:0 0 0 3px rgba(201,168,76,0.1); }
.form-group label.focused { color:var(--gold); }
.form-group textarea { resize:vertical; min-height:80px; }
.pass-wrap { position:relative; }
.pass-wrap input { padding-right:44px; }
.pass-toggle { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--text-dim); font-size:0.85rem; transition:color var(--t); }
.pass-toggle:hover { color:var(--gold); }
.form-privacy { font-size:0.75rem; color:var(--text-dim); text-align:center; margin-top:12px; display:flex; align-items:center; justify-content:center; gap:6px; }
.form-privacy i { color:var(--gold); }

/* BOOKING INFO CARDS */
.booking-info-card { background:rgba(0,0,0,0.2); border:1px solid var(--border); border-radius:var(--r); padding:22px; }
.booking-info-card h4 { font-size:0.92rem; font-weight:700; color:var(--gold-light); margin-bottom:14px; display:flex; align-items:center; gap:8px; }
.booking-perks { display:flex; flex-direction:column; gap:10px; }
.booking-perks li { display:flex; align-items:center; gap:9px; font-size:0.85rem; color:var(--text-soft); }
.booking-perks li i { color:var(--gold); font-size:0.75rem; }
.mini-steps { display:flex; flex-direction:column; gap:12px; }
.ms { display:flex; align-items:flex-start; gap:12px; }
.ms span { width:26px; height:26px; border-radius:50%; background:var(--grad-gold); color:var(--purple-deep); display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:800; flex-shrink:0; }
.ms p { font-size:0.84rem; color:var(--text-soft); line-height:1.5; padding-top:4px; }
.booking-contact-card { background:rgba(201,168,76,0.05); border:1px solid var(--border); border-radius:var(--r); padding:18px 20px; }
.booking-contact-card p { display:flex; align-items:center; gap:10px; font-size:0.85rem; color:var(--text-soft); margin-bottom:10px; }
.booking-contact-card p i { color:var(--gold); width:16px; text-align:center; }
.booking-contact-card strong { color:var(--gold-light); }
.mini-testi { font-size:0.84rem; font-style:italic; color:var(--text-soft); line-height:1.7; }
.prep-list { display:flex; flex-direction:column; gap:10px; }
.prep-list li { display:flex; align-items:center; gap:10px; font-size:0.85rem; color:var(--text-soft); }
.prep-list li i { color:var(--gold); width:16px; text-align:center; }

/* AUTH CENTER */
.auth-center-wrap { max-width:440px; margin:0 auto; }
.auth-card { text-align:center; }
.auth-icon { font-size:3rem; margin-bottom:16px; }
.auth-card h3 { font-family:var(--font-d); font-size:1.6rem; color:var(--text); margin-bottom:8px; }
.auth-card > p { font-size:0.9rem; color:var(--text-soft); margin-bottom:24px; }
.auth-card form { text-align:left; }
.auth-switch { font-size:0.83rem; color:var(--text-dim); margin-top:16px; text-align:center; }
.link-btn { color:var(--gold); font-size:0.83rem; font-weight:600; text-decoration:underline; background:none; border:none; cursor:pointer; }
.link-btn:hover { color:var(--gold-light); }
.logged-in-panel { display:flex; flex-direction:column; align-items:center; gap:12px; }
.welcome-back { text-align:center; padding:24px; background:rgba(201,168,76,0.06); border-radius:var(--r); border:1px solid var(--border); width:100%; }
.welcome-back i { font-size:2rem; background:var(--grad-gold); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:8px; display:block; }
.welcome-back h4 { font-family:var(--font-d); font-size:1.3rem; color:var(--gold-light); margin-bottom:6px; }
.welcome-back p { font-size:0.88rem; color:var(--text-soft); }

/* BOOKING SUCCESS */
.booking-success { text-align:center; padding:60px 40px; }
.bs-icon { font-size:5rem; display:block; margin-bottom:20px; animation:float 3s ease-in-out infinite; }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }
.booking-success h3 { font-family:var(--font-d); font-size:2rem; color:var(--gold-light); margin-bottom:14px; }
.booking-success p { font-size:1rem; color:var(--text-soft); line-height:1.8; max-width:500px; margin:0 auto; }
.bs-details { margin-top:24px; display:inline-block; padding:20px 28px; background:rgba(201,168,76,0.07); border:1px solid var(--border-bright); border-radius:var(--r); text-align:left; }
.bs-details p { font-size:0.88rem; color:var(--text-soft); display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.bs-details i { color:var(--gold); width:16px; }

/* AUTH MODAL */
.modal-overlay { position:fixed; inset:0; z-index:9000; background:rgba(0,0,0,0.7); backdrop-filter:blur(8px); display:flex; align-items:center; justify-content:center; animation:fadeIn 0.3s ease; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.modal-box { background:var(--purple-card); border:1px solid var(--border-bright); border-radius:20px; padding:40px; max-width:420px; width:90%; position:relative; text-align:center; box-shadow:0 40px 80px rgba(0,0,0,0.6); animation:modalSlide 0.4s ease; }
@keyframes modalSlide { from{opacity:0;transform:translateY(-30px) scale(0.95)} to{opacity:1;transform:translateY(0) scale(1)} }
.modal-close { position:absolute; top:14px; right:14px; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,0.05); color:var(--text-dim); display:flex; align-items:center; justify-content:center; transition:all var(--t); }
.modal-close:hover { background:rgba(201,168,76,0.15); color:var(--gold); }
.modal-icon { font-size:3rem; margin-bottom:14px; }
.modal-box h3 { font-family:var(--font-d); font-size:1.5rem; color:var(--text); margin-bottom:6px; }
.modal-box > p { font-size:0.88rem; color:var(--text-soft); margin-bottom:24px; }
.modal-box form { text-align:left; }

/* ════════════════════════════════════════
   FAQ
════════════════════════════════════════ */
.faq-section { background:linear-gradient(180deg,var(--purple-dark),var(--purple-deep)); }
.faq-wrap { max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:10px; }
.faq-item { background:var(--purple-card); border:1px solid var(--border); border-radius:var(--r); overflow:hidden; transition:border-color var(--t); }
.faq-item.open { border-color:var(--border-bright); }
.faq-q { width:100%; padding:20px 22px; display:flex; align-items:center; justify-content:space-between; gap:14px; font-size:0.93rem; font-weight:600; color:var(--text); text-align:left; transition:all var(--t); }
.faq-q:hover { color:var(--gold-light); background:rgba(201,168,76,0.04); }
.faq-q i { color:var(--gold); font-size:0.88rem; flex-shrink:0; transition:transform var(--t); }
.faq-item.open .faq-q i { transform:rotate(180deg); }
.faq-a { max-height:0; overflow:hidden; transition:max-height 0.4s ease; }
.faq-a.open { max-height:300px; }
.faq-a p { padding:0 22px 22px; font-size:0.88rem; color:var(--text-soft); line-height:1.85; }

/* ════════════════════════════════════════
   FINAL CTA
════════════════════════════════════════ */
.final-cta-section {
  padding:100px 0; text-align:center; position:relative; overflow:hidden;
  background:radial-gradient(ellipse at 50% 50%,rgba(201,168,76,0.07),transparent 65%),
             linear-gradient(135deg,#1a0835,#080510);
}
.cta-orbs { position:absolute; inset:0; pointer-events:none; }
.cta-orb { position:absolute; border-radius:50%; filter:blur(70px); }
.co1 { width:400px; height:400px; top:-100px; left:-50px; background:radial-gradient(circle,rgba(120,50,200,0.2),transparent); animation:orbFloat 12s ease-in-out infinite; }
.co2 { width:300px; height:300px; bottom:-50px; right:-50px; background:radial-gradient(circle,rgba(201,168,76,0.1),transparent); animation:orbFloat 16s ease-in-out infinite reverse; }
.fcta-content { position:relative; z-index:1; max-width:680px; margin:0 auto; }
.fcta-symbol { font-size:3.5rem; display:block; margin-bottom:24px; filter:drop-shadow(0 0 24px rgba(201,168,76,0.6)); animation:float 4s ease-in-out infinite; }
.final-cta-section h2 { font-family:var(--font-d); font-size:clamp(2rem,4vw,3rem); font-weight:800; color:var(--text); line-height:1.2; margin-bottom:20px; }
.final-cta-section h2 em { font-style:italic; background:var(--grad-gold); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.final-cta-section p { font-size:1.05rem; color:var(--text-soft); line-height:1.9; margin-bottom:36px; }
.fcta-note { font-size:0.8rem; color:var(--gold); opacity:.8; letter-spacing:.1em; margin-top:18px; display:block; }

/* ════════════════════════════════════════
   FOOTER
════════════════════════════════════════ */
.footer { background:#060410; border-top:1px solid var(--border); padding-top:64px; }
.footer-grid { max-width:1200px; margin:0 auto; padding:0 24px 48px; display:grid; grid-template-columns:1.5fr 1fr 1fr 1.4fr; gap:48px; }
.footer-brand p { font-size:0.84rem; color:var(--text-dim); line-height:1.8; margin:14px 0 22px; }
.footer-socials { display:flex; gap:10px; }
.footer-socials a { width:36px; height:36px; border-radius:50%; border:1px solid rgba(201,168,76,0.18); display:flex; align-items:center; justify-content:center; color:var(--text-dim); font-size:0.9rem; transition:all var(--t); }
.footer-socials a:hover { border-color:var(--gold); color:var(--gold); background:rgba(201,168,76,0.08); transform:translateY(-2px); }
.footer-links-col h4, .footer-contact-col h4 { font-size:0.8rem; font-weight:700; color:var(--gold-light); letter-spacing:.12em; text-transform:uppercase; margin-bottom:18px; }
.footer-links-col ul { display:flex; flex-direction:column; gap:10px; }
.footer-links-col a { font-size:0.84rem; color:var(--text-dim); transition:color var(--t); }
.footer-links-col a:hover { color:var(--gold-light); }
.footer-contact-col p { display:flex; align-items:center; gap:9px; font-size:0.84rem; color:var(--text-dim); margin-bottom:10px; }
.footer-contact-col p i { color:var(--gold); width:15px; text-align:center; }
.footer-lang { display:inline-flex; align-items:center; gap:7px; font-size:0.78rem; color:var(--gold); background:rgba(201,168,76,0.07); padding:7px 12px; border-radius:var(--r-pill); border:1px solid var(--border); margin-top:6px; }
.footer-bottom { border-top:1px solid rgba(201,168,76,0.08); padding:22px 24px; text-align:center; max-width:1200px; margin:0 auto; }
.footer-bottom p { font-size:0.78rem; color:var(--text-dim); }
.footer-disc { font-size:0.7rem !important; opacity:.5; margin-top:4px; }

/* ════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════ */
@media(max-width:1024px) {
  .hero-grid { grid-template-columns:1fr; text-align:center; padding:130px 24px 80px; }
  .hero-content { align-items:center; order:1; }
  .hero-photo-side { order:2; }
  .hero-sub { margin-left:auto; margin-right:auto; }
  .hero-stats-row { justify-content:center; }
  .hero-btns { justify-content:center; }
  .hero-guarantee { justify-content:center; }
  .about-grid { grid-template-columns:1fr; gap:40px; }
  .booking-two-col { grid-template-columns:1fr; gap:28px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:36px; }
  .bento-grid { grid-template-columns:repeat(3,1fr); }
}
@media(max-width:768px) {
  .nav-links { display:none; position:fixed; top:0;left:0; width:100%;height:100vh; background:rgba(10,6,24,0.97); backdrop-filter:blur(24px); flex-direction:column; align-items:center; justify-content:center; gap:12px; z-index:999; }
  .nav-links.open { display:flex; }
  .nav-link { font-size:1.2rem; padding:12px 28px; }
  .hamburger { display:flex; z-index:1000; }
  .hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .hamburger.open span:nth-child(2){opacity:0}
  .hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav-login-btn { display:none; }
  .photo-frame { width:260px; height:340px; }
  .orbit1,.orbit2,.photo-glow-ring { display:none; }
  .fb1 { left:-10px; } .fb2 { right:-10px; } .fb3 { display:none; }
  .bento-grid { grid-template-columns:repeat(2,1fr); grid-auto-rows:100px; }
  .bi-large,.bi-large-2,.bi-wide { grid-column:span 2; }
  .bi-tall { grid-row:span 1; }
  .testi-grid { grid-template-columns:1fr; }
  .pricing-grid { grid-template-columns:1fr; }
  .price-featured { transform:none; }
  .price-featured:hover { transform:translateY(-6px); }
  .btab-content { padding:24px 18px; }
  .footer-grid { grid-template-columns:1fr; gap:28px; }
  .pay-grid { grid-template-columns:1fr 1fr; }
  .reels-grid { grid-template-columns:1fr; }
  .booking-tab-nav { overflow-x:auto; }
}
@media(max-width:480px) {
  .section-pad { padding:72px 0; }
  .hero-title { font-size:2.2rem; }
  .sec-title { font-size:1.8rem; }
  .bento-grid { grid-template-columns:repeat(2,1fr); }
  .pay-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .hero-btns { flex-direction:column; align-items:center; }
  .btn-hero-primary, .btn-hero-ghost { width:100%; justify-content:center; }
  .services-grid { grid-template-columns:1fr; }
}

/* ============================================================
   NEW MULTI-PAGE STYLES (v3 update)
   ============================================================ */

/* ── REVEAL ANIMATION ── */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.7s ease, transform 0.7s ease; }
.reveal.revealed { opacity: 1; transform: translateY(0); }

/* ── UPDATED NAV (nav-inner, logo, nav-book-btn) ── */
.nav-inner {
  max-width: 1200px; margin: 0 auto; padding: 0 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.logo {
  display: flex; align-items: center; gap: 10px; text-decoration: none;
}
.logo-sub {
  font-size: 0.6rem; color: var(--text-dim); letter-spacing: 0.12em;
  text-transform: uppercase; display: block; margin-top: 2px;
}
.nav-links a { padding: 8px 12px; font-size: 0.85rem; font-weight: 500; color: var(--text-soft); border-radius: 6px; transition: all var(--t); display: inline-block; }
.nav-links a:hover { color: var(--gold-light); background: rgba(201,168,76,0.07); }
.nav-links a.active { color: var(--gold); }
.nav-book-btn {
  background: var(--grad-gold) !important;
  color: var(--purple-deep) !important;
  font-weight: 700 !important;
  border-radius: 30px !important;
  padding: 9px 20px !important;
}
.nav-book-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(201,168,76,0.4); }

/* ── BUTTONS (new pages) ── */
.btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 30px; border-radius: var(--r-pill);
  background: var(--grad-gold); color: var(--purple-deep);
  font-weight: 700; font-size: 0.95rem;
  transition: all var(--t);
  box-shadow: 0 4px 24px rgba(201,168,76,0.3);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 36px rgba(201,168,76,0.5); }
.btn-primary.btn-large { padding: 17px 40px; font-size: 1.05rem; }
.btn-ghost {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 26px; border-radius: var(--r-pill);
  border: 1.5px solid rgba(201,168,76,0.35); color: var(--text-soft);
  font-weight: 600; font-size: 0.9rem;
  transition: all var(--t); background: transparent;
}
.btn-ghost:hover { border-color: var(--gold); color: var(--gold-light); background: rgba(201,168,76,0.05); transform: translateY(-2px); }

/* ── HERO (new clean version) ── */
.hero-wrap {
  max-width: 1160px; margin: 0 auto; padding: 130px 24px 80px;
  display: grid; grid-template-columns: 1fr 420px;
  align-items: center; gap: 60px; position: relative; z-index: 2;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 18px; border-radius: 30px;
  background: rgba(201,168,76,0.08); border: 1px solid rgba(201,168,76,0.35);
  font-size: 0.78rem; font-weight: 600; color: var(--gold-light); letter-spacing: 0.05em;
  margin-bottom: 22px;
}
.badge-dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--gold);
  animation: badgePulse 2s infinite; flex-shrink: 0;
}
.hero-title {
  font-family: var(--font-d); font-size: clamp(2.4rem,4.5vw,3.6rem);
  font-weight: 900; line-height: 1.12; margin-bottom: 18px; color: var(--text);
}
.gold-italic { font-style: italic; background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.hero-desc { font-size: 1rem; color: var(--text-soft); line-height: 1.8; margin-bottom: 28px; max-width: 490px; }
.hero-stats { display: flex; align-items: center; gap: 20px; margin-bottom: 28px; flex-wrap: wrap; }
.hstat { display: flex; flex-direction: column; align-items: center; }
.hstat-num { font-family: var(--font-d); font-size: 1.7rem; font-weight: 800; color: var(--gold-light); line-height: 1; }
.hstat-lbl { font-size: 0.68rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.1em; margin-top: 3px; }
.hstat-line { width: 1px; height: 36px; background: var(--border); }
.hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.hero-note { font-size: 0.8rem; color: var(--text-dim); display: flex; align-items: center; gap: 7px; }
.hero-note i { color: var(--gold); }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(70px); pointer-events: none; animation: orbFloat ease-in-out infinite; }
.hero-orb1 { width:500px; height:500px; left:-100px; top:0; background:radial-gradient(circle,rgba(120,60,200,0.22),transparent 70%); animation-duration:12s; }
.hero-orb2 { width:400px; height:400px; right:-80px; top:30%; background:radial-gradient(circle,rgba(201,168,76,0.1),transparent 70%); animation-duration:16s; animation-delay:-4s; }
.hero-orb3 { width:300px; height:300px; left:40%; bottom:-50px; background:radial-gradient(circle,rgba(80,40,160,0.18),transparent 70%); animation-duration:10s; animation-delay:-8s; }

/* HERO PHOTO */
.hero-photo-wrap { position: relative; display: flex; align-items: center; justify-content: center; }
.hero-photo-glow {
  position: absolute; width: 360px; height: 360px; border-radius: 50%;
  background: radial-gradient(circle, rgba(201,168,76,0.15), transparent 65%);
  animation: glowPulse 4s ease-in-out infinite;
}
.hero-ring {
  position: absolute; border-radius: 50%; border: 1px solid rgba(201,168,76,0.18);
  top: 50%; left: 50%; transform: translate(-50%, -50%);
}
.hero-ring-1 { width: 440px; height: 440px; animation: ringRotate 30s linear infinite; }
.hero-ring-2 { width: 370px; height: 370px; animation: ringRotate 20s linear infinite reverse; }
@keyframes ringRotate { to { transform: translate(-50%,-50%) rotate(360deg); } }
.hero-photo-frame { position: relative; z-index: 2; }
.hero-photo {
  width: 320px; height: 400px; object-fit: cover; object-position: top;
  border-radius: 20px;
  border: 2px solid rgba(201,168,76,0.4);
  box-shadow: 0 24px 80px rgba(0,0,0,0.55), 0 0 40px rgba(201,168,76,0.12);
}
.hero-badge-float {
  position: absolute; z-index: 3;
  display: flex; align-items: center; gap: 9px;
  background: rgba(10,6,24,0.88); backdrop-filter: blur(12px);
  border: 1px solid rgba(201,168,76,0.3);
  border-radius: 12px; padding: 10px 14px;
  animation: floatBadge 5s ease-in-out infinite;
  white-space: nowrap;
}
.hbf1 { bottom: 32px; left: -40px; }
.hbf2 { top: 40px; right: -30px; animation-delay: -2.5s; }
.hero-badge-float i { color: var(--gold); font-size: 1.1rem; }
.hero-badge-float div { display: flex; flex-direction: column; }
.hero-badge-float strong { font-size: 0.82rem; color: var(--text); line-height: 1; }
.hero-badge-float span { font-size: 0.7rem; color: var(--text-dim); margin-top: 2px; }
@keyframes floatBadge { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
.zfloat {
  position: absolute; font-size: 1.2rem; color: rgba(201,168,76,0.4);
  left: var(--zx); top: var(--zy);
  animation: floatZ var(--zd) ease-in-out infinite;
}
@keyframes floatZ { 0%,100%{transform:translateY(0) rotate(0deg)} 50%{transform:translateY(-12px) rotate(8deg)} }

/* SCROLL HINT */
.scroll-hint { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--text-dim); font-size: 0.72rem; letter-spacing: 0.1em; z-index: 2; }
.scroll-line { width: 1px; height: 40px; background: linear-gradient(to bottom, var(--gold), transparent); animation: scrollAnim 2s ease-in-out infinite; }
@keyframes scrollAnim { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

/* ── MARQUEE ── */
.marquee-wrap { overflow: hidden; background: rgba(201,168,76,0.06); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 14px 0; }
.marquee-track {
  display: flex; gap: 40px; white-space: nowrap;
  animation: marqueeScroll 30s linear infinite;
}
.marquee-track span { font-size: 0.82rem; font-weight: 600; color: var(--text-soft); white-space: nowrap; letter-spacing: 0.05em; }
.marquee-track span:nth-child(even) { color: var(--gold); }
@keyframes marqueeScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ── SECTION CLEAN ── */
.section-clean { padding: 90px 0; }
.sec-head { text-align: center; margin-bottom: 48px; }
.sec-head .sec-label { margin-bottom: 12px; }
.see-all-wrap { text-align: center; margin-top: 32px; }

/* ── SERVICES MINI CARDS ── */
.services-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.svc-mini-card {
  background: var(--purple-card); border: 1px solid var(--border);
  border-radius: var(--r); padding: 28px 22px;
  display: flex; flex-direction: column;
  transition: all var(--t); position: relative; overflow: hidden;
  text-decoration: none;
}
.svc-mini-card:hover { transform: translateY(-4px); border-color: var(--border-bright); box-shadow: var(--shadow-card); }
.svc-mini-card.svc-featured { border-color: rgba(201,168,76,0.4); background: linear-gradient(145deg, var(--purple-card), rgba(201,168,76,0.05)); }
.smc-pop { position: absolute; top: 12px; right: 12px; background: var(--grad-gold); color: var(--purple-deep); font-size: 0.65rem; font-weight: 700; padding: 3px 9px; border-radius: 20px; }
.smc-icon { font-size: 2.4rem; margin-bottom: 14px; display: block; }
.svc-mini-card h3 { font-family: var(--font-d); font-size: 1.15rem; color: var(--text); margin-bottom: 8px; }
.svc-mini-card p { font-size: 0.88rem; color: var(--text-soft); line-height: 1.65; flex: 1; margin-bottom: 12px; }
.smc-link { font-size: 0.82rem; color: var(--gold); font-weight: 600; display: inline-flex; align-items: center; gap: 6px; transition: gap var(--t); }
.svc-mini-card:hover .smc-link { gap: 10px; }

/* ── REELS CONTINUOUS SLIDER ── */
.reels-section { background: linear-gradient(135deg,#1a0a35,#0a0618,#14102a); padding: 80px 0 60px; position: relative; overflow: hidden; }
.reels-slider-wrap { overflow: hidden; width: 100%; margin-top: 40px; position: relative; }
.reels-slider {
  display: flex; gap: 20px;
  animation: reelsAutoScroll 30s linear infinite;
  width: max-content;
}
.reels-slider:hover { animation-play-state: paused; }
@keyframes reelsAutoScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.reel-slide { flex-shrink: 0; width: 260px; }
.reel-slide-inner {
  background: var(--purple-card); border: 1px solid var(--border);
  border-radius: var(--r); overflow: hidden;
  transition: all var(--t);
}
.reel-slide-inner:hover { border-color: var(--border-bright); transform: translateY(-4px); box-shadow: var(--shadow-gold); }
.reel-thumb {
  height: 180px; background: linear-gradient(135deg, #2a1060, #1a0a35);
  position: relative; display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.reel-thumb-2 { background: linear-gradient(135deg, #1a3060, #0a1835); }
.reel-thumb-3 { background: linear-gradient(135deg, #601030, #350a18); }
.reel-thumb-4 { background: linear-gradient(135deg, #203040, #0a1020); }
.reel-thumb-5 { background: linear-gradient(135deg, #304020, #141a08); }
.reel-thumb-6 { background: linear-gradient(135deg, #402020, #1a0808); }
.reel-play-icon {
  width: 50px; height: 50px; border-radius: 50%;
  background: rgba(201,168,76,0.8); display: flex; align-items: center; justify-content: center;
  color: var(--purple-deep); font-size: 1.1rem;
  box-shadow: 0 0 20px rgba(201,168,76,0.4);
}
.reel-cat-tag {
  position: absolute; top: 10px; left: 10px;
  background: rgba(201,168,76,0.15); border: 1px solid rgba(201,168,76,0.3);
  color: var(--gold-light); font-size: 0.68rem; font-weight: 700;
  padding: 3px 9px; border-radius: 12px; text-transform: uppercase; letter-spacing: 0.08em;
}
.reel-info { padding: 14px; }
.reel-info h4 { font-family: var(--font-d); font-size: 0.92rem; color: var(--text); margin-bottom: 6px; line-height: 1.4; }
.reel-info p { font-size: 0.78rem; color: var(--text-soft); line-height: 1.5; margin-bottom: 8px; }
.reel-stat { font-size: 0.75rem; color: var(--text-dim); display: flex; align-items: center; gap: 5px; }
.reel-stat i { color: var(--gold); font-size: 0.7rem; }
.reels-nav-hint { text-align: center; margin-top: 32px; padding: 0 24px; }

/* ── ABOUT TEASER ── */
.about-teaser { background: linear-gradient(180deg, rgba(17,13,32,0.5), var(--purple-dark)); }
.about-teaser-grid { display: grid; grid-template-columns: 420px 1fr; gap: 64px; align-items: center; max-width: 1100px; margin: 0 auto; }
.at-photo-col { position: relative; }
.at-photo-frame { position: relative; border-radius: 20px; overflow: hidden; display: inline-block; }
.at-photo { width: 100%; max-width: 360px; height: 440px; object-fit: cover; object-position: top; border-radius: 20px; border: 2px solid rgba(201,168,76,0.35); box-shadow: 0 24px 60px rgba(0,0,0,0.5); display: block; }
.at-corner { position: absolute; font-size: 1.1rem; color: var(--gold); opacity: 0.6; z-index: 3; }
.at-corner.tl { top:-10px; left:-10px; } .at-corner.tr { top:-10px; right:-10px; }
.at-corner.bl { bottom:-10px; left:-10px; } .at-corner.br { bottom:-10px; right:-10px; }
.at-quote { margin-top: 16px; padding: 14px 18px; background: rgba(201,168,76,0.06); border-left: 3px solid var(--gold); border-radius: 0 8px 8px 0; }
.at-quote span { font-family: var(--font-e); font-style: italic; font-size: 0.95rem; color: var(--text-soft); line-height: 1.7; }
.at-quote cite { display: block; margin-top: 6px; font-size: 0.8rem; color: var(--gold); font-weight: 600; font-style: normal; }
.at-content-col .sec-label { margin-bottom: 12px; }
.at-content-col .sec-title { font-size: clamp(1.7rem, 3vw, 2.4rem); margin-bottom: 20px; }
.at-text { color: var(--text-soft); font-size: 0.95rem; line-height: 1.85; margin-bottom: 14px; }
.at-text strong { color: var(--gold-light); }

/* ── TESTIMONIAL HIGHLIGHT ── */
.testi-highlight { background: linear-gradient(135deg, rgba(40,20,80,0.5), rgba(10,6,24,0.8)); padding: 80px 0; }
.th-inner { max-width: 700px; margin: 0 auto; text-align: center; }
.th-stars { font-size: 1.4rem; color: var(--gold); margin-bottom: 20px; }
.th-quote { font-family: var(--font-e); font-size: 1.12rem; font-style: italic; color: var(--text-soft); line-height: 1.85; margin-bottom: 24px; position: relative; }
.th-author { display: flex; align-items: center; justify-content: center; gap: 12px; }
.th-avatar { width: 46px; height: 46px; border-radius: 50%; background: var(--grad-gold); display: flex; align-items: center; justify-content: center; color: var(--purple-deep); font-weight: 700; font-size: 1.1rem; }
.th-author strong { display: block; font-size: 0.95rem; color: var(--text); }
.th-author span { font-size: 0.78rem; color: var(--text-dim); }

/* ── PRICING TEASER ── */
.pricing-teaser { background: transparent; }
.price-row { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; }
.price-pill {
  display: flex; align-items: center; gap: 14px;
  background: var(--purple-card); border: 1px solid var(--border);
  border-radius: 16px; padding: 18px 20px;
  flex: 1; min-width: 240px; max-width: 320px;
  transition: all var(--t);
}
.price-pill:hover { border-color: var(--border-bright); transform: translateY(-2px); }
.price-pill-featured { border-color: rgba(201,168,76,0.4); background: linear-gradient(145deg, var(--purple-card), rgba(201,168,76,0.05)); }
.pp-icon { font-size: 1.8rem; flex-shrink: 0; }
.price-pill div { flex: 1; }
.price-pill div strong { display: block; font-size: 0.92rem; color: var(--text); margin-bottom: 3px; }
.price-pill div span { font-size: 0.78rem; color: var(--text-dim); }
.pp-price { font-family: var(--font-d); font-size: 1.4rem; color: var(--gold-light); font-weight: 800; flex-shrink: 0; }
.pp-btn { padding: 8px 16px; border-radius: 8px; background: rgba(201,168,76,0.1); border: 1px solid var(--border); color: var(--gold-light); font-size: 0.82rem; font-weight: 700; flex-shrink: 0; transition: all var(--t); }
.pp-btn:hover { background: var(--grad-gold); color: var(--purple-deep); border-color: transparent; }
.pp-btn-gold { background: var(--grad-gold); color: var(--purple-deep); border-color: transparent; }

/* ── FINAL CTA (new pages) ── */
.final-cta {
  padding: 100px 0; text-align: center; position: relative; overflow: hidden;
  background: radial-gradient(ellipse at 50% 50%, rgba(201,168,76,0.07), transparent 65%),
              linear-gradient(135deg,#1a0835,#080510);
}
.fcta-orb { position: absolute; border-radius: 50%; filter: blur(70px); pointer-events: none; }
.fcta-orb1 { width:400px; height:400px; top:-100px; left:-50px; background:radial-gradient(circle,rgba(120,50,200,0.2),transparent); animation:orbFloat 12s ease-in-out infinite; }
.fcta-orb2 { width:300px; height:300px; bottom:-50px; right:-50px; background:radial-gradient(circle,rgba(201,168,76,0.1),transparent); animation:orbFloat 16s ease-in-out infinite reverse; }
.fcta-inner { position: relative; z-index: 1; max-width: 680px; margin: 0 auto; }
.fcta-symbol { font-size: 3.5rem; display: block; margin-bottom: 20px; }
.fcta-inner h2 { font-family: var(--font-d); font-size: clamp(1.8rem,4vw,2.8rem); font-weight: 800; color: var(--text); line-height: 1.2; margin-bottom: 18px; }
.fcta-inner h2 em { font-style: italic; background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.fcta-inner p { font-size: 1rem; color: var(--text-soft); line-height: 1.85; margin-bottom: 32px; }
.fcta-note { font-size: 0.78rem; color: var(--gold); opacity: 0.8; letter-spacing: 0.1em; margin-top: 16px; display: block; }

/* ── FOOTER (new pages) ── */
.footer-inner { max-width: 1200px; margin: 0 auto; padding: 64px 24px 40px; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.4fr; gap: 40px; }
.footer-brand p { font-size: 0.84rem; color: var(--text-dim); line-height: 1.8; margin: 12px 0 20px; }
.footer-col h4 { font-size: 0.78rem; font-weight: 700; color: var(--gold-light); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 16px; }
.footer-col ul { display: flex; flex-direction: column; gap: 9px; }
.footer-col ul a { font-size: 0.84rem; color: var(--text-dim); transition: color var(--t); }
.footer-col ul a:hover { color: var(--gold-light); }
.footer-contact-col p { display: flex; align-items: center; gap: 9px; font-size: 0.84rem; color: var(--text-dim); margin-bottom: 9px; }
.footer-contact-col p i { color: var(--gold); width: 14px; }
.footer-lang { display: inline-flex; align-items: center; gap: 7px; font-size: 0.78rem; color: var(--gold); background: rgba(201,168,76,0.07); padding: 6px 12px; border-radius: 20px; border: 1px solid var(--border); }
.footer-bottom { border-top: 1px solid rgba(201,168,76,0.08); padding: 20px 24px; text-align: center; max-width: 1200px; margin: 0 auto; }
.footer-bottom p { font-size: 0.78rem; color: var(--text-dim); }

/* ── TOAST (new) ── */
.toast { opacity: 0; transform: translateX(30px); transition: all 0.4s ease; }
.toast.show { opacity: 1; transform: translateX(0); }
.toast-error { border-color: rgba(239,68,68,0.4) !important; }
.toast-error i { color: #ef4444; }
.toast-success i { color: #22c55e; }

/* ── RESPONSIVE UPDATES ── */
@media(max-width: 1024px) {
  .hero-wrap { grid-template-columns: 1fr; text-align: center; padding: 120px 24px 70px; }
  .hero-desc { margin-left: auto; margin-right: auto; }
  .hero-stats { justify-content: center; }
  .hero-ctas { justify-content: center; }
  .hero-note { justify-content: center; }
  .hero-photo-wrap { margin-top: 32px; }
  .hero-badge-float.hbf1 { left: 0; }
  .hero-badge-float.hbf2 { right: 0; }
  .about-teaser-grid { grid-template-columns: 1fr; gap: 36px; }
  .at-photo-col { text-align: center; }
  .at-photo { max-width: 300px; height: 360px; margin: 0 auto; }
  .services-row { grid-template-columns: 1fr; }
  .footer-inner { grid-template-columns: 1fr 1fr; gap: 28px; }
}
@media(max-width: 768px) {
  .nav-links { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(10,6,24,0.97); backdrop-filter: blur(24px); flex-direction: column; align-items: center; justify-content: center; gap: 12px; z-index: 999; }
  .nav-links.open { display: flex; }
  .hamburger { display: flex; z-index: 1000; }
  .hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .hamburger.open span:nth-child(2) { opacity: 0; }
  .hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .hero-photo { width: 260px; height: 320px; }
  .hero-ring-1 { width: 320px; height: 320px; }
  .hero-ring-2 { width: 270px; height: 270px; }
  .hbf1 { left: -10px; }
  .hbf2 { right: -10px; }
  .price-row { flex-direction: column; align-items: stretch; }
  .price-pill { max-width: 100%; }
  .footer-inner { grid-template-columns: 1fr; }
}
@media(max-width: 480px) {
  .services-row { grid-template-columns: 1fr; }
  .hero-ctas { flex-direction: column; align-items: center; }
  .btn-primary, .btn-ghost { width: 100%; justify-content: center; }
}
