body {
    font-family: "Inter", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Performans optimizasyonları */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
}

/* GPU hızlandırması sadece animasyonlu elementler için */
.animated-phone-container,
.animate-gradient-pan,
.animate-pulse,
.reveal {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.hero-bg {
    background-color: #f9fafb;
}

.cta-button {
    transition: all 0.3s ease;
}

    .cta-button:hover {
        transform: translateY(-3px) scale(1.05);
        box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.15);
    }

/* Optimize edilmiş Reveal Animasyonları */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.reveal.animating {
    will-change: opacity, transform;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

.soon-badge {
    font-size: 0.65rem;
    padding: 0.1rem 0.5rem;
    border-radius: 9999px;
    font-weight: 600;
    margin-left: 0.5rem;
}

/* Optimize edilmiş Gradient Animasyonu */
@keyframes gradient-pan {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

.animate-gradient-pan {
    background-size: 200% 200%;
    animation: gradient-pan 8s ease-in-out infinite;
}

.animate-gradient-pan.animating {
    will-change: background-position;
}

/* Görünür alan dışında gradient animasyonunu durdur */
.animate-gradient-pan.paused {
    animation-play-state: paused;
}

.team-bg {
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23dbeafe' fill-opacity='0.4'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2-H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
}

/* Organik Ok Çizim Animasyonu */
.hand-drawn-arrow {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    transition: stroke-dashoffset 2s ease-in-out;
}

.reveal.visible .hand-drawn-arrow {
    stroke-dashoffset: 0;
}

/* Premium 3D Telefon Mockup Stilleri */
.perspective-container {
    perspective: 8000px;
}

.phone-3d-container {
    transform-style: preserve-3d;
    transform: rotateX(-10deg) rotateY(25deg) rotateZ(15deg);
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.perspective-container:hover .phone-3d-container {
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.app-gradient-bg {
    background-image: linear-gradient(to bottom, #89cff0, #b6d0e2 70%);
}

/* Optimize edilmiş Telefon Animasyonu */
.animated-phone-container {
    animation: phoneFloat 4s ease-in-out infinite;
}

.animated-phone-container.animating {
    will-change: transform;
}

/* Görünür alan dışında animasyonu durdur */
.animated-phone-container.paused {
    animation-play-state: paused;
}

@keyframes phoneFloat {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-8px);
    }
}


/* Mobil için mockup düzeltmesi - sadece taşmayı önle */
/* Mobil için mockup düzeltmesi - dengeli boyut */
@media (max-width: 1024px) {
    .mobile-mockup-fix {
        max-width: 100% !important;
        height: auto !important;
        transform: scale(4.5) translateX(40px) !important; /* Daha dengeli boyut */
    }
}

@media (max-width: 768px) {
    .mobile-mockup-fix {
        max-width: 100% !important;
        height: auto !important;
        transform: scale(3.5) translateX(25px) !important; /* Daha dengeli boyut */
    }
}

@media (max-width: 640px) {
    .mobile-mockup-fix {
        max-width: 100% !important;
        height: auto !important;
        transform: scale(2.8) translateX(15px) !important; /* Daha dengeli boyut */
    }
}