html { scroll-behavior: smooth; scroll-padding-top: 67px; }
:root { --gold: #d6b36a; --purple: #5b4880; --purple-dark: #1a1624; }
[data-theme="dark"] {
  --bg: #0d0e13; --panel: rgba(255,255,255,.05); --border: rgba(255,255,255,.12);
  --text: #e9e9ea; --muted: rgba(233,233,234,.7); --gold: #d6b36a;
}
[data-theme="light"] {
  --bg: #f4f1f7; --panel: #ffffff; --border: rgba(0,0,0,.12);
  --text: #191a1d; --muted: rgba(25,26,29,.65); --gold: #c9a85a;
}
body { 
  font-family: 'Poppins', sans-serif; 
  background: radial-gradient(900px circle at 30% 10%, rgba(91,72,128,.25), transparent 65%),
              radial-gradient(800px circle at 80% 60%, rgba(26,22,36,.55), transparent 60%),
              linear-gradient(180deg, #0d0e13 0%, #14131b 100%);
  color: var(--text);
}
.font-display { font-family: 'Playfair Display', serif; }
.gold { color: var(--gold); }
.bg-gold { background-color: var(--gold); }
.border-gold { border-color: var(--gold); }
.text-white { color: var(--text) !important; }
.text-white\/80 { color: var(--muted) !important; }
.text-white\/70 { color: var(--muted) !important; }
.text-white\/60 { color: var(--muted) !important; }
.bg-black { background-color: var(--bg) !important; }
.bg-white\/5 { background-color: var(--panel) !important; }
.border-white\/10 { border-color: var(--border) !important; }
.bg-\[\#111\] { background-color: var(--bg) !important; }
[data-theme="light"] .bg-black\/40 { background-color: rgba(255,255,255,.6) !important; }
[data-theme="light"] .text-white,
[data-theme="light"] .text-white\/90,
[data-theme="light"] .text-white\/80,
[data-theme="light"] .text-white\/70,
[data-theme="light"] .text-white\/60 { color: #121317 !important; }
.logo-badge { width: 40px; height: 40px; border-radius: 9999px; background: radial-gradient(circle at 50% 45%, #0b0b0d 65%, #0b0b0d 66%), conic-gradient(from 0deg, #d6b36a 0deg, #d6b36a 360deg); box-shadow: 0 0 0 2px rgba(214,179,106,.35), 0 8px 20px rgba(0,0,0,.35); display: grid; place-items: center; }
.logo-badge span { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 16px; letter-spacing: .02em; color: var(--gold); }
.logo-img { width: 45px; height: 45px; border-radius: 9999px; object-fit: cover; box-shadow: 0 0 0 2px var(--gold), 0 12px 28px rgba(0,0,0,.5); filter: saturate(1.1) brightness(1.06); transform: scale(1.04); transition: transform .25s ease, box-shadow .25s ease, filter .25s ease; }
.logo-wrap { position: relative; display: inline-block; border-radius: 9999px; overflow: hidden; border: 2px solid rgba(214,179,106,.45); transition: box-shadow .25s ease, border-color .25s ease; }
.logo-wrap:hover { box-shadow: 0 0 0 3px rgba(214,179,106,.35); }
.logo-img:hover { box-shadow: 0 0 0 2px var(--gold), 0 12px 28px rgba(0,0,0,.5); filter: saturate(1.1) brightness(1.06); transform: scale(1.04); }
.logo-wrap::before { display: none; }
.logo-wrap:hover::before { display: none; }
.logo-wrap:hover .logo-img { box-shadow: 0 0 0 2px var(--gold), 0 12px 28px rgba(0,0,0,.5); filter: saturate(1.1) brightness(1.06); transform: scale(1.04); }
@keyframes textIn { 0% { opacity: 0; transform: translateY(18px) scale(.99); filter: blur(2px);} 100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0);} }
@keyframes textOut { 0% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0);} 100% { opacity: 0; transform: translateY(-6px) scale(.99); filter: blur(1.5px);} }
.hero-text { will-change: opacity, transform, filter; backface-visibility: hidden; transform-origin: 0 50%; }
.hero-text-in { animation: textIn var(--in-dur, 900ms) cubic-bezier(.16,1,.3,1) forwards; }
.hero-text-out { animation: textOut var(--out-dur, 650ms) cubic-bezier(.4,0,.2,1) forwards; }
.hero-stagger-1 { animation-delay: .08s; }
.hero-stagger-2 { animation-delay: .16s; }
.hero-stagger-3 { animation-delay: .24s; }
.shine { position: relative; display: inline-block; background-image: linear-gradient(0deg, var(--gold), var(--gold)), linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.9) 50%, rgba(255,255,255,0) 100%); background-size: 100% 100%, 28% 100%; background-repeat: no-repeat; background-position: 0 0, -35% 0; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: shine-move-bg var(--shine-dur, 3.8s) ease-in-out infinite alternate; }
.btn-shine { position: relative; overflow: hidden; }
.btn-shine::after { content: ''; position: absolute; top: 0; left: -40%; width: 35%; height: 100%; background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.9) 50%, rgba(255,255,255,0) 100%); transform: skewX(-20deg); opacity: 0; filter: blur(.6px); pointer-events: none; }
.btn-shine:hover::after { animation: btn-shine-move 900ms ease-in-out forwards; }
@keyframes btn-shine-move { 0% { left: -40%; opacity: 0; } 10% { opacity: .6; } 50% { left: 110%; opacity: .6; } 100% { left: 110%; opacity: 0; }
}
@keyframes shine-move-bg { 0% { background-position: 0 0, -35% 0; } 100% { background-position: 0 0, 110% 0; }
}
.card-premium { position: relative; border-radius: 16px; overflow: hidden; border: 1px solid var(--border); background: linear-gradient(180deg, rgba(91,72,128,.20), rgba(0,0,0,.75)); box-shadow: 0 10px 24px rgba(0,0,0,.28), 0 1px 0 rgba(214,179,106,.15) inset; }
.card-premium::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,.25); opacity: 1; transition: opacity .35s ease; pointer-events: none; }
.card-premium:hover { box-shadow: 0 0 0 1px rgba(214,179,106,.35), 0 18px 36px rgba(0,0,0,.45); transform: translateY(-2px); transition: all .35s ease; }
.card-premium:hover::after { opacity: 0; }
.card-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .6; transform: scale(1.05); filter: blur(1.2px); transition: transform .8s ease, opacity .5s ease, filter .35s ease; z-index: 0; }
.card-premium:hover .card-media { transform: scale(1.12); opacity: .9; filter: blur(0); }
.card-watermark-ring { position: absolute; top: 10px; right: 10px; width: 120px; height: 120px; border: 1px solid rgba(214,179,106,.45); border-radius: 9999px; box-sizing: border-box; pointer-events: none; z-index: 1; transition: opacity .35s ease, transform .35s ease; }
.card-watermark { position: relative; width: 100%; height: 100%; border-radius: 9999px; object-fit: cover; opacity: .55; filter: saturate(1.12) brightness(1.14); }
.card-premium:hover .card-watermark-ring { opacity: 0; transform: scale(1.03); }
.card-content { position: relative; z-index: 1; padding: 20px; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.75) 60%); }
.badge { position: relative; z-index: 1; margin: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 5px; background: transparent; border: 1px solid var(--gold); color: var(--gold); }
#services .card-content h3 { font-size: 1.25rem; line-height: 1.3; }
#services .card-content p { font-size: .8125rem; line-height: 1.4; }
#pricing .card-content { justify-content: flex-start; background: linear-gradient(180deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,0) 60%); min-height: auto; padding: 24px; }
#pricing .card-content h3 { font-size: 1.1rem; line-height: 1.3; margin-bottom: 10px; }
.panel-premium { border: 0; border-radius: 0; padding: 0; background: none; box-shadow: none; }
.nav-gold a { color: var(--gold) !important; position: relative; }
.nav-gold a::after { content: ''; position: absolute; left: 0; bottom: -4px; height: 2px; width: 0; background: var(--gold); transition: width .3s ease; }
.nav-gold a:hover::after { width: 100%; }
.theme-toggle { color: #9aa0a6 !important; }
.footer-nav a { position: relative; transition: color .25s ease; }
.footer-nav a:hover { color: var(--gold); }
.footer-nav a::after { content: ''; position: absolute; left: 0; bottom: -2px; height: 2px; width: 0; background: var(--gold); transition: width .25s ease; }
.footer-nav a:hover::after { width: 100%; }
.site-footer a { transition: color .25s ease; }
.site-footer a:hover { color: var(--gold); }
.pricing-logo-ring { display: inline-block; width: 96px; height: 96px; border: 2px solid rgba(214,179,106,.35); border-radius: 9999px; overflow: hidden; box-sizing: border-box; }
.pricing-logo-ring img { width: 100%; height: 100%; object-fit: cover; border-radius: 9999px; opacity: 1; filter: none; }