:root{--primary-blue:#3B82F6;--primary-purple:#8B5CF6;--teal:#22D3EE;--green:#10B981;--yellow:#F59E0B;--red:#EF4444;--dark-bg:#0F172A;--card-bg:#1E293B;--muted:#94A3B8;--border:#334155}
body{background:linear-gradient(135deg,var(--dark-bg) 0%,#1E293B 100%);color:#E5E7EB;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"}
.bg-dark-bg{background:linear-gradient(135deg,var(--dark-bg) 0%,#1E293B 100%)}
.text-primary-blue{color:var(--primary-blue)}
.text-primary-purple{color:var(--primary-purple)}
.bg-card-bg{background:var(--card-bg)}
.bg-primary-blue{background-color:var(--primary-blue)}
.bg-primary-purple{background-color:var(--primary-purple)}
.bg-gradient-to-r.from-primary-blue.to-primary-purple{background-image:linear-gradient(135deg,var(--primary-blue),var(--primary-purple))}
.bg-primary-blue\/20{background-color:rgba(59,130,246,.2)}
.bg-primary-blue\/30{background-color:rgba(59,130,246,.3)}
.text-white\/80{color:rgba(255,255,255,.8)}
.floating-shapes{position:fixed;inset:0;pointer-events:none;z-index:0}
.floating-shapes::before,.floating-shapes::after{content:"";position:absolute;width:520px;height:520px;border-radius:9999px;filter:blur(40px);opacity:.55}
.floating-shapes::before{top:-120px;left:-120px;background:radial-gradient(closest-side,rgba(139,92,246,.35),rgba(59,130,246,.2),transparent 70%);animation:float1 12s ease-in-out infinite alternate}
.floating-shapes::after{bottom:-140px;right:-80px;background:radial-gradient(closest-side,rgba(34,211,238,.35),rgba(139,92,246,.25),transparent 70%);animation:float2 14s ease-in-out infinite alternate}
@keyframes float1{0%{transform:translate(0,0) scale(1)}100%{transform:translate(40px,20px) scale(1.05)}}
@keyframes float2{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-35px,-10px) scale(1.05)}}
#main-header{backdrop-filter:saturate(120%) blur(0)}
#main-header.scrolled{background:rgba(15,23,42,.75);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid rgba(255,255,255,.06);box-shadow:0 10px 25px rgba(0,0,0,.25)}
.nav-link{display:inline-flex;align-items:center;padding:.75rem 1rem;border-radius:.75rem;color:#94A3B8;transition:all .25s ease;position:relative}
.nav-link:hover,.nav-link.active{color:#fff;background:linear-gradient(135deg,rgba(59,130,246,.15),rgba(139,92,246,.15));box-shadow:0 8px 25px rgba(59,130,246,.25);transform:translateY(-1px)}
.nav-link-mobile{display:block;padding:.875rem 2rem;border-radius:.75rem;color:#E5E7EB;transition:all .25s ease}
.nav-link-mobile:hover{background:rgba(59,130,246,.15);transform:translateX(4px)}
.glass-effect{background:rgba(30,41,59,.65);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.gradient-text-animated{background:linear-gradient(135deg,var(--primary-blue),var(--primary-purple),var(--teal),var(--primary-blue));background-size:300% 300%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradientShift 8s ease infinite}
@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.pulse-button{animation:pulse 2.2s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
.feature-card,.signal-card,.blog-card{background:linear-gradient(145deg,#1E293B,#334155);border:1px solid rgba(255,255,255,.08);border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.3);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.feature-card:hover,.signal-card:hover,.blog-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.4),0 6px 16px rgba(59,130,246,.25);border-color:rgba(59,130,246,.35)}
.badge-active{display:inline-flex;align-items:center;padding:.25rem .6rem;border-radius:9999px;background:rgba(16,185,129,.15);color:#10B981;border:1px solid rgba(16,185,129,.3);font-size:.75rem;font-weight:700;letter-spacing:.02em}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
.reveal.show{opacity:1;transform:translateY(0)}
.line-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:3;line-clamp:3}
.container{position:relative;z-index:1}
img{max-width:100%;height:auto;display:block}

/* Skeleton loaders */
.skeleton{position:absolute;inset:0;background:rgba(148,163,184,.12);overflow:hidden}
.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);animation:shimmer 1.2s ease-in-out infinite}
@keyframes shimmer{100%{transform:translateX(100%)}}

/* Image fade-in helper */
.img-fade-in{opacity:0;transition:opacity .3s ease}
.img-fade-in.loaded{opacity:1}

/* User-side components */
.contact-info-card{background:var(--card-bg);border:1px solid rgba(255,255,255,.08);border-radius:1rem;padding:1.25rem;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:transform .25s ease,border-color .25s ease}
.contact-info-card:hover{transform:translateY(-3px);border-color:rgba(59,130,246,.35)}
.contact-info-card .icon-wrapper{width:44px;height:44px;border-radius:.75rem;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(59,130,246,.15),rgba(139,92,246,.15));color:#93c5fd;margin-bottom:.75rem}

.social-share-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:.75rem;color:#fff;transition:transform .2s ease, box-shadow .2s ease}
.social-share-btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(59,130,246,.3)}

/* Forms */
.form-group{margin-bottom:1.5rem}
.form-label{display:block;margin-bottom:.5rem;color:#E2E8F0;font-weight:500;font-size:.875rem}
.form-input{width:100%;padding:.75rem 1rem;background:rgba(30,41,59,.6);border:1px solid rgba(255,255,255,.1);border-radius:.75rem;color:#fff;transition:all .2s ease;font-size:.95rem}
.form-input:focus{outline:none;background:rgba(30,41,59,.8);border-color:var(--primary-blue);box-shadow:0 0 0 3px rgba(59,130,246,.15);transform:translateY(-1px)}

/* Basic prose fallback */
.prose{line-height:1.75}
.prose p{margin:0 0 1em;color:#d1d5db}
.prose h2,.prose h3{color:#fff;margin:1.25em 0 .5em;font-weight:700}
.prose ul{list-style:disc;padding-left:1.25rem;margin:0 0 1em}
.prose ol{list-style:decimal;padding-left:1.25rem;margin:0 0 1em}

/* Tabs (dashboard) */
.tab-btn{color:#cbd5e1;border-bottom:2px solid transparent;transition:color .2s ease,border-color .2s ease,background-color .2s ease}
.tab-btn:hover{color:#fff;background-color:rgba(148,163,184,.08)}
.tab-btn.active{color:#60a5fa;border-color:#60a5fa;background-color:rgba(59,130,246,.08)}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  html:focus-within{scroll-behavior:auto !important}
  *, *::before, *::after{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important}
  .pulse-button{animation:none !important}
  .floating-shapes{transform:none !important}
  .skeleton::after{animation:none !important}
}
