*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#FFFFFF;
  --bg2:#F0F9FF;
  --bg3:#E0F2FE;
  --panel:rgba(240,249,255,0.92);
  --cyan:#0EA5E9;
  --cyan2:#0284C7;
  --purple:#7C3AED;
  --purple2:#8B5CF6;
  --amber:#B45309;
  --red:#2563EB;
  --green:#15803D;
  --white:#030B1A;
  --muted:rgba(71,85,105,0.6);
  --dim:rgba(100,116,139,0.35);
  --border:rgba(14,165,233,0.13);
  --border2:rgba(14,165,233,0.28);
  --glow:rgba(14,165,233,0.12);
  --ff:'Inter',sans-serif;
  --fd:'Exo 2',sans-serif;
  --fm:'JetBrains Mono',monospace;
}

html{font-size:16px;scroll-behavior:smooth}
body{font-family:var(--ff);background:var(--bg);color:var(--white);overflow-x:hidden;line-height:1.6}
a:visited{color:inherit}

/* ---- PAGE SWITCHER ---- */
.sw{
  position:fixed;bottom:0;left:0;right:0;z-index:9999;
  display:flex;background:rgba(240,249,255,0.98);
  border-top:1px solid var(--border);backdrop-filter:blur(20px);
}
.swb{
  flex:1;min-width:70px;background:transparent;border:none;border-right:1px solid var(--border);
  color:var(--muted);font-family:var(--fm);font-size:9px;font-weight:500;
  padding:10px 4px;cursor:pointer;transition:all .2s;letter-spacing:.04em;text-transform:uppercase;
}
.swb:hover{color:var(--cyan);background:rgba(14,165,233,0.04)}
.swb.on{color:var(--bg);background:var(--cyan);font-weight:700}

/* ---- PAGES ---- */
.page{display:none;min-height:100vh;padding-bottom:60px}
.page.on{display:block}

/* ---- SCANLINE OVERLAY ---- */
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(14,165,233,0.02) 2px,rgba(14,165,233,0.02) 4px);
}

/* ---- NAV ---- */
nav{
  position:sticky;top:0;z-index:1000;height:72px;
  background:rgba(255,255,255,0.97);border-bottom:1px solid var(--border);
  box-shadow:0 1px 0 rgba(14,165,233,0.08);
  backdrop-filter:blur(24px);
}
.nav-inner{
  max-width:1440px;margin:0 auto;padding:0 40px;
  height:72px;display:flex;align-items:center;gap:0;
}
.nlogo{display:flex;align-items:center;gap:12px;text-decoration:none;padding-right:32px;border-right:1px solid var(--border);flex-shrink:0}
.nlogo-mark{
  width:36px;height:36px;background:var(--red);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--fd);font-size:12px;font-weight:900;color:#fff;
  position:relative;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,0 100%);
}
.nlogo-mark::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,0.15),transparent);
}
.nlogo-text{display:flex;flex-direction:column;line-height:1}
.nlogo-a{font-family:var(--fd);font-size:14px;font-weight:800;color:#030B1A;letter-spacing:.04em}
.nlogo-b{font-size:9px;color:rgba(71,85,105,0.6);letter-spacing:.08em;margin-top:2px;text-transform:uppercase}
.nlinks{display:flex;align-items:center;gap:0;list-style:none;flex:1;padding-left:24px}
.nlinks a{
  color:#334155;text-decoration:none;font-size:12px;font-weight:500;
  padding:8px 16px;letter-spacing:.04em;border-radius:4px;transition:all .2s;
  position:relative;text-transform:uppercase;white-space:nowrap;
}
.nlinks a::after{content:'';position:absolute;bottom:-1px;left:16px;right:16px;height:2px;background:var(--cyan);transform:scaleX(0);transition:transform .2s;border-radius:1px}
.nlinks a:hover{color:var(--cyan)}
.nlinks a:hover::after,.nlinks a.act::after{transform:scaleX(1)}
.nlinks a.act{color:var(--cyan)}
.btn-nav{
  background:transparent;color:var(--cyan);font-family:var(--fd);font-size:11px;font-weight:700;
  padding:9px 22px;border:1px solid var(--border2);letter-spacing:.08em;text-decoration:none;
  flex-shrink:0;transition:all .25s;text-transform:uppercase;cursor:pointer;
  position:relative;overflow:hidden;
}
.btn-nav::before{content:'';position:absolute;inset:0;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .25s;z-index:-1}
.btn-nav:hover{color:#fff}
.btn-nav:hover::before{transform:scaleX(1)}

/* ---- CANVAS ---- */
.canvas-wrap{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.canvas-wrap canvas{position:absolute;inset:0;width:100%;height:100%}

/* ---- GLOW ORBS ---- */
.orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(80px)}
.orb-cyan{background:radial-gradient(ellipse,rgba(14,165,233,0.18),transparent 70%)}
.orb-purple{background:radial-gradient(ellipse,rgba(124,58,237,0.1),transparent 70%)}
.orb-red{background:radial-gradient(ellipse,rgba(37,99,235,0.08),transparent 70%)}

/* ---- GLASS CARD ---- */
.gc{
  background:#ffffff;border:1px solid var(--border);
  backdrop-filter:blur(12px);border-radius:2px;
  transition:border-color .3s,box-shadow .3s;position:relative;overflow:hidden;
}
.gc::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  opacity:0;transition:opacity .3s;
}
.gc:hover{border-color:var(--border2);box-shadow:0 0 24px rgba(14,165,233,0.1)}
.gc:hover::before{opacity:1}

/* ---- GRID PATTERN ---- */
.grid-bg{
  background-image:
    linear-gradient(rgba(14,165,233,0.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(14,165,233,0.04) 1px,transparent 1px);
  background-size:48px 48px;
}
.dot-bg{
  background-image:radial-gradient(circle,rgba(14,165,233,0.08) 1px,transparent 1px);
  background-size:32px 32px;
}

/* ---- BUTTONS ---- */
.btn-primary{
  display:inline-flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,var(--cyan),var(--cyan2));
  color:var(--bg);font-family:var(--fd);font-size:13px;font-weight:700;
  padding:14px 32px;border:none;cursor:pointer;text-decoration:none;
  letter-spacing:.06em;text-transform:uppercase;transition:all .25s;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%);
  position:relative;overflow:hidden;
}
.btn-primary::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,0);transition:background .25s}
.btn-primary:hover::after{background:rgba(255,255,255,0.15)}
.btn-outline{
  display:inline-flex;align-items:center;gap:10px;
  background:transparent;color:var(--white);font-family:var(--fd);font-size:13px;font-weight:600;
  padding:13px 28px;border:1px solid rgba(255,255,255,0.2);cursor:pointer;text-decoration:none;
  letter-spacing:.06em;text-transform:uppercase;transition:all .25s;
}
.btn-outline:hover{border-color:rgba(255,255,255,0.5);background:rgba(255,255,255,0.05)}
.btn-ghost{
  display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:var(--cyan);font-family:var(--fm);font-size:11px;font-weight:500;
  padding:8px 16px;border:1px solid var(--border);cursor:pointer;text-decoration:none;
  letter-spacing:.04em;transition:all .2s;
}
.btn-ghost:hover{border-color:var(--border2);background:rgba(14,165,233,0.06)}

/* ---- SECTION LABELS ---- */
.eyebrow{
  display:flex;align-items:center;gap:10px;
  font-family:var(--fm);font-size:10px;font-weight:600;letter-spacing:.2em;
  color:var(--cyan);text-transform:uppercase;margin-bottom:16px;
}
.eyebrow::before{content:'//';opacity:.5}
.h1{font-family:var(--fd);font-size:clamp(36px,5.5vw,72px);font-weight:900;line-height:1.05;letter-spacing:-.02em;color:#030B1A}
.h2{font-family:var(--fd);font-size:clamp(24px,3.5vw,42px);font-weight:800;line-height:1.1;letter-spacing:-.01em;color:#030B1A}
.h3{font-family:var(--fd);font-size:20px;font-weight:700;line-height:1.2;color:#030B1A}
.grad-text{background:linear-gradient(135deg,#0EA5E9,#7C3AED);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.grad-text-warm{background:linear-gradient(135deg,var(--amber),var(--red));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* ---- TAGS ---- */
.tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--fm);font-size:9px;font-weight:500;padding:4px 10px;letter-spacing:.08em;text-transform:uppercase;border-radius:2px}
.tag-cyan{background:rgba(14,165,233,0.07);color:var(--cyan);border:1px solid rgba(14,165,233,0.18)}
.tag-purple{background:rgba(124,58,237,0.14);color:var(--purple2);border:1px solid rgba(124,58,237,0.25)}
.tag-amber{background:rgba(245,166,35,0.08);color:var(--amber);border:1px solid rgba(245,166,35,0.2)}
.tag-green{background:rgba(0,230,118,0.08);color:var(--green);border:1px solid rgba(0,230,118,0.2)}
.tag-red{background:rgba(37,99,235,0.1);color:#2563EB;border:1px solid rgba(37,99,235,0.25)}
.tag-dot::before{content:'';display:block;width:5px;height:5px;border-radius:50%;background:currentColor;animation:pulse-dot 2s infinite}

/* ---- TABLE ---- */
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{font-family:var(--fm);font-size:9px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:12px 16px;text-align:left;border-bottom:1px solid var(--border);background:rgba(14,165,233,0.04)}
.tbl td{padding:14px 16px;border-bottom:1px solid rgba(14,165,233,0.06);color:#4C1D95;vertical-align:middle;transition:background .15s}
.tbl tr:hover td{background:#F0F9FF;color:#030B1A}

/* ---- INPUTS ---- */
.inp{
  width:100%;background:#fff;border:1px solid var(--border);
  padding:13px 16px;font-family:var(--ff);font-size:14px;color:#030B1A;
  outline:none;transition:border-color .2s,box-shadow .2s;border-radius:2px;
}
.inp:focus{border-color:var(--border2);box-shadow:0 0 0 3px rgba(14,165,233,0.08)}
.inp::placeholder{color:rgba(100,116,139,0.4)}
label.lbl{font-family:var(--fm);font-size:11px;font-weight:500;color:rgba(51,65,85,0.7);display:block;margin-bottom:8px;letter-spacing:.06em;text-transform:uppercase}

/* ---- ANIMATIONS ---- */
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(0.7)}}
@keyframes fade-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes glow-pulse{0%,100%{box-shadow:0 0 20px rgba(14,165,233,0.15)}50%{box-shadow:0 0 40px rgba(14,165,233,0.35)}}
@keyframes border-flow{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes counter-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes scan{0%{transform:translateY(-100%)}100%{transform:translateY(100vh)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes rotate-slow{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes text-reveal{0%{clip-path:inset(0 100% 0 0)}100%{clip-path:inset(0 0% 0 0)}}
@keyframes shimmer{0%{opacity:0.4}50%{opacity:1}100%{opacity:0.4}}

.anim-up{animation:fade-up .6s ease both}
.anim-up-1{animation:fade-up .6s .1s ease both}
.anim-up-2{animation:fade-up .6s .2s ease both}
.anim-up-3{animation:fade-up .6s .3s ease both}
.anim-up-4{animation:fade-up .6s .4s ease both}
.anim-up-5{animation:fade-up .6s .5s ease both}

/* ---- STAT CARD ---- */
.stat-card{
  padding:36px 32px;border-left:1px solid var(--border);background:var(--bg);position:relative;overflow:hidden;
}
.stat-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  animation:shimmer 3s infinite;
}
.stat-n{font-family:var(--fd);font-size:64px;font-weight:900;line-height:1;letter-spacing:-.04em;background:linear-gradient(135deg,#030B1A,#0EA5E9);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.stat-l{font-family:var(--fm);font-size:10px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-top:6px}
.stat-desc{font-size:12px;color:var(--dim);margin-top:4px}

/* ---- INSET ---- */
.inset-cyan{border-left:3px solid var(--cyan);padding:16px 20px;background:rgba(14,165,233,0.05)}

/* ---- PDF VIEWER ---- */
.pdf-ctrl{background:#ffffff;border-bottom:1px solid var(--border);padding:10px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;backdrop-filter:blur(10px)}
.pdf-btn{background:rgba(14,165,233,0.05);border:1px solid var(--border);font-family:var(--fm);font-size:11px;color:var(--muted);padding:6px 14px;cursor:pointer;letter-spacing:.04em;transition:all .2s}
.pdf-btn:hover{background:rgba(14,165,233,0.15);color:var(--cyan);border-color:var(--border2)}

/* ---- FOOTER ---- */
footer{background:#f8f9fa;border-top:1px solid var(--border);padding:40px 0 24px;position:relative;font-family:var(--ff)}
footer::before{content:none}
.foot-h{font-family:var(--ff);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.foot-links{list-style:none;display:flex;flex-direction:column;gap:10px}
.foot-links a{color:#495057;text-decoration:none;font-family:var(--ff);font-size:14px;transition:color .2s;display:flex;align-items:center;gap:6px}
.foot-links a:hover{color:var(--cyan)}
.foot-links a::before{content:none}
.foot-copy{font-family:var(--ff);font-size:12px;color:var(--muted)}

/* ---- CONTAINER ---- */
.wrap{max-width:1440px;margin:0 auto;padding:0 48px}
.sec{padding:80px 48px;max-width:1440px;margin:0 auto}

/* ---- BREADCRUMB ---- */
.bc{display:flex;align-items:center;gap:6px;padding:10px 0;font-family:var(--fm);font-size:10px;color:#A78BFA}
.bc a{color:var(--cyan);text-decoration:none}
.bc span{color:#0EA5E9}

/* ---- ANIMATED BORDER ---- */
.glow-border{
  position:relative;
}
.glow-border::before{
  content:'';position:absolute;inset:-1px;z-index:-1;
  background:linear-gradient(90deg,var(--cyan),var(--purple2),var(--cyan));
  background-size:200%;
  animation:border-flow 3s linear infinite;
  border-radius:3px;
}

/* ---- TERMINAL LINE ---- */
.terminal-line{font-family:var(--fm);font-size:12px;color:#6D28D9;padding:8px 16px;background:rgba(14,165,233,0.04);border:1px solid rgba(14,165,233,0.1);border-left:3px solid var(--cyan);display:flex;align-items:center;gap:8px}
.terminal-line::before{content:'>';color:var(--cyan)}

/* ---- MOBILE ---- */
@media(max-width:768px){
  .wrap,.sec{padding-left:20px;padding-right:20px}
  .nlinks{display:none}
  .h1{font-size:32px}
  .h2{font-size:24px}
  .stat-n{font-size:44px}
}

/* ---- MOBILE MENU ---- */
.mobile-menu-btn{
  display:none;background:transparent;border:1px solid var(--border);
  font-size:22px;color:var(--white);padding:4px 10px;cursor:pointer;flex-shrink:0;
}
.mobile-menu{
  position:fixed;top:0;right:0;width:280px;height:100%;z-index:2000;
  background:#fff;transform:translateX(100%);transition:transform .25s;
  display:flex;flex-direction:column;box-shadow:-4px 0 20px rgba(0,0,0,.08);
}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}
.mobile-menu-close{background:transparent;border:none;font-size:18px;cursor:pointer;color:var(--muted)}
.mobile-menu-links{list-style:none;padding:12px 0;margin:0}
.mobile-menu-links li{border-bottom:1px solid var(--border)}
.mobile-menu-links a{display:block;padding:14px 20px;font-size:14px;color:var(--white);text-decoration:none;transition:background .15s}
.mobile-menu-links a:hover{background:rgba(14,165,233,.04)}
.mobile-login-btn{background:var(--cyan)!important;color:#fff!important;text-align:center;margin:8px 16px;border-radius:0;font-family:var(--fd);font-weight:700;letter-spacing:.04em}
.mobile-menu-overlay{
  position:fixed;inset:0;z-index:1999;background:rgba(0,0,0,.4);
  display:none;
}
.mobile-menu-overlay.open{display:block}

@media(max-width:991px){
  .nlinks{display:none!important}
  .btn-nav{display:none!important}
  .mobile-menu-btn{display:flex;align-items:center}
  .nav-inner{padding:0 16px}
  .wrap,.sec{padding-left:16px!important;padding-right:16px!important}
  .footer-grid{grid-template-columns:1fr!important;gap:24px!important}
}
@media(max-width:640px){
  .h1{font-size:28px!important}
  .h2{font-size:22px!important}
}

/* ---- HERO PARTICLES ---- */
.hero-particle{
  position:absolute;width:3px;height:3px;border-radius:50%;
  background:var(--cyan);opacity:.5;
  animation:hero-float 5s ease-in-out infinite;
}
.hero-particle:nth-child(even){background:var(--purple2);width:2px;height:2px;opacity:.4}
.hero-particle:nth-child(3n){background:var(--amber);width:4px;height:4px;opacity:.25;animation-duration:7s}
.hero-particle:nth-child(4n+1){width:2px;height:2px;opacity:.6;animation-duration:4s}
.hero-particle:nth-child(5n){background:var(--green);width:3px;height:3px;opacity:.2;animation-duration:8s}

@keyframes hero-float{
  0%,100%{transform:translateY(0) scale(1);opacity:.5}
  25%{transform:translateY(-20px) translateX(8px) scale(1.3);opacity:.2}
  50%{transform:translateY(-40px) scale(1.6);opacity:.1}
  75%{transform:translateY(-15px) translateX(-5px) scale(1.2);opacity:.3}
}
@keyframes hero-scan{
  0%,100%{opacity:0;transform:translateY(0)}
  30%{opacity:1}
  70%{opacity:1}
  50%{transform:translateY(30px)}
}

/* ---- HERO DATA STREAMS (dikey akan ışık çizgileri) ---- */
.hero-stream{
  position:absolute;top:-100px;width:1.5px;height:100px;
  background:linear-gradient(to bottom,transparent,var(--cyan),transparent);
  animation:hero-stream-fall 6s linear infinite;
  pointer-events:none;opacity:.3;
}
.hero-stream-purple{background:linear-gradient(to bottom,transparent,var(--purple2),transparent)!important;animation-duration:8s!important;opacity:.25!important}
.hero-stream-amber{background:linear-gradient(to bottom,transparent,var(--amber),transparent)!important;animation-duration:10s!important;opacity:.2!important}

@keyframes hero-stream-fall{
  0%{top:-100px;opacity:0}
  10%{opacity:.3}
  90%{opacity:.3}
  100%{top:110%;opacity:0}
}
