/* ============================================
   BOA CONTA — MODERN PREMIUM EFFECTS
   ============================================ */

/* --- Animated Gradient Background Blobs --- */
.gradient-blobs {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: -1;
    pointer-events: none;
}
.gradient-blobs::before,
.gradient-blobs::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.35;
    animation: blob-morph 12s ease-in-out infinite alternate;
}
.gradient-blobs::before {
    width: 500px; height: 500px;
    background: radial-gradient(circle, var(--primary), transparent 70%);
    top: -10%; left: -10%;
    animation-delay: 0s;
}
.gradient-blobs::after {
    width: 400px; height: 400px;
    background: radial-gradient(circle, var(--accent), transparent 70%);
    bottom: -10%; right: -10%;
    animation-delay: -6s;
}
@keyframes blob-morph {
    0% { transform: translate(0,0) scale(1); }
    33% { transform: translate(60px,-40px) scale(1.1); }
    66% { transform: translate(-30px,50px) scale(0.9); }
    100% { transform: translate(20px,-20px) scale(1.05); }
}

/* --- Glassmorphism --- */
.glass {
    background: rgba(255,255,255,0.07);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255,255,255,0.15);
    box-shadow: 0 8px 32px 0 rgba(0,0,0,0.15);
}
.glass-dark {
    background: rgba(15,23,42,0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255,255,255,0.08);
}

/* --- Navbar Glassmorphism Upgrade --- */
.navbar.scrolled {
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border-bottom: 1px solid rgba(0,0,0,0.05);
}
[data-theme="dark"] .navbar.scrolled {
    background: rgba(15,23,42,0.85);
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* --- 3D Tilt Cards --- */
.tilt-card {
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.tilt-card .tilt-shine {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(255,255,255,0.25) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: 2;
}
.tilt-card:hover .tilt-shine { opacity: 1; }

/* --- Magnetic Buttons --- */
.magnetic-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}
.magnetic-btn::before {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: inherit;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    opacity: 0;
    filter: blur(12px);
    transition: opacity 0.3s ease;
    z-index: -1;
}
.magnetic-btn:hover::before { opacity: 0.6; }

/* --- Glow Buttons --- */
.btn-glow {
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.btn-glow::after {
    content: '';
    position: absolute;
    inset: -2px;
    background: linear-gradient(90deg, var(--primary), var(--accent), var(--primary));
    background-size: 200% 100%;
    border-radius: inherit;
    z-index: -1;
    animation: glow-shift 3s linear infinite;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.btn-glow:hover::after { opacity: 1; }
@keyframes glow-shift {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

/* --- Typewriter Text --- */
.typewriter {
    overflow: hidden;
    border-right: 3px solid var(--primary);
    white-space: nowrap;
    animation: typing 3s steps(40, end), blink-caret 0.75s step-end infinite;
}
@keyframes typing { from { width: 0; } to { width: 100%; } }
@keyframes blink-caret { 50% { border-color: transparent; } }

/* --- Text Reveal (Clip-path) --- */
.reveal-text {
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
    transition: clip-path 0.8s cubic-bezier(0.77, 0, 0.175, 1);
}
.reveal-text.visible {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

/* --- Stagger Fade Up --- */
.stagger-item {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}
.stagger-item.visible {
    opacity: 1;
    transform: translateY(0);
}

/* --- Floating Animation --- */
.float-slow { animation: float 6s ease-in-out infinite; }
.float-medium { animation: float 4s ease-in-out infinite; }
.float-fast { animation: float 2.5s ease-in-out infinite; }
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

/* --- Shimmer / Shine on Numbers --- */
.shimmer {
    background: linear-gradient(90deg, var(--text-primary) 0%, var(--primary) 50%, var(--text-primary) 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer-move 3s linear infinite;
}
@keyframes shimmer-move {
    0% { background-position: 200% center; }
    100% { background-position: -200% center; }
}

/* --- Particle Canvas --- */
#particles-canvas {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

/* --- Cursor Glow --- */
.cursor-glow {
    position: fixed;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(37,99,235,0.08) 0%, transparent 70%);
    pointer-events: none;
    z-index: 9998;
    transform: translate(-50%, -50%);
    transition: opacity 0.3s ease;
}

/* --- 3D Testimonial Carousel --- */
.carousel-3d {
    perspective: 1200px;
    overflow: visible;
}
.carousel-3d-inner {
    transform-style: preserve-3d;
    transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}
.carousel-3d-item {
    backface-visibility: hidden;
    transition: all 0.6s ease;
}
.carousel-3d-item.active {
    transform: translateZ(150px) scale(1);
    opacity: 1;
}
.carousel-3d-item.prev,
.carousel-3d-item.next {
    transform: translateX(-80%) translateZ(-100px) rotateY(25deg) scale(0.85);
    opacity: 0.5;
    filter: blur(1px);
}
.carousel-3d-item.next {
    transform: translateX(80%) translateZ(-100px) rotateY(-25deg) scale(0.85);
}
.carousel-3d-item.hidden {
    transform: translateZ(-200px) scale(0.7);
    opacity: 0;
}

/* --- Parallax Layers --- */
.parallax-slow { will-change: transform; }
.parallax-fast { will-change: transform; }

/* --- Scroll Progress Bar --- */
.scroll-progress {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--primary), var(--accent));
    transform-origin: left;
    z-index: 9999;
    transform: scaleX(0);
}

/* --- Hero Stats Counter Animation --- */
.counter-value {
    display: inline-block;
    font-variant-numeric: tabular-nums;
}

/* --- Loading Skeleton Pulse (for dynamic content feel) --- */
.skeleton-pulse {
    background: linear-gradient(90deg, var(--bg-secondary) 25%, var(--bg-tertiary) 50%, var(--bg-secondary) 75%);
    background-size: 200% 100%;
    animation: skeleton-load 1.5s ease-in-out infinite;
}
@keyframes skeleton-load {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* --- Hover Lift with Shadow --- */
.hover-lift {
    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s ease;
}
.hover-lift:hover {
    transform: translateY(-12px);
    box-shadow: 0 25px 50px -12px rgba(37,99,235,0.2);
}

/* --- Rotating Border Gradient --- */
.rotating-border {
    position: relative;
    border-radius: var(--radius-lg);
}
.rotating-border::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: conic-gradient(from 0deg, var(--primary), var(--accent), var(--primary));
    animation: rotate-border 4s linear infinite;
    z-index: -1;
}
.rotating-border::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background: var(--bg-primary);
    z-index: -1;
}
@keyframes rotate-border {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* --- Smooth Image Reveal --- */
.img-reveal {
    position: relative;
    overflow: hidden;
}
.img-reveal::after {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--bg-primary);
    transform: translateY(0);
    transition: transform 1s cubic-bezier(0.77, 0, 0.175, 1);
}
.img-reveal.visible::after {
    transform: translateY(100%);
}

/* --- Noise Texture Overlay for premium feel --- */
.noise-overlay::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    opacity: 0.03;
    pointer-events: none;
    z-index: 1;
}

/* --- Responsive for modern effects --- */
@media (max-width: 768px) {
    .cursor-glow { display: none; }
    .carousel-3d-item.prev,
    .carousel-3d-item.next { display: none; }
}