*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:#fff;color:#171717;overflow-x:hidden}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:#f5f5f5}
::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#06b6d4,#2563eb);border-radius:4px}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes slide-left{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes glow-pulse{0%,100%{box-shadow:0 0 20px rgba(6,182,212,.2)}50%{box-shadow:0 0 40px rgba(37,99,235,.3)}}
@keyframes modal-in{0%{opacity:0;transform:scale(.95) translateY(20px)}100%{opacity:1;transform:scale(1) translateY(0)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes step-in{0%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:translateY(0)}}
@keyframes line-grow{0%{height:0}100%{height:100%}}
@keyframes fade-up{0%{opacity:0;transform:translateY(24px)}100%{opacity:1;transform:translateY(0)}}
@keyframes fade-in-up-sm{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}

.float-anim{animation:float 3s ease-in-out infinite}
.pulse-dot{animation:pulse-dot 2s cubic-bezier(.4,0,.6,1) infinite}
.marquee-track{animation:slide-left 25s linear infinite}
.glow-pulse{animation:glow-pulse 3s ease-in-out infinite}
.modal-animate{animation:modal-in .3s ease-out forwards}
.coming-soon-badge{background:linear-gradient(90deg,#06b6d4,#2563eb);background-size:200% 100%;animation:shimmer 3s linear infinite}

.text-gradient{background:linear-gradient(to right,#171717,#404040,#737373);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.text-gradient-brand{background:linear-gradient(90deg,#06b6d4,#2563eb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.btn-brand{background:linear-gradient(90deg,#06b6d4,#2563eb);color:#fff;transition:all .15s ease}
.btn-brand:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 8px 25px rgba(37,99,235,.3)}
.btn-brand:disabled{opacity:.6;cursor:not-allowed;transform:none}
.btn-ghost{background:transparent;border:1px solid #d4d4d4;color:#404040;transition:all .15s ease}
.btn-ghost:hover{border-color:#2563eb;color:#2563eb}
.nav-link{transition:color .15s ease}.nav-link:hover{color:#2563eb}
.card{background:#fafafa;border:1px solid #e5e5e5;transition:all .3s ease}
.card:hover{border-color:#06b6d4;background:#fff;box-shadow:0 8px 30px rgba(37,99,235,.06)}
.card:hover .card-icon{color:#2563eb}
.card:hover .card-arrow{transform:translateX(6px);color:#2563eb}
.orb{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(6,182,212,.08),transparent 70%);filter:blur(80px);pointer-events:none}
.hub-glow{box-shadow:0 0 30px rgba(6,182,212,.15),0 0 60px rgba(37,99,235,.08)}
.toast{position:fixed;bottom:24px;right:24px;z-index:10001;transform:translateY(100px);opacity:0;transition:all .3s ease}
.toast.show{transform:translateY(0);opacity:1}
.toast.error{border-color:#fecaca}
.mobile-menu{max-height:0;overflow:hidden;transition:max-height .3s ease}
.mobile-menu.open{max-height:700px}
.modal-overlay{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.5);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:16px}
.modal-overlay.active{display:flex}
.section-divider{height:1px;background:linear-gradient(to right,transparent,#e5e5e5,transparent)}

/* Timeline */
.tl-step{opacity:0;animation:step-in .6s ease-out forwards}
.tl-step:nth-child(1){animation-delay:.4s}
.tl-step:nth-child(2){animation-delay:1.5s}
.tl-step:nth-child(3){animation-delay:2.6s}
.tl-step:nth-child(4){animation-delay:3.7s}
.tl-line{height:0;animation:line-grow .8s ease-out forwards;animation-delay:1s}
.tl-line-2{animation-delay:2.1s}
.tl-line-3{animation-delay:3.2s}

.carousel-track{display:flex;transition:transform .5s ease}

/* Otomasyonlar - sonsuz otomatik kayan şerit */
.auto-marquee-wrap{overflow:hidden}
.auto-marquee-wrap:hover .auto-marquee{animation-play-state:paused}

/* Pricing card */
.price-card{position:relative;border-radius:20px;padding:28px 24px;transition:all .3s ease;overflow:hidden}
.price-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;border-radius:20px 20px 0 0;opacity:0;transition:opacity .3s ease}
.price-card:hover::before{opacity:1}
.price-card:hover{transform:translateY(-4px);box-shadow:0 20px 50px rgba(0,0,0,.08)}
.price-card.featured{border:2px solid transparent;background-image:linear-gradient(#fff,#fff),linear-gradient(90deg,#06b6d4,#2563eb);background-origin:border-box;background-clip:padding-box,border-box}
.price-card.featured::before{opacity:1}
.price-card:not(.featured){border:1px solid #e5e5e5;background:#fff}
.price-card:not(.featured)::before{background:linear-gradient(90deg,#06b6d4,#2563eb)}
.price-card:not(.featured):hover{border-color:#06b6d4}

/* Scroll animations */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease-out,transform .6s ease-out}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}
.reveal-delay-4{transition-delay:.4s}

.process-line{position:absolute;top:24px;height:2px;z-index:0;background-image:repeating-linear-gradient(to right,#22d3ee 0,#22d3ee 7px,transparent 7px,transparent 15px);background-color:transparent}

/* Referans kartları */
.ref-card{background:#fff;border:1px solid #e5e5e5;border-radius:16px;padding:24px;transition:all .3s ease}
.ref-card:hover{border-color:#06b6d4;box-shadow:0 10px 30px rgba(37,99,235,.08);transform:translateY(-2px)}
.ref-logo{width:52px;height:52px;border-radius:12px;background:#f5f5f5;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.ref-logo img{width:100%;height:100%;object-fit:contain}

/* Yukarı çık butonu */
.back-to-top{position:fixed;right:20px;bottom:20px;z-index:9999;width:44px;height:44px;border-radius:9999px;background:#171717;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.2);opacity:0;pointer-events:none;transform:translateY(12px) scale(.9);transition:all .25s ease}
.back-to-top.visible{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}
.back-to-top:hover{background:linear-gradient(90deg,#06b6d4,#2563eb);transform:translateY(-2px) scale(1.03)}

/* Modern footer */
.footer-modern{background:#0a0a0a;position:relative;overflow:hidden}
.footer-modern::before{content:'';position:absolute;top:-120px;left:50%;transform:translateX(-50%);width:600px;height:300px;background:radial-gradient(circle,rgba(37,99,235,.12),transparent 70%);filter:blur(60px);pointer-events:none}
.footer-glass{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(10px)}
.footer-link{color:#a3a3a3;transition:color .15s ease,transform .15s ease;display:inline-block}
.footer-link:hover{color:#22d3ee;transform:translateX(2px)}
.footer-social{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;transition:all .2s ease}
.footer-social:hover{background:linear-gradient(90deg,#06b6d4,#2563eb);transform:translateY(-2px)}

/* Hub bölümü tekil buton alanı */
.hub-single-btn{background:linear-gradient(90deg,#06b6d4,#2563eb)}

/* Aylık/Yıllık fiyat geçiş butonu */
.billing-toggle-btn{background:transparent;color:#737373}
.billing-toggle-btn.active{background:linear-gradient(90deg,#06b6d4,#2563eb);color:#fff;box-shadow:0 4px 12px rgba(37,99,235,.25)}

/* Çerez onay banner'ı */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:9997;padding:16px;animation:fade-up .4s ease-out}
.cookie-banner.hidden{display:none}
.cookie-banner-box{max-width:640px;margin:0 auto;background:#171717;border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:0 20px 50px rgba(0,0,0,.35);padding:18px 20px;display:flex;flex-direction:column;gap:14px}
@media (min-width:640px){.cookie-banner-box{flex-direction:row;align-items:center}}
.cookie-btn-reject{background:transparent;border:1px solid rgba(255,255,255,.15);color:#a3a3a3;transition:.15s}
.cookie-btn-reject:hover{border-color:rgba(255,255,255,.3);color:#fff}

/* Form uyarı metni */
.field-error{color:#dc2626;font-size:11px;margin-top:4px;display:none}
.field-error.show{display:block;animation:fade-in-up-sm .2s ease-out}
