/* Developer & Tech — Premium Template */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap');

.vxp-body { background: var(--color-bg); font-family: 'JetBrains Mono', 'Fira Code', monospace; position: relative; }

/* Canvas handles the matrix rain effect via script.js */

.vxp-hero__name, .vxp-section__title, .vxp-service-card__title, .vxp-testimonial-card__name {
    font-family: 'JetBrains Mono', monospace;
}

.vxp-hero__cover--gradient { background: linear-gradient(180deg, #161B22 0%, #0D1117 100%); height: 160px; }

/* Square avatar */
.vxp-hero__avatar-ring { border-radius: 16px; border: 2px solid var(--color-primary); box-shadow: 0 0 20px rgba(0,255,65,0.2); }
.vxp-hero__avatar { border-radius: 14px; }
.vxp-hero__avatar-video-wrap { border-radius: 16px; }

/* Section titles with > prefix */
.vxp-section__title { font-size: 14px; text-transform: uppercase; letter-spacing: 3px; font-weight: 500; color: var(--color-primary); }
.vxp-section__title::before { content: '> '; opacity: 0.5; }

/* GitHub-style service cards */
.vxp-services__grid { gap: 12px; }
.vxp-service-card { background: #161B22; border: 1px solid #30363D; border-radius: 8px; overflow: hidden; }
.vxp-service-card:hover { border-color: var(--color-primary); box-shadow: 0 0 16px rgba(0,255,65,0.08); transform: none; }
.vxp-service-card__title { color: #C9D1D9; font-size: 14px; font-weight: 600; }
.vxp-service-card__desc { color: #8B949E; font-size: 12px; }
.vxp-service-card__price { color: var(--color-primary); font-weight: 700; font-size: 16px; }

/* FIX: buttons — dark bg with green text, not bright green bg */
.vxp-service-card__book {
    background: rgba(0,255,65,0.1) !important; border: 1px solid rgba(0,255,65,0.3) !important;
    color: var(--color-primary) !important; border-radius: 6px; font-size: 12px;
    font-family: 'JetBrains Mono', monospace;
}
.vxp-service-card__book:hover {
    background: rgba(0,255,65,0.2) !important; border-color: var(--color-primary) !important;
}

/* FIX: Hero CTA buttons — readable on dark bg */
.vxp-hero__cta-row a, .vxp-hero__cta-row button {
    background: rgba(0,255,65,0.08) !important; color: #C9D1D9 !important;
    border: 1px solid #30363D !important; border-radius: 8px;
    font-family: 'JetBrains Mono', monospace; font-size: 13px;
}
.vxp-hero__cta-row a:hover, .vxp-hero__cta-row button:hover {
    background: rgba(0,255,65,0.15) !important; border-color: var(--color-primary) !important;
    color: var(--color-primary) !important;
}

/* Code-block testimonials */
.vxp-testimonial-card { background: #161B22; border: 1px solid #30363D; border-radius: 8px; position: relative; padding-top: 36px; }
.vxp-testimonial-card::before {
    content: '// review'; position: absolute; top: 10px; left: 16px;
    font-size: 11px; color: #484F58; font-family: 'JetBrains Mono', monospace;
}
.vxp-testimonial-card__text { color: #8B949E; font-size: 13px; line-height: 1.7; }
.vxp-testimonial-card__name { color: #C9D1D9; }

/* Gallery */
.vxp-gallery__grid { gap: 8px; }
.vxp-gallery__item { border-radius: 8px; border: 1px solid #30363D; overflow: hidden; }
.vxp-gallery__item:hover { border-color: var(--color-primary); }

.vxp-about__text { color: #8B949E; line-height: 1.8; font-size: 14px; }

/* Badge styling */
.vxp-hero__ai-badge { background: rgba(0,255,65,0.08); border: 1px solid rgba(0,255,65,0.2); color: var(--color-primary); font-family: 'JetBrains Mono', monospace; font-size: 11px; }
.vxp-badge--verified { background: rgba(0,255,65,0.08); border-color: rgba(0,255,65,0.2); color: var(--color-primary); }

/* Blinking cursor on name */
.vxp-hero__name::after { content: '_'; animation: devBlink 1s step-end infinite; color: var(--color-primary); }
@keyframes devBlink { 0%,100%{opacity:1} 50%{opacity:0} }

.vxp-ai-assistant { background: #161B22; }

/* Social links */
.vxp-hero__social a { color: #8B949E; }
.vxp-hero__social a:hover { color: var(--color-primary); }

/* Scrollbar */
.vxp-body::-webkit-scrollbar { width: 8px; }
.vxp-body::-webkit-scrollbar-track { background: #0D1117; }
.vxp-body::-webkit-scrollbar-thumb { background: #30363D; border-radius: 4px; }
.vxp-body::-webkit-scrollbar-thumb:hover { background: #484F58; }