/* ===== Kahve Temalı Animasyonlar (GPU Hızlandırılmış) ===== */

/* Global animasyon katmanı: CPU yerine GPU kullanmaya zorla */
.coffee-steam,
.coffee-pour,
.coffee-drip,
.cup-sway,
.coffee-surface,
.hero h1, .hero-sub, .hero-actions, .hero-visual,
.reveal, .fade-in-up, .btn-coffee-wave,
.drip-effect, .product-card {
    will-change: transform, opacity;
    transform: translateZ(0) rotate(0.001deg);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    perspective: 1000px;
    -webkit-perspective: 1000px;
}

.reveal, .fade-in-up { contain: layout style paint; }

/* Kahve Buharı */
.coffee-steam{position:absolute;bottom:55%;left:50%;width:140px;height:160px;transform:translateX(-50%) translateZ(0);pointer-events:none;z-index:3;contain:layout;}
.steam{position:absolute;bottom:0;width:18px;height:90px;background:radial-gradient(circle,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 70%);border-radius:50%;filter:blur(8px);opacity:0;animation:steamRise 4s cubic-bezier(.42,0,.58,1) infinite;transform:translateZ(0);}
.steam.s1{left:25%;animation-delay:0s}
.steam.s2{left:50%;animation-delay:1.3s;width:22px;height:110px}
.steam.s3{left:72%;animation-delay:2.6s;width:16px;height:80px}
@keyframes steamRise{
    0%{opacity:0;transform:translate3d(0,10px,0) scale(.6);filter:blur(6px)}
    20%{opacity:.7}
    100%{opacity:0;transform:translate3d(0,-120px,0) scale(1.4);filter:blur(18px)}
}

/* Kahve Dökülme */
.coffee-pour{position:absolute;top:0;left:50%;width:60px;height:0;background:linear-gradient(180deg,#3d2b1f 0%,#6f4e37 80%,rgba(111,78,55,0) 100%);transform:translateX(-50%) translateZ(0);border-radius:0 0 50% 50%;box-shadow:0 0 20px rgba(61,43,31,.4);opacity:0;animation:pourAnim 7s cubic-bezier(.45,.05,.55,.95) infinite;pointer-events:none;z-index:3;contain:layout;}
@keyframes pourAnim{
    0%{height:0;opacity:0;top:5%}
    12%{opacity:1;height:0}
    45%{height:55%;opacity:1}
    60%{height:10%;opacity:0;top:50%}
    100%{height:0;opacity:0}
}

/* Kahve Damlası */
.coffee-drip{position:absolute;width:10px;height:14px;background:radial-gradient(circle at 50% 30%,#6f4e37,#3d2b1f);border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;box-shadow:0 4px 8px rgba(61,43,31,.3);opacity:0;animation:drip 3.2s cubic-bezier(.6,.1,.2,1) infinite;transform:translateZ(0);z-index:3;contain:layout;}
.coffee-drip.d1{left:28%;animation-delay:0s}
.coffee-drip.d2{left:50%;animation-delay:1.1s}
.coffee-drip.d3{left:70%;animation-delay:2s}
@keyframes drip{
    0%{opacity:0;top:40%;transform:translate3d(0,0,0) scale(.4)}
    15%{opacity:1}
    80%{opacity:1;transform:translate3d(0,0,0) scale(1)}
    100%{top:90%;opacity:0;transform:translate3d(0,0,0) scale(.8)}
}

/* Genel geçiş efektleri */
.fade-in-up{opacity:0;transform:translate3d(0,30px,0);transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1)}
.fade-in-up.visible{opacity:1;transform:translate3d(0,0,0)}

/* Ürün kartı üzerine gelince kahve damlası efekti */
.product-card{contain:layout style paint;transition:transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s ease;}
.product-card:hover{transform:translate3d(0,-6px,0);}
.product-card:hover .drip-effect{position:absolute;inset:0;pointer-events:none;overflow:hidden;contain:strict;}
.product-card:hover .drip-effect::after{content:'';position:absolute;top:-30px;right:20%;width:8px;height:14px;background:radial-gradient(circle at 50% 30%,#c9a96e,#9c7a43);border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;box-shadow:0 4px 6px rgba(156,122,67,.3);animation:miniDrip 1.6s cubic-bezier(.42,0,.58,1);z-index:5;transform:translateZ(0);}
@keyframes miniDrip{
    0%{opacity:0;top:-20px;transform:translate3d(0,0,0)}
    30%{opacity:1}
    100%{opacity:0;top:110%;transform:translate3d(0,0,0)}
}

/* Buton kahve dalga efekti */
.btn-coffee-wave{position:relative;overflow:hidden;isolation:isolate;}
.btn-coffee-wave::after{content:'';position:absolute;left:50%;top:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.28);transform:translate(-50%,-50%) translateZ(0);transition:width .5s ease,height .5s ease,opacity .8s ease;opacity:0;will-change:width,height,opacity;}
.btn-coffee-wave:active::after{width:300px;height:300px;opacity:0;transition:0s;}

/* Gold glow yavaşça titreşim */
@keyframes popIn{
    0%{opacity:0;transform:translate3d(0,0,0) scale(.5)}
    60%{transform:translate3d(0,0,0) scale(1.08)}
    100%{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes fadeIn{from{opacity:0;transform:translate3d(0,-8px,0)}to{opacity:1;transform:translate3d(0,0,0)}}

/* Scroll reveal */
.reveal{opacity:0;transform:translate3d(0,40px,0);transition:opacity .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1);}
.reveal.visible{opacity:1;transform:translate3d(0,0,0)}
.reveal.delay-1{transition-delay:.1s}
.reveal.delay-2{transition-delay:.2s}
.reveal.delay-3{transition-delay:.3s}

/* Hero başlık yazı efekti */
.hero h1{animation:heroText 1.3s cubic-bezier(.22,.61,.36,1) both;}
.hero-sub{animation:heroText 1.3s .15s cubic-bezier(.22,.61,.36,1) both;}
.hero-actions{animation:heroText 1.3s .3s cubic-bezier(.22,.61,.36,1) both;}
@keyframes heroText{
    from{opacity:0;transform:translate3d(0,24px,0);filter:blur(10px)}
    to{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}
}
/* Hero görsel efekt */
.hero-visual.animatable{animation:heroImage 1.6s .35s cubic-bezier(.22,.61,.36,1) both;}
@keyframes heroImage{
    from{opacity:0;transform:scale(.85) rotate(-4deg) translateZ(0);filter:blur(14px)}
    to{opacity:1;transform:scale(1) rotate(0) translateZ(0);filter:blur(0)}
}

/* Fincan sallanma */
.cup-sway{transform-origin:50% 85%;animation:sway 7s ease-in-out infinite;}
@keyframes sway{
    0%,100%{transform:rotate(-2deg) translateZ(0)}
    50%{transform:rotate(2deg) translateZ(0)}
}

/* Kahve yüzey dalga efekti */
.coffee-surface{position:absolute;bottom:0;left:5%;width:90%;height:30%;background:linear-gradient(180deg,rgba(61,43,31,.92),#3d2b1f);border-radius:50%;filter:blur(.5px);animation:wave 4s ease-in-out infinite;contain:strict;}
@keyframes wave{
    0%,100%{transform:translate3d(0,0,0) scaleX(1)}
    50%{transform:translate3d(0,4px,0) scaleX(1.03)}
}

/* Sessiz mod / azaltılmış hareket tercihi */
@media (prefers-reduced-motion: reduce){
    *,*::before,*::after{
        animation-duration:.001ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.001ms !important;
        scroll-behavior:auto !important;
    }
    .coffee-steam,.coffee-drip,.coffee-pour{display:none !important;}
}