/* ═══════════════════════════════════════════════════════════
   0DATA PREMIUM REFRESH — Shared Design System
   Load on all pages: <link rel="stylesheet" href="https://i.08.ma/premium-refresh.css">
   ═══════════════════════════════════════════════════════════ */

/* — Background depth — */
body { background: #030305; }
section.alt, section:nth-child(even) { background: #060a12; }

/* — Magic Orbs — */
.magic-orb { position: absolute; border-radius: 50%; filter: blur(100px); pointer-events: none; z-index: 0; }
.magic-orb-cyan { width: 600px; height: 600px; background: radial-gradient(circle, rgba(0,212,255,.06) 0%, transparent 70%); top: -15%; right: -10%; animation: orbFloat 8s ease-in-out infinite; }
.magic-orb-gold { width: 450px; height: 450px; background: radial-gradient(circle, rgba(201,168,76,.04) 0%, transparent 70%); bottom: -10%; left: -5%; animation: orbFloat 10s ease-in-out infinite reverse; }
@keyframes orbFloat { 0%,100%{transform:translate(0,0) scale(1)} 33%{transform:translate(30px,-20px) scale(1.05)} 66%{transform:translate(-20px,15px) scale(.95)} }

/* — Gradient Text — */
.gradient-headline { background: linear-gradient(135deg,#ffffff 0%,#00d4ff 45%,#c9a84c 75%,#ffffff 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

/* — Shadow-border (Vercel) — */
.shadow-border { box-shadow: 0 0 0 1px rgba(255,255,255,.04); }
.shadow-border:hover { box-shadow: 0 0 0 1px rgba(0,212,255,.12); }

/* — Glass Sweep (Stripe) — */
.glass-sweep { position: relative; overflow: hidden; }
.glass-sweep::after { content: ''; position: absolute; top: 0; left: -100%; width: 60%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.015), transparent); transform: skewX(-15deg); transition: left .7s ease; pointer-events: none; z-index: 0; }
.glass-sweep:hover::after { left: 120%; }

/* — Card accent top bar — */
.card-accent { position: absolute; top: 0; left: 0; right: 0; height: 2px; opacity: .4; transition: opacity .3s, height .3s; z-index: 1; }
.glass-sweep:hover .card-accent { opacity: 1; height: 3px; }
.accent-cyan { background: linear-gradient(90deg, transparent, #00d4ff, transparent); }
.accent-gold { background: linear-gradient(90deg, transparent, #c9a84c, transparent); }
.accent-green { background: linear-gradient(90deg, transparent, #34d399, transparent); }

/* — Border-gradient cards — */
.border-gradient { position: relative; border-radius: 14px; overflow: hidden; }
.border-gradient::before { content: ''; position: absolute; inset: 0; border-radius: 14px; padding: 1px; background: linear-gradient(135deg, rgba(0,212,255,.08), transparent 40%, transparent 60%, rgba(201,168,76,.08)); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; z-index: 1; }

/* — Prestige Marquee — */
.prestige-section { border-top: 1px solid rgba(255,255,255,.02); border-bottom: 1px solid rgba(255,255,255,.02); overflow: hidden; padding: 24px 0; position: relative; }
.prestige-track { display: flex; animation: marquee 30s linear infinite; width: max-content; }
.prestige-track:hover { animation-play-state: paused; }
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.prestige-item { font-size: .9rem; font-weight: 500; color: rgba(255,255,255,.04); white-space: nowrap; padding: 0 24px; letter-spacing: 1px; transition: color .4s; }
.prestige-item:hover { color: rgba(255,255,255,.12); }

/* — Stats row — */
.stats-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; padding: 40px 0; }
.stat-item { text-align: center; padding: 16px 12px; position: relative; }
.stat-item::after { content: ''; position: absolute; right: 0; top: 20%; height: 60%; width: 1px; background: linear-gradient(to bottom, transparent, rgba(255,255,255,.02), transparent); }
.stat-item:last-child::after { display: none; }
.stat-value { font-size: 2.6rem; font-weight: 200; letter-spacing: -1px; color: #e0e8f0; }
.stat-value em { font-style: normal; color: #00d4ff; font-size: 1.4rem; }
.stat-label { font-size: .6rem; font-family: 'Share Tech Mono', monospace; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,.12); margin-top: 4px; }

/* — Buttons — */
.btn-glass { display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 10px; background: rgba(0,212,255,.03); border: 1px solid rgba(0,212,255,.08); color: #00d4ff; font-family: 'Share Tech Mono',monospace; font-size: .65rem; letter-spacing: 1.5px; text-decoration: none; transition: all .3s; cursor: pointer; }
.btn-glass:hover { background: rgba(0,212,255,.06); border-color: rgba(0,212,255,.15); box-shadow: 0 0 20px rgba(0,212,255,.04); transform: translateY(-1px); }
.btn-glass.gold { border-color: rgba(201,168,76,.1); color: #c9a84c; background: rgba(201,168,76,.03); }
.btn-glass.gold:hover { background: rgba(201,168,76,.06); border-color: rgba(201,168,76,.2); }

/* — Form premium — */
.form-glass { background: rgba(3,6,9,.5); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,.04); border-top: 1px solid rgba(255,255,255,.06); border-radius: 20px; padding: 2.5rem; box-shadow: 0 4px 32px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.008); }
.form-input { width: 100%; background: rgba(0,0,0,.25); border: 1px solid rgba(255,255,255,.03); border-radius: 10px; padding: 12px 16px; color: #e0e8f0; font-family: Inter, sans-serif; font-size: .85rem; outline: none; transition: all .2s; }
.form-input:focus { border-color: rgba(0,212,255,.2); box-shadow: 0 0 0 3px rgba(0,212,255,.03); }
.form-input::placeholder { color: rgba(255,255,255,.1); }
.form-submit { background: linear-gradient(135deg,#fff,#e0e8f0); color: #030305; border: none; border-radius: 12px; padding: 14px 28px; font-weight: 600; font-size: .9rem; cursor: pointer; transition: all .3s; font-family: Inter, sans-serif; position: relative; overflow: hidden; }
.form-submit:hover { box-shadow: 0 0 30px rgba(0,212,255,.12), 0 0 60px rgba(0,212,255,.04); transform: translateY(-2px); }
.form-submit::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, #00d4ff, #ffffff); opacity: 0; transition: opacity .3s; }
.form-submit:hover::before { opacity: 1; }
.form-submit span { position: relative; z-index: 1; }

/* — Scroll reveal — */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity .8s ease, transform .8s cubic-bezier(.16,1,.3,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }

/* — Footer divider — */
.footer-divider { height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.03), transparent); margin: 2rem 0; }

/* — Responsive — */
@media(max-width:900px) {
  .stats-row { grid-template-columns: repeat(2,1fr); }
  .stat-item:nth-child(2)::after { display: none; }
  .stat-value { font-size: 2.2rem; }
}
@media(max-width:600px) {
  .magic-orb { display: none; }
  .prestige-item { font-size: .75rem; padding: 0 14px; }
}