/* ============================================================
   Secyra landing — "wow" katmanı (yalnız EKLEME; style.css'e dokunmaz)
   Palet: --primary / --primary-light / --accent-purple / --secondary (style.css)
   Kapatmak için index.html'den bu dosya ve js/wow.js etiketlerini kaldırmak yeterli.
   ============================================================ */

/* Üst ilerleme çubuğu */
.wow-progress {
    position: fixed; top: 0; left: 0; height: 3px; width: 100%;
    transform-origin: 0 50%; transform: scaleX(0);
    background: linear-gradient(90deg, var(--primary-light), var(--primary), var(--accent-purple));
    box-shadow: 0 0 12px rgba(111, 182, 239, .7);
    z-index: 10001; pointer-events: none;
}

/* İmleç ışığı (yalnız fare olan cihazlarda) */
.wow-cursor-glow {
    position: fixed; left: 0; top: 0; width: 520px; height: 520px; margin: -260px 0 0 -260px;
    border-radius: 50%; pointer-events: none; z-index: 1;
    background: radial-gradient(circle, rgba(46, 134, 201, .16) 0%, rgba(109, 106, 216, .08) 38%, transparent 68%);
    opacity: 0; transition: opacity .4s; will-change: transform;
}
.wow-cursor-glow.on { opacity: 1; }

/* Hero: kareli defter deseni kaldırıldı (parçacık ağı ile çakışıyordu) */
.hero::before { background-image: none !important; }

/* Hero: parçacık ağı */
.wow-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }

/* Hero: akan aurora */
.wow-aurora {
    position: absolute; inset: -20% -10%; z-index: -1; pointer-events: none; opacity: .85;
    background:
        radial-gradient(40% 35% at 20% 30%, rgba(46, 134, 201, .45), transparent 70%),
        radial-gradient(35% 40% at 80% 25%, rgba(109, 106, 216, .40), transparent 70%),
        radial-gradient(45% 40% at 60% 85%, rgba(31, 175, 83, .16), transparent 70%);
    filter: blur(30px); animation: wowAurora 18s ease-in-out infinite alternate;
}
@keyframes wowAurora {
    0%   { transform: translate3d(-3%, -2%, 0) scale(1); }
    50%  { transform: translate3d(3%, 2%, 0) scale(1.08); }
    100% { transform: translate3d(-2%, 3%, 0) scale(1.03); }
}

/* Başlık: akan gradyan */
.hero-title .text-gradient, .section-title .text-gradient {
    background: linear-gradient(90deg, #6FB6EF, #6D6AD8, #2E86C9, #6FB6EF);
    background-size: 300% 100%; -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; animation: wowShift 7s linear infinite;
}
@keyframes wowShift { to { background-position: 300% 0; } }

/* Hero girişi: sırayla beliren satırlar */
.hero-title, .hero-subtitle, .hero-buttons, .hero-trial-cta, .hero-badges { animation: wowRise .9s cubic-bezier(.2, .7, .2, 1) both; }
.hero-subtitle { animation-delay: .12s; }
.hero-buttons { animation-delay: .24s; }
.hero-trial-cta { animation-delay: .34s; }
.hero-badges { animation-delay: .44s; }
@keyframes wowRise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }

/* Düğmeler: parlama süpürmesi + manyetik + nabız */
.hero .btn-primary, .hero .btn-trial { position: relative; overflow: hidden; }
.hero .btn-primary::after, .hero .btn-trial::after {
    content: ''; position: absolute; top: 0; left: -75%; width: 50%; height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .35), transparent);
    transform: skewX(-20deg); animation: wowShine 4.2s ease-in-out infinite; pointer-events: none;
}
@keyframes wowShine { 0%, 55% { left: -75%; } 100% { left: 135%; } }
.hero .btn-trial { animation: wowPulse 2.8s ease-out infinite; }
@keyframes wowPulse {
    0% { box-shadow: 0 0 0 0 rgba(111, 182, 239, .45); }
    70%, 100% { box-shadow: 0 0 0 16px rgba(111, 182, 239, 0); }
}
.wow-magnet { transition: transform .25s cubic-bezier(.2, .7, .2, 1); }

/* Hero sağ: döngü diyagramı 3D eğilme + yüzen cam kartlar */
.hero-image { position: relative; perspective: 1100px; }
.hero-image .cycle-wrap { transition: transform .15s ease-out; transform-style: preserve-3d; will-change: transform; }
.wow-chip {
    position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px;
    padding: 10px 16px; border-radius: 14px; color: #fff; font: 600 13px/1.2 var(--font-family);
    background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .22);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .28); animation: wowBob 6s ease-in-out infinite;
    white-space: nowrap;
}
.wow-chip i { font-size: 18px; color: var(--primary-light); }
.wow-chip small { display: block; font-weight: 500; opacity: .7; font-size: 11px; margin-top: 2px; }
.wow-chip.c1 { left: -9%; top: 0%; }
.wow-chip.c2 { right: -6%; top: 12%; animation-delay: -2s; }
.wow-chip.c3 { right: -4%; bottom: 2%; left: auto; animation-delay: -4s; }
@keyframes wowBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

/* Döngü diyagramı: halka logonun çevresinde döner, simgeler/yazılar dik kalır */
.wow-orbit { position: absolute; inset: 0; transform: rotate(var(--a, 0deg)); pointer-events: none; will-change: transform; }
.wow-orbit .cycle-step { transform: translate(-50%, -50%) rotate(calc(var(--a, 0deg) * -1)); }

/* Akan şerit */
.wow-marquee { position: relative; background: #0A1826; padding: 26px 0 34px; overflow: hidden; }
.wow-marquee::before, .wow-marquee::after { content: ''; position: absolute; top: 0; bottom: 0; width: 120px; z-index: 2; pointer-events: none; }
.wow-marquee::before { left: 0; background: linear-gradient(90deg, #0A1826, transparent); }
.wow-marquee::after { right: 0; background: linear-gradient(-90deg, #0A1826, transparent); }
.wow-track { display: flex; gap: 14px; width: max-content; animation: wowScroll 42s linear infinite; }
.wow-marquee:hover .wow-track { animation-play-state: paused; }
.wow-pill {
    display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px; border-radius: 999px;
    color: #CFE3F5; font: 600 15px/1 var(--font-family);
    background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02));
    border: 1px solid rgba(111, 182, 239, .22);
}
.wow-pill i { color: var(--primary-light); font-size: 17px; }
@keyframes wowScroll { to { transform: translateX(-50%); } }

/* Kartlar: imleci izleyen ışık + 3D eğilme */
.feature-card, .pricing-card, .testimonial-card { --mx: 50%; --my: 50%; --rx: 0deg; --ry: 0deg; position: relative; }
.feature-card:hover { transform: translateY(-8px) perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)); }
.pricing-card:hover, .testimonial-card:hover { transform: translateY(-6px) perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)); }
.wow-spot {
    position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 0; opacity: 0; transition: opacity .3s;
    background: radial-gradient(260px circle at var(--mx) var(--my), rgba(111, 182, 239, .20), transparent 60%);
}
.feature-card:hover > .wow-spot, .pricing-card:hover > .wow-spot, .testimonial-card:hover > .wow-spot { opacity: 1; }
.feature-card:hover { box-shadow: 0 24px 60px rgba(0, 0, 0, .35), 0 0 0 1px rgba(111, 182, 239, .35), 0 0 40px rgba(46, 134, 201, .25); }

/* Bölüm başlıkları: beliren etiket + başlık */
.section-title, .section-subtitle, .section-tag { transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1); }
.wow-hide { opacity: 0; transform: translateY(22px); }
.section-tag { animation: wowPulse 3.4s ease-out infinite; }

/* Telefonlar: yüzen ışıma (mevcut transform'a dokunmadan `translate` ile) */
.phone-card-front { animation: wowFloat 6.5s ease-in-out infinite; }
.phone-card-mid   { animation: wowFloat 7.5s ease-in-out infinite -2s; }
.phone-card-back  { animation: wowFloat 8.5s ease-in-out infinite -4s; }
@keyframes wowFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -14px; } }
.phone-card { box-shadow: 0 30px 70px rgba(0, 0, 0, .45), 0 0 60px rgba(46, 134, 201, .22); }

/* İş akışı */
.workflow-step { transition: transform .35s; }
.workflow-step:hover { transform: translateY(-6px); }

/* Fiyat ve SSS bölümleri: koyu temaya uyum (SSS başlığı açık zeminde görünmüyordu) */
.pricing-section, .faq-section {
    background: radial-gradient(60% 50% at 50% 0%, rgba(46, 134, 201, .18), transparent 70%), linear-gradient(180deg, #0E2237, #0A1826) !important;
}
.pricing-section .section-title, .faq-section .section-title { color: #F0F6FF !important; }
.pricing-section .section-subtitle, .faq-section .section-subtitle { color: #9FB6CC !important; }
.pricing-section .section-tag, .faq-section .section-tag { background: rgba(46, 134, 201, .16) !important; color: #8CC4F2 !important; border-color: rgba(111, 182, 239, .3) !important; }
.pricing-toggle .toggle-label { color: #CFE3F5 !important; }
.pricing-section > .container > p, .pricing-note { color: #9FB6CC !important; }
.pricing-card:not(.pricing-card-popular) { box-shadow: 0 18px 50px rgba(0, 0, 0, .35); }
.pricing-card-popular { box-shadow: 0 24px 70px rgba(46, 134, 201, .35), 0 0 0 1px rgba(111, 182, 239, .5); }

/* Mobil / az hareket */
@media (max-width: 900px) {
    .wow-chip { display: none; }
    .wow-cursor-glow { display: none; }
    .wow-marquee::before, .wow-marquee::after { width: 40px; }
}
@media (prefers-reduced-motion: reduce) {
    .wow-aurora, .wow-chip, .wow-track, .phone-card-front, .phone-card-mid, .phone-card-back,
    .hero .btn-primary::after, .hero .btn-trial::after, .hero .btn-trial, .section-tag,
    .hero-title .text-gradient, .section-title .text-gradient,
    .hero-title, .hero-subtitle, .hero-buttons, .hero-trial-cta, .hero-badges { animation: none !important; }
    .wow-hide { opacity: 1; transform: none; }
}