/* ============================================================
   GETCORD+ — landing page stylesheet
   Tema: koyu ink-mor + nane (mint) parıltısı, pixel ruhu
   ============================================================ */

:root{
  --bg:        #07050f;
  --bg-2:      #0c0918;
  --panel:     #100d1f;
  --line:      rgba(167,139,250,.16);
  --line-soft: rgba(167,139,250,.09);
  --violet:    #7c5cff;
  --purple:    #a78bfa;
  --mint:      #5ff2c0;
  --mint-soft: rgba(95,242,192,.14);
  --text:      #f4f2ff;
  --muted:     #a5a1c2;
  --ease:      cubic-bezier(.19,1,.22,1);
  --font-d:    "Unbounded", sans-serif;
  --font-b:    "Manrope", sans-serif;
  --font-m:    "JetBrains Mono", monospace;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; overflow-x:hidden; }
html,body{ background:var(--bg); }
body{
  font-family:var(--font-b);
  color:var(--text);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body:not(.loaded){ overflow:hidden; }
::selection{ background:rgba(124,92,255,.55); color:#fff; }
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--bg); }
::-webkit-scrollbar-thumb{ background:#241d40; border-radius:8px; border:2px solid var(--bg); }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ width:min(1200px, 92vw); margin-inline:auto; }

/* ---------- arka plan dokusu ---------- */
.grain{
  position:fixed; inset:0; z-index:60; pointer-events:none; opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}
.bg-glow{ position:fixed; inset:0; z-index:-1; overflow:hidden; background:
  radial-gradient(1000px 600px at 85% -10%, rgba(124,92,255,.16), transparent 60%),
  radial-gradient(800px 500px at -10% 30%, rgba(95,242,192,.07), transparent 60%),
  linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 50%, var(--bg) 100%);
}
.glow{ position:absolute; border-radius:50%; filter:blur(70px); opacity:.5; will-change:transform; transform:translateZ(0); }
.g1{ width:520px; height:520px; top:-140px; right:-80px; background:rgba(124,92,255,.28); }
.g2{ width:420px; height:420px; top:34%; left:-160px; background:rgba(95,242,192,.10); }
.g3{ width:560px; height:560px; bottom:-200px; right:12%; background:rgba(124,92,255,.14); }

/* ---------- preloader ---------- */
.preloader{
  position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center;
  background:var(--bg); transition:transform .7s var(--ease), opacity .7s var(--ease);
}
.preloader.hide{ transform:translateY(-100%); opacity:0; pointer-events:none; }
.pre-inner{ display:flex; flex-direction:column; align-items:center; gap:22px; }
.pre-logo-wrap{ position:relative; width:116px; height:116px; }
.pre-logo{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; mix-blend-mode:screen; }
.pre-logo.pix{ image-rendering:pixelated; animation:prePix .55s steps(4) both; }
.pre-logo.full{ opacity:0; transition:opacity .4s ease; filter:drop-shadow(0 0 26px rgba(95,242,192,.4)); }
.preloader.done .pre-logo.full{ opacity:1; }
.preloader.done .pre-logo.pix{ opacity:0; }
.pre-px{ position:absolute; width:8px; height:8px; border-radius:2px; background:var(--mint); box-shadow:0 0 10px rgba(95,242,192,.8); opacity:0; animation:prePx 1.1s ease-in-out infinite; }
.pre-px.p1{ top:-18px; left:14px; }
.pre-px.p2{ top:26px; right:-20px; animation-delay:.25s; background:var(--violet); box-shadow:0 0 10px rgba(124,92,255,.8); }
.pre-px.p3{ bottom:-16px; left:28px; animation-delay:.5s; background:var(--purple); box-shadow:0 0 10px rgba(167,139,250,.8); }
.pre-px.p4{ bottom:20px; right:4px; animation-delay:.75s; }
@keyframes prePx{ 0%,100%{ opacity:0; } 50%{ opacity:.95; } }
@keyframes preGlow{ 0%,100%{ filter:drop-shadow(0 0 18px rgba(95,242,192,.35)); } 50%{ filter:drop-shadow(0 0 34px rgba(124,92,255,.6)); } }
.pre-bottom{ display:flex; flex-direction:column; align-items:center; gap:13px; margin-top:8px; }
.pre-bar{ width:220px; height:3px; border-radius:99px; background:rgba(255,255,255,.08); overflow:hidden; }
.pre-bar span{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--violet),var(--mint)); }
.pre-count{ font-family:var(--font-m); font-size:.72rem; letter-spacing:.3em; color:var(--mint); }

/* ---------- nav ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .35s ease, border-color .35s ease, backdrop-filter .35s ease;
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(7,5,15,.72); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom-color:var(--line-soft);
}
.nav-inner{ display:flex; align-items:center; gap:34px; height:74px; }
.brand{ display:flex; align-items:center; gap:11px; }
.brand-logo{ width:38px; height:38px; object-fit:contain; mix-blend-mode:screen; transition:transform .4s var(--ease); }
.brand:hover .brand-logo{ transform:rotate(-6deg) scale(1.08); }
.brand-name{ font-family:var(--font-d); font-weight:700; font-size:1.05rem; letter-spacing:.01em; }
.brand-name em{ font-style:normal; color:var(--mint); }
.nav-links{ display:flex; gap:28px; margin-inline:auto; }
.nav-links a{
  font-size:.92rem; font-weight:600; color:var(--muted); position:relative; transition:color .3s;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:-6px; width:0; height:2px; border-radius:2px;
  background:linear-gradient(90deg,var(--violet),var(--mint)); transition:width .35s var(--ease);
}
.nav-links a:hover{ color:var(--text); }
.nav-links a:hover::after{ width:100%; }
.nav-actions{ display:flex; gap:10px; align-items:center; }
.nav-burger{ display:none; background:none; border:0; cursor:pointer; padding:10px; flex-direction:column; gap:5px; margin-left:auto; }
.nav-burger span{ width:22px; height:2px; background:var(--text); border-radius:2px; transition:.35s var(--ease); }
.nav-burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2){ opacity:0; }
.nav-burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.nav-panel{
  display:none; position:fixed; top:74px; left:0; right:0; z-index:99; flex-direction:column; gap:4px;
  background:rgba(9,6,18,.97); backdrop-filter:blur(20px); border-bottom:1px solid var(--line);
  padding:18px 6vw 26px; transform:translateY(-12px); opacity:0; pointer-events:none; transition:.4s var(--ease);
}
.nav-panel.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
.nav-panel > a{ padding:13px 4px; font-weight:700; font-size:1.05rem; border-bottom:1px solid var(--line-soft); }
.nav-panel-cta{ display:flex; gap:10px; margin-top:18px; }
.nav-panel-cta .btn{ flex:1; justify-content:center; }

/* ---------- butonlar ---------- */
.btn{
  display:inline-flex; align-items:center; gap:9px; justify-content:center;
  font-family:var(--font-b); font-weight:700; border-radius:99px; cursor:pointer; border:0;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .35s, border-color .35s, color .35s;
  will-change:transform;
}
.btn svg{ width:17px; height:17px; }
.btn.sm{ padding:9px 20px; font-size:.88rem; }
.btn.lg{ padding:15px 30px; font-size:1rem; }
.btn.primary{
  color:#fff; background:linear-gradient(135deg,#7c5cff 0%, #9a6bff 100%);
  box-shadow:0 10px 34px rgba(124,92,255,.38), inset 0 1px 0 rgba(255,255,255,.25);
}
.btn.primary:hover{ transform:translateY(-3px); box-shadow:0 18px 44px rgba(124,92,255,.5), inset 0 1px 0 rgba(255,255,255,.25); }
.btn.primary:active{ transform:translateY(-1px) scale(.98); }
.btn.ghost{
  color:var(--text); background:rgba(255,255,255,.04); border:1px solid var(--line);
}
.btn.ghost:hover{ border-color:rgba(95,242,192,.45); color:var(--mint); transform:translateY(-3px); background:rgba(95,242,192,.05); }

/* ---------- ortak ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-m); font-size:.7rem; font-weight:600; letter-spacing:.28em; color:var(--purple);
}
.dot{ width:7px; height:7px; background:var(--mint); border-radius:2px; box-shadow:0 0 12px rgba(95,242,192,.8); animation:dotPulse 2.4s infinite; }
@keyframes dotPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }
.grad{
  background:linear-gradient(92deg,var(--purple) 10%, var(--mint) 90%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
}
h1,h2,h3{ font-family:var(--font-d); font-weight:700; line-height:1.12; letter-spacing:-.01em; }
h2{ font-size:clamp(1.7rem, 3.6vw, 2.7rem); }
.sec-head{ max-width:640px; margin-bottom:56px; }
.sec-head h2{ margin:18px 0 14px; }
.sec-sub{ color:var(--muted); font-size:1.05rem; }
.section{ padding:clamp(64px, 7vw, 96px) 0; position:relative; }

/* scroll reveal */
[data-reveal]{ opacity:0; transform:translateY(30px); transition:opacity .9s var(--ease), transform .9s var(--ease); transition-delay:var(--d, 0s); }
[data-reveal].in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1 !important; transform:none !important; }
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}

/* ---------- hero ---------- */
.hero{ position:relative; padding:150px 0 90px; overflow-x:clip; }
.hero-inner{ display:grid; grid-template-columns:.9fr 1.1fr; gap:36px; align-items:center; }
.hero-badge{
  background:rgba(124,92,255,.1); border:1px solid var(--line); border-radius:99px;
  padding:9px 18px; font-size:.66rem; margin-bottom:26px;
}
.hero-title{ font-size:clamp(2.1rem, 5vw, 4rem); font-weight:800; margin-bottom:24px; }
.hero-title .line{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.hero-title .line-in{
  display:block; transform:translateY(115%);
  will-change:transform;
}
body.loaded .hero-title .line:nth-child(1) .line-in{ animation:lineUp 1s var(--ease) .15s forwards; }
body.loaded .hero-title .line:nth-child(2) .line-in{ animation:lineUp 1s var(--ease) .3s forwards; }
@keyframes lineUp{ to{ transform:translateY(0); } }
.hero-sub{ color:var(--muted); font-size:1.1rem; max-width:470px; margin-bottom:34px; }
.hero-sub strong{ color:var(--text); }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.hero-ctas.center{ justify-content:center; }
.hero-note{ font-size:.82rem; color:#7c7896; }

/* ---------- hero mockup ---------- */
.hero-stage{ position:relative; perspective:1200px; }
.mockup-wrap{ position:relative; z-index:2; transform-style:preserve-3d; will-change:transform; }
.mockup{
  position:relative; border-radius:18px; overflow:hidden;
  background:linear-gradient(180deg, #141126, #0d0a1b);
  border:1px solid rgba(167,139,250,.22);
  box-shadow:0 40px 90px rgba(0,0,0,.6), 0 0 0 1px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06);
  animation:floaty 7s ease-in-out infinite;
}
@keyframes floaty{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }
.mock-top{ display:flex; align-items:center; gap:8px; padding:13px 16px; border-bottom:1px solid var(--line-soft); background:rgba(255,255,255,.02); }
.tdot{ width:11px; height:11px; border-radius:50%; }
.tdot.r{ background:#ff5f57; } .tdot.y{ background:#febc2e; } .tdot.g{ background:#28c840; }
.mock-url{
  margin-left:14px; font-family:var(--font-m); font-size:.68rem; color:#6f6a90;
  background:rgba(255,255,255,.04); border:1px solid var(--line-soft); border-radius:99px; padding:5px 16px;
}
.mock-body{ display:grid; grid-template-columns:54px 158px 1fr 148px; min-height:420px; }
.mock-rail{
  background:rgba(0,0,0,.28); border-right:1px solid var(--line-soft);
  display:flex; flex-direction:column; align-items:center; gap:12px; padding:14px 0;
}
.srv{
  width:42px; height:42px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-d); font-size:.8rem; font-weight:700; color:#fff; cursor:pointer;
  background:rgba(255,255,255,.06); transition:border-radius .35s var(--ease), background .35s;
  position:relative;
}
.srv:hover{ border-radius:11px; background:rgba(167,139,250,.25); }
.srv.active{ background:linear-gradient(135deg,var(--violet),#9a6bff); border-radius:12px; box-shadow:0 6px 18px rgba(124,92,255,.4); }
.srv.active::before{ content:""; position:absolute; left:-11px; width:3px; height:26px; background:var(--mint); border-radius:3px; }
.srv.add{ color:var(--mint); }
.srv.add svg{ width:18px; height:18px; }
.mock-channels{ background:rgba(0,0,0,.18); border-right:1px solid var(--line-soft); padding:16px 12px; }
.ch-head{ font-family:var(--font-d); font-size:.78rem; font-weight:700; display:flex; align-items:center; justify-content:space-between; padding:4px 6px 14px; }
.chev{ color:var(--muted); font-size:.7rem; }
.ch-cat{ font-family:var(--font-m); font-size:.58rem; letter-spacing:.2em; color:#6f6a90; margin:12px 6px 8px; }
.ch{
  display:flex; align-items:center; gap:8px; font-size:.84rem; font-weight:600; color:#8f8bad;
  padding:7px 9px; border-radius:8px; cursor:pointer; transition:.3s;
}
.ch:hover{ color:var(--text); background:rgba(255,255,255,.05); }
.ch.active{ color:#fff; background:rgba(124,92,255,.22); }
.ch.voice svg{ width:14px; height:14px; color:var(--mint); }
.ch.voice b{ margin-left:auto; font-size:.66rem; color:var(--mint); background:rgba(95,242,192,.12); padding:2px 8px; border-radius:99px; }
.mock-chat{ display:flex; flex-direction:column; min-width:0; }
.chat-head{
  display:flex; align-items:center; gap:9px; padding:13px 16px; font-weight:700; font-size:.9rem;
  border-bottom:1px solid var(--line-soft); background:rgba(255,255,255,.015);
}
.chat-head .hash{ color:var(--muted); font-size:1.1rem; }
.chat-head .head-right{ margin-left:auto; color:var(--muted); display:flex; }
.chat-head .head-right svg{ width:16px; height:16px; }
.chat-msgs{ flex:1; padding:16px; display:flex; flex-direction:column; gap:12px; overflow:hidden; justify-content:flex-end; min-height:250px; }
.msg{ display:flex; gap:10px; align-items:flex-start; animation:msgIn .5s var(--ease) both; }
@keyframes msgIn{ from{ opacity:0; transform:translateY(14px) scale(.97); } to{ opacity:1; transform:none; } }
.msg.out{ flex-direction:row-reverse; }
.msg .ava{ width:30px; height:30px; font-size:.72rem; flex-shrink:0; }
.msg-body{ max-width:85%; }
.msg-name{ font-size:.66rem; font-weight:700; color:#8f8bad; margin-bottom:3px; display:block; }
.msg.out .msg-name{ text-align:right; }
.msg-bubble{
  background:rgba(255,255,255,.06); border:1px solid var(--line-soft); border-radius:4px 14px 14px 14px;
  padding:9px 13px; font-size:.85rem; line-height:1.45;
}
.msg.out .msg-bubble{ background:linear-gradient(135deg, rgba(124,92,255,.32), rgba(154,107,255,.24)); border-color:rgba(124,92,255,.4); border-radius:14px 4px 14px 14px; }
.msg-file{
  display:flex; align-items:center; gap:9px; background:rgba(255,255,255,.05); border:1px dashed rgba(167,139,250,.4);
  border-radius:12px; padding:9px 13px; font-size:.78rem; color:#cfcbe8;
}
.msg-file svg{ width:15px; height:15px; color:var(--purple); flex-shrink:0; }
.typing{ display:inline-flex; gap:4px; padding:12px 15px; background:rgba(255,255,255,.06); border-radius:14px 14px 14px 4px; }
.typing span{ width:6px; height:6px; border-radius:50%; background:var(--purple); animation:tp 1s infinite; }
.typing span:nth-child(2){ animation-delay:.15s; } .typing span:nth-child(3){ animation-delay:.3s; }
@keyframes tp{ 0%,100%{ transform:translateY(0); opacity:.5; } 50%{ transform:translateY(-5px); opacity:1; } }
.chat-input{
  display:flex; align-items:center; gap:10px; margin:0 16px 16px; padding:11px 14px;
  background:rgba(255,255,255,.05); border:1px solid var(--line-soft); border-radius:12px; color:#6f6a90;
}
.ci-plus{ font-size:1.1rem; color:var(--mint); }
.ci-text{ font-size:.82rem; flex:1; }
.chat-input svg{ width:15px; height:15px; color:var(--purple); }
.mock-members{ background:rgba(0,0,0,.18); border-left:1px solid var(--line-soft); padding:16px 12px; }
.member{ display:flex; align-items:center; gap:10px; padding:8px 6px; border-radius:10px; cursor:pointer; transition:.3s; }
.member:hover{ background:rgba(255,255,255,.05); }
.member .ava{ width:30px; height:30px; font-size:.7rem; }
.member b{ display:block; font-size:.8rem; }
.member i{ display:block; font-style:normal; font-size:.66rem; color:#6f6a90; }
.member.idle .ava{ opacity:.45; }
.ava{
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  font-family:var(--font-d); font-weight:700; color:#fff; flex-shrink:0;
}
.a1{ background:linear-gradient(135deg,#ff7ab8,#b860ff); }
.a2{ background:linear-gradient(135deg,#38bdf8,#6366f1); }
.a3{ background:linear-gradient(135deg,var(--violet),#c084fc); }
.a4{ background:linear-gradient(135deg,#34d399,#0ea5e9); }
.a5{ background:linear-gradient(135deg,#fb923c,#f43f5e); }
.mock-glow{
  position:absolute; inset:-10% -6%; z-index:-1;
  background:radial-gradient(60% 60% at 50% 40%, rgba(124,92,255,.3), transparent 70%);
  filter:blur(50px);
}
/* uçan pixel parçacıkları */
.pixels{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.pixels i{
  position:absolute; width:var(--s,8px); height:var(--s,8px); opacity:0; border-radius:2px;
  background:var(--c,var(--mint)); box-shadow:0 0 14px var(--c,var(--mint));
  animation:pixelFloat var(--t,9s) linear var(--dl,0s) infinite;
}
@keyframes pixelFloat{
  0%{ transform:translateY(40px) rotate(0deg); opacity:0; }
  12%{ opacity:.75; }
  85%{ opacity:.4; }
  100%{ transform:translateY(-190px) rotate(160deg); opacity:0; }
}

/* ---------- marquee ---------- */
.marquee{
  border-block:1px solid var(--line-soft); padding:26px 0; overflow:hidden;
  background:rgba(124,92,255,.04); position:relative;
}
.mq-track{
  display:flex; align-items:center; gap:44px; width:max-content; will-change:transform;
  animation:mq 38s linear infinite;
}
.marquee:hover .mq-track{ animation-play-state:paused; }
@keyframes mq{ to{ transform:translateX(-50%); } }
.mq-item{
  font-family:var(--font-d); font-weight:600; font-size:1.05rem; letter-spacing:.14em; white-space:nowrap;
  color:#57527a;
}
.mq-item:nth-child(4n+3){ color:var(--mint); -webkit-text-fill-color:var(--mint); }
.mq-sq{ width:9px; height:9px; background:var(--violet); border-radius:2px; flex-shrink:0; box-shadow:0 0 10px rgba(124,92,255,.7); }

/* ---------- bento ---------- */
.bento{ display:grid; grid-template-columns:repeat(12,1fr); gap:18px; }
.bcard{
  grid-column:span 6; background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  border:1px solid var(--line-soft); border-radius:22px; padding:30px; position:relative; overflow:hidden;
  transition:transform .5s var(--ease), border-color .5s, box-shadow .5s;
}
.bcard:hover{ transform:translateY(-6px); border-color:rgba(167,139,250,.35); box-shadow:0 24px 60px rgba(0,0,0,.4); }
.bcard::after{
  content:""; position:absolute; top:0; left:8%; right:8%; height:1px;
  background:linear-gradient(90deg, transparent, rgba(167,139,250,.5), transparent);
}
.span7{ grid-column:span 7; } .span5{ grid-column:span 5; }
.bcard h3{ font-size:1.15rem; margin-bottom:10px; }
.bcard p{ color:var(--muted); font-size:.95rem; }
.bcard-vis{
  height:150px; margin-bottom:22px; border-radius:14px; background:rgba(0,0,0,.25);
  border:1px solid var(--line-soft); display:flex; align-items:center; justify-content:center; overflow:hidden; padding:18px;
}
.mini-chat{ display:flex; flex-direction:column; gap:9px; width:100%; max-width:320px; }
.mb{
  font-size:.8rem; padding:8px 13px; border-radius:12px; background:rgba(255,255,255,.06); max-width:85%;
  animation:msgIn .6s var(--ease) both;
}
.mb.left{ align-self:flex-start; border-bottom-left-radius:4px; display:flex; gap:8px; align-items:center; }
.mb.left .ava{ width:22px; height:22px; font-size:.58rem; }
.mb.right{ align-self:flex-end; background:linear-gradient(135deg, rgba(124,92,255,.35), rgba(154,107,255,.25)); border-bottom-right-radius:4px; }
.mb .seen{ color:var(--mint); font-size:.7rem; letter-spacing:-2px; }
.wave{ display:flex; align-items:center; gap:6px; height:64px; }
.wave span{
  width:7px; border-radius:99px; background:linear-gradient(180deg,var(--mint),var(--violet));
  animation:wv 1.15s ease-in-out infinite; box-shadow:0 0 12px rgba(95,242,192,.3);
}
.wave span:nth-child(1){ height:22%; animation-delay:0s; } .wave span:nth-child(2){ height:55%; animation-delay:.1s; }
.wave span:nth-child(3){ height:80%; animation-delay:.2s; } .wave span:nth-child(4){ height:45%; animation-delay:.3s; }
.wave span:nth-child(5){ height:95%; animation-delay:.4s; } .wave span:nth-child(6){ height:60%; animation-delay:.5s; }
.wave span:nth-child(7){ height:35%; animation-delay:.55s; } .wave span:nth-child(8){ height:75%; animation-delay:.45s; }
.wave span:nth-child(9){ height:50%; animation-delay:.35s; } .wave span:nth-child(10){ height:88%; animation-delay:.25s; }
.wave span:nth-child(11){ height:40%; animation-delay:.15s; } .wave span:nth-child(12){ height:25%; animation-delay:.05s; }
@keyframes wv{ 0%,100%{ transform:scaleY(.55); } 50%{ transform:scaleY(1.25); } }
.filechip{
  display:flex; align-items:center; gap:11px; background:rgba(255,255,255,.05); border:1px solid var(--line-soft);
  border-radius:12px; padding:11px 15px; width:100%; max-width:300px;
}
.filechip svg{ width:17px; height:17px; color:var(--mint); flex-shrink:0; }
.fc-meta{ flex:1; min-width:0; } .fc-meta b{ display:block; font-size:.78rem; } .fc-meta i{ font-style:normal; font-size:.66rem; color:#6f6a90; }
.fc-check{ color:var(--mint); font-weight:800; }
.fc-bar{ height:4px; width:100%; max-width:300px; background:rgba(255,255,255,.07); border-radius:99px; overflow:hidden; margin-top:10px; position:absolute; bottom:24px; left:50%; transform:translateX(-50%); }
.bcard-vis{ position:relative; }
.fc-bar span{ display:block; height:100%; width:35%; background:linear-gradient(90deg,var(--violet),var(--mint)); animation:fcSlide 2.6s var(--ease) infinite; }
@keyframes fcSlide{ 0%{ width:8%; } 60%{ width:92%; } 75%,100%{ width:92%; opacity:0; } }
.mini-chans{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.mc{
  font-family:var(--font-m); font-size:.7rem; color:#8f8bad; background:rgba(255,255,255,.05);
  border:1px solid var(--line-soft); padding:7px 13px; border-radius:99px; transition:.3s;
}
.mc:hover{ color:var(--text); border-color:rgba(167,139,250,.4); }
.mc.on{ color:var(--mint); border-color:rgba(95,242,192,.4); background:var(--mint-soft); }
.mc.new{ color:var(--purple); border-style:dashed; }
.shield{ width:76px; height:76px; color:var(--mint); filter:drop-shadow(0 0 22px rgba(95,242,192,.4)); animation:preGlow 3s ease-in-out infinite; }
.mini-roles{ display:flex; flex-direction:column; gap:9px; width:100%; max-width:260px; }
.mr{
  display:flex; align-items:center; gap:10px; font-size:.8rem; font-weight:700;
  background:rgba(255,255,255,.04); border:1px solid var(--line-soft); padding:9px 13px; border-radius:10px;
}
.mr .sw{ margin-left:auto; }
.rd{ width:10px; height:10px; border-radius:50%; flex-shrink:0; box-shadow:0 0 10px currentColor; }
.rd.rp,.rd.rp2{ background:#c084fc; color:#c084fc; }
.rd.rm,.rd.rm2{ background:var(--mint); color:var(--mint); }
.rd.rt,.rd.rt2{ background:#60a5fa; color:#60a5fa; }
.rd.rg{ background:#6f6a90; color:#6f6a90; }
.sw{
  width:34px; height:19px; border-radius:99px; background:rgba(255,255,255,.12); position:relative; transition:.35s; flex-shrink:0;
}
.sw::after{ content:""; position:absolute; top:2.5px; left:3px; width:14px; height:14px; border-radius:50%; background:#fff; transition:.35s var(--ease); }
.sw.on{ background:var(--mint); }
.sw.on::after{ left:17px; background:#06281e; }

/* ---------- split bölümler ---------- */
.split-inner{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.split .split-vis{ order:-1; }
.split.rev .split-vis{ order:2; }
.split.rev .split-copy{ order:1; }
.split-copy .sec-sub{ margin:16px 0 26px; }
.ticks{ list-style:none; display:flex; flex-direction:column; gap:13px; margin-bottom:32px; }
.ticks li{ display:flex; align-items:center; gap:12px; font-weight:600; font-size:.98rem; }
.ticks li::before{
  content:""; width:16px; height:16px; flex-shrink:0; border-radius:5px;
  background:var(--mint-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235ff2c0' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 13 4 4L19 7'/%3E%3C/svg%3E") center/11px no-repeat;
}
.link-arrow{
  display:inline-flex; align-items:center; gap:9px; font-weight:700; color:var(--mint);
  border-bottom:1px solid rgba(95,242,192,.35); padding-bottom:4px; transition:gap .3s var(--ease), filter .3s;
}
.link-arrow svg{ width:17px; height:17px; transition:transform .3s var(--ease); }
.link-arrow:hover{ gap:14px; filter:brightness(1.15); }

/* ses paneli */
.voice-panel{
  background:linear-gradient(180deg, #141126, #0d0a1b); border:1px solid rgba(167,139,250,.22); border-radius:22px;
  padding:24px; box-shadow:0 30px 70px rgba(0,0,0,.5); animation:floaty 8s ease-in-out infinite;
}
.vp-head{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:.95rem; margin-bottom:18px; }
.vp-head svg{ width:17px; height:17px; color:var(--mint); }
.vp-head b{ margin-left:auto; font-size:.7rem; font-family:var(--font-m); color:var(--mint); background:var(--mint-soft); padding:4px 11px; border-radius:99px; font-weight:600; }
.vp-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:18px; }
.vtile{
  position:relative; border-radius:16px; background:rgba(255,255,255,.04); border:1px solid var(--line-soft);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:24px 12px 18px; transition:.35s;
}
.vtile .ava{ width:52px; height:52px; font-size:1rem; }
.vtile i{ font-style:normal; font-size:.74rem; color:#8f8bad; font-weight:600; }
.vtile.speaking{ border-color:rgba(95,242,192,.55); box-shadow:0 0 0 1px rgba(95,242,192,.3), 0 0 30px rgba(95,242,192,.12); }
.vtile.speaking .ava{ box-shadow:0 0 0 3px rgba(95,242,192,.55); }
.vwave{ display:flex; gap:3px; position:absolute; top:12px; right:14px; }
.vwave b{ width:3.5px; height:9px; border-radius:99px; background:var(--mint); animation:wv 0.8s ease-in-out infinite; }
.vwave b:nth-child(2){ height:14px; animation-delay:.2s; } .vwave b:nth-child(3){ height:7px; animation-delay:.4s; }
.vp-ctrl{ display:flex; justify-content:center; gap:12px; padding-top:6px; border-top:1px solid var(--line-soft); }
.ctrl{
  width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.06); color:#cfcbe8; cursor:pointer; transition:.3s; border:1px solid var(--line-soft);
}
.ctrl svg{ width:19px; height:19px; }
.ctrl:hover{ background:rgba(255,255,255,.12); transform:translateY(-2px); }
.ctrl.on{ background:rgba(95,242,192,.14); color:var(--mint); border-color:rgba(95,242,192,.35); }
.ctrl.leave{ background:rgba(244,63,94,.16); color:#fb7185; border-color:rgba(244,63,94,.35); }

/* rol paneli */
.roles-panel{
  background:linear-gradient(180deg, #141126, #0d0a1b); border:1px solid rgba(167,139,250,.22); border-radius:22px;
  padding:24px; box-shadow:0 30px 70px rgba(0,0,0,.5); animation:floaty 9s ease-in-out infinite reverse;
}
.rp-head{ font-family:var(--font-d); font-size:.85rem; font-weight:700; margin-bottom:16px; }
.rp-row{
  display:flex; align-items:center; gap:13px; padding:13px 14px; border-radius:14px;
  background:rgba(255,255,255,.035); border:1px solid var(--line-soft); margin-bottom:9px; transition:.3s;
}
.rp-row:hover{ border-color:rgba(167,139,250,.35); }
.rp-row .sw{ margin-left:auto; }
.rp-meta b{ display:block; font-size:.88rem; }
.rp-meta i{ font-style:normal; font-size:.7rem; color:#6f6a90; }
.rp-invite{
  display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:16px;
  border:1px dashed rgba(167,139,250,.4); border-radius:12px; padding:12px 16px;
  font-family:var(--font-m); font-size:.72rem; color:#8f8bad;
}
.rp-invite b{ color:var(--mint); font-family:var(--font-b); font-size:.8rem; cursor:pointer; }
.rp-invite b:hover{ filter:brightness(1.2); }

/* ---------- SSS ---------- */
.faq-wrap{ max-width:760px; }
.faq{ display:flex; flex-direction:column; gap:12px; }
.faq-item{
  border:1px solid var(--line-soft); border-radius:16px; background:rgba(255,255,255,.025);
  transition:border-color .35s, background .35s; overflow:hidden;
}
.faq-item.open{ border-color:rgba(95,242,192,.35); background:rgba(95,242,192,.03); }
.faq-q{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; text-align:left;
  background:none; border:0; cursor:pointer; color:var(--text); font-family:var(--font-b);
  font-weight:700; font-size:1rem; padding:20px 24px;
}
.fx{ position:relative; width:16px; height:16px; flex-shrink:0; }
.fx::before,.fx::after{
  content:""; position:absolute; top:50%; left:50%; background:var(--mint); border-radius:2px;
  transform:translate(-50%,-50%); transition:.4s var(--ease);
}
.fx::before{ width:16px; height:2px; }
.fx::after{ width:2px; height:16px; }
.faq-item.open .fx::after{ transform:translate(-50%,-50%) rotate(90deg); opacity:0; }
.faq-a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .5s var(--ease); }
.faq-item.open .faq-a{ grid-template-rows:1fr; }
.faq-a > div{ overflow:hidden; }
.faq-a p{ padding:0 24px 22px; color:var(--muted); font-size:.95rem; }

/* ---------- CTA bandı ---------- */
.cta-band{
  position:relative; padding:clamp(80px,11vw,140px) 0; overflow:hidden;
  border-top:1px solid var(--line-soft);
  background:radial-gradient(700px 400px at 50% 120%, rgba(124,92,255,.22), transparent 70%);
}
.cta-inner{ text-align:center; }
.cta-inner h2{ font-size:clamp(1.9rem, 4.4vw, 3.2rem); margin-bottom:18px; }
.cta-inner p{ color:var(--muted); margin-bottom:34px; font-size:1.08rem; }

/* ---------- footer ---------- */
.footer{ border-top:1px solid var(--line-soft); padding:64px 0 30px; background:rgba(0,0,0,.25); }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; margin-bottom:48px; }
.f-brand p{ color:var(--muted); font-size:.9rem; margin-top:16px; max-width:280px; }
.f-col{ display:flex; flex-direction:column; gap:12px; }
.f-title{ font-family:var(--font-m); font-size:.66rem; letter-spacing:.25em; color:var(--purple); margin-bottom:8px; }
.f-col a{ color:var(--muted); font-size:.9rem; font-weight:600; transition:.3s; width:fit-content; }
.f-col a:hover{ color:var(--mint); transform:translateX(4px); }
.footer-bottom{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  border-top:1px solid var(--line-soft); padding-top:24px; color:#6f6a90; font-size:.8rem;
}
.f-made{ font-family:var(--font-m); font-size:.72rem; letter-spacing:.14em; }

/* ---------- AUTH (giris / kayit) ---------- */
.auth-body .bg-glow{ z-index:0; }
.auth-shell{
  position:relative; z-index:2; min-height:100vh; display:flex; flex-direction:column;
  align-items:center; justify-content:center; padding:120px 6vw 60px;
}
.auth-home{
  position:fixed; top:26px; left:26px; z-index:10; display:inline-flex; align-items:center; gap:8px;
  font-weight:700; font-size:.88rem; color:var(--muted); transition:.3s;
}
.auth-home:hover{ color:var(--mint); transform:translateX(-3px); }
.auth-home svg{ width:16px; height:16px; }
.auth-card{
  width:min(440px, 100%); background:linear-gradient(180deg, rgba(20,17,38,.92), rgba(13,10,27,.92));
  border:1px solid var(--line); border-radius:26px; padding:42px 38px;
  box-shadow:0 40px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(14px); position:relative; overflow:hidden;
  opacity:0; transform:translateY(26px) scale(.98); animation:cardIn .9s var(--ease) 1.35s forwards;
}
@keyframes cardIn{ to{ opacity:1; transform:none; } }
.auth-card::after{
  content:""; position:absolute; top:0; left:10%; right:10%; height:1px;
  background:linear-gradient(90deg, transparent, rgba(95,242,192,.6), transparent);
}
.auth-logo{ width:74px; height:74px; margin:0 auto 18px; object-fit:contain; mix-blend-mode:screen; }
.auth-card h1{ font-size:1.5rem; text-align:center; margin-bottom:8px; }
.auth-sub{ text-align:center; color:var(--muted); font-size:.9rem; margin-bottom:30px; }
.auth-form{ display:flex; flex-direction:column; gap:16px; }
.field label{ display:block; font-size:.78rem; font-weight:700; color:#8f8bad; margin-bottom:7px; letter-spacing:.04em; }
.field-box{
  display:flex; align-items:center; gap:11px; background:rgba(255,255,255,.045);
  border:1px solid var(--line-soft); border-radius:13px; padding:0 16px; transition:border-color .3s, box-shadow .3s;
}
.field-box svg{ width:17px; height:17px; color:#6f6a90; flex-shrink:0; }
.field-box input{
  flex:1; background:none; border:0; outline:0; color:var(--text); font-family:var(--font-b);
  font-size:.95rem; font-weight:600; padding:14px 0; min-width:0;
}
.field-box input::placeholder{ color:#57527a; }
.field-box:focus-within{ border-color:rgba(95,242,192,.5); box-shadow:0 0 0 4px rgba(95,242,192,.08); }
.field-box:focus-within svg{ color:var(--mint); }
.auth-row{ display:flex; align-items:center; justify-content:space-between; font-size:.8rem; }
.auth-row a{ color:var(--purple); font-weight:700; } .auth-row a:hover{ color:var(--mint); }
.remember{ display:flex; align-items:center; gap:8px; color:var(--muted); cursor:pointer; }
.remember input{ accent-color:var(--mint); }
.btn.block{ width:100%; padding:15px; font-size:1rem; }
.auth-alt{ text-align:center; color:var(--muted); font-size:.88rem; margin-top:26px; }
.auth-alt a{ color:var(--mint); font-weight:700; border-bottom:1px solid rgba(95,242,192,.35); }
.auth-note{
  margin-top:22px; text-align:center; font-size:.74rem; color:#6f6a90;
  display:flex; align-items:center; justify-content:center; gap:7px;
}
.auth-note::before,.auth-note::after{ content:""; width:5px; height:5px; background:var(--violet); border-radius:1.5px; opacity:.6; }

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .mock-body{ grid-template-columns:64px 188px 1fr; }
  .mock-members{ display:none; }
}
@media (max-width:980px){
  .hero-inner{ grid-template-columns:1fr; gap:60px; }
  .hero-copy{ text-align:center; display:flex; flex-direction:column; align-items:center; }
  .hero-sub{ margin-inline:auto; }
  .split-inner{ grid-template-columns:1fr; gap:44px; }
  .split .split-vis,.split.rev .split-vis{ order:2; }
  .split .split-copy,.split.rev .split-copy{ order:1; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:900px){
  .nav-links,.nav-actions{ display:none; }
  .nav-burger{ display:flex; }
  .nav-panel{ display:flex; }
  .bento .bcard{ grid-column:span 12 !important; }
}
@media (max-width:640px){
  .hero{ padding-top:120px; }
  .mock-body{ grid-template-columns:56px 1fr; min-height:360px; }
  .mock-channels{ display:none; }
  .btn.lg{ width:100%; }
  .hero-ctas{ flex-direction:column; }
  .faq-q{ padding:17px 18px; font-size:.93rem; }
  .auth-card{ padding:34px 24px; }
  .footer-grid{ grid-template-columns:1fr; gap:30px; }
  .mq-item{ font-size:.85rem; }
  /* dokunma hedefleri ≥44px */
  .btn{ min-height:44px; }
  .auth-card a, .auth-home, #link-forgot{ display:inline-flex; align-items:center; min-height:40px; }
}

/* ============================================================
   Getcord+ uyarlamaları — "Yakında" etiketi + gerçek form durumları
   ============================================================ */
.soon{
  display:inline-flex; align-items:center; gap:6px; vertical-align:middle;
  font-family:var(--font-m); font-size:.62rem; font-weight:600; letter-spacing:.18em;
  color:var(--purple); background:rgba(124,92,255,.12); border:1px solid rgba(167,139,250,.35);
  padding:3px 9px; border-radius:99px; text-transform:uppercase; white-space:nowrap;
}
.soon::before{ content:""; width:5px; height:5px; border-radius:1.5px; background:var(--purple); }
h2 .soon, h3 .soon{ margin-left:10px; font-family:var(--font-m); -webkit-text-fill-color:var(--purple); }
.bcard.is-soon .bcard-vis{ opacity:.55; filter:saturate(.6); }
.split.is-soon .split-vis{ opacity:.6; filter:saturate(.6); }
.ticks li.soon-item{ color:var(--muted); }
.ticks li.soon-item .soon{ margin-left:8px; }
.mock-soon{
  position:absolute; top:10px; right:12px; z-index:3;
}
.mockup{ position:relative; }

/* form mesajları */
.auth-msg{
  font-size:.86rem; line-height:1.5; padding:12px 14px; border-radius:12px;
  border:1px solid var(--line); background:rgba(255,255,255,.03); color:var(--text);
}
.auth-msg.error{ border-color:rgba(255,99,132,.45); background:rgba(255,99,132,.08); color:#ffc2cf; }
.auth-msg.success{ border-color:rgba(95,242,192,.45); background:var(--mint-soft); color:#c9ffef; }
.auth-msg.info{ border-color:rgba(167,139,250,.45); background:rgba(124,92,255,.08); color:#ddd3ff; }
.auth-msg a, .auth-msg button.linklike{ color:var(--mint); font-weight:700; background:none; border:0; cursor:pointer; font:inherit; text-decoration:underline; padding:0; }
.field-hint{ font-size:.74rem; color:var(--muted); margin-top:6px; }
.btn[disabled]{ opacity:.6; cursor:progress; transform:none !important; }
.auth-panel-title{ font-size:1.05rem; text-align:center; margin-bottom:6px; }
.auth-back{ background:none; border:0; color:var(--purple); font:inherit; font-weight:700; cursor:pointer; font-size:.82rem; }
.auth-back:hover{ color:var(--mint); }
.f-col .f-soon{ color:var(--muted); font-size:.9rem; display:inline-flex; align-items:center; gap:6px; }
/* hidden özniteliği .auth-form{display:flex} gibi kurallarca ezilmesin */
[hidden]{ display:none !important; }
.auth-msg{ margin-bottom:18px; }
/* Hero örnek ekranı: gerçek Getcord düzeni (sohbetler + gruplar) */
.mock-rail .srv svg{ width:18px; height:18px; }
.mock-channels .ch{ display:flex; align-items:center; gap:7px; white-space:nowrap; overflow:hidden; }
.ava.mini{ width:20px; height:20px; font-size:.6rem; border-radius:6px; flex-shrink:0; }
.chat-head .ava.mini{ margin-right:6px; }
.mock-tag{ font-family:var(--font-m); font-size:.5rem; letter-spacing:.12em; color:var(--purple); background:rgba(124,92,255,.14); border:1px solid rgba(167,139,250,.35); padding:1px 5px; border-radius:5px; }
.mock-badge{ margin-left:auto; font-size:.6rem; font-weight:800; color:#fff; background:#f23f5d; padding:1px 6px; border-radius:99px; }
.mock-channels .ch .mock-tag + .mock-badge{ margin-left:auto; }
.mock-channels .ch .nm{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; }
.mock-channels .ch .mock-tag, .mock-channels .ch .mock-badge{ flex-shrink:0; }
.mock-channels .ch .mock-tag + .mock-badge{ margin-left:4px; }
.ava.mini.grp svg{ width:13px; height:13px; color:#fff; }

/* "Ekran paylaşımı" artık hazır: yeşil etiket */
.live-chip{
  display:inline-flex; align-items:center; gap:6px; vertical-align:middle;
  font-family:var(--font-m); font-size:.62rem; font-weight:600; letter-spacing:.18em;
  color:#5ff2c0; background:rgba(95,242,192,.12); border:1px solid rgba(95,242,192,.35);
  padding:3px 9px; border-radius:99px; text-transform:uppercase; white-space:nowrap; margin-left:10px;
}
.live-chip::before{ content:""; width:5px; height:5px; border-radius:1.5px; background:#5ff2c0; }

.auth-legal{ margin:14px auto 0; max-width:36ch; text-align:center; font-size:.78rem; line-height:1.55; color:var(--muted); }
.auth-legal a{ color:var(--mint); }

/* Android indirme (alt CTA bandı) */
.android-dl{ margin:34px auto 0; max-width:640px; display:flex; flex-direction:column; align-items:center; gap:10px; }
.android-dl .btn{ gap:10px; }
.android-ico{ width:22px; height:22px; color:var(--mint); flex:none; }
.android-meta{ color:var(--muted); font-size:.92rem; margin:0 !important; }
.android-verify{ width:100%; text-align:left; border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:12px 16px; background:rgba(255,255,255,.02); }
.android-verify summary{ cursor:pointer; color:var(--text, #e8e8f0); font-weight:600; font-size:.95rem; list-style-position:inside; }
.android-verify summary:focus-visible{ outline:2px solid var(--mint); outline-offset:3px; border-radius:6px; }
.android-verify ol{ margin:12px 0 2px; padding-left:20px; color:var(--muted); font-size:.92rem; line-height:1.6; display:grid; gap:10px; }
.android-verify code{ font-family:'JetBrains Mono', ui-monospace, monospace; font-size:.82rem; }
.android-verify code.hash{ display:block; margin-top:6px; padding:8px 10px; border-radius:8px; background:rgba(0,0,0,.35); color:var(--mint); overflow-wrap:anywhere; user-select:all; }
.android-verify .hint{ display:block; margin-top:6px; font-size:.85rem; }
.android-verify a{ color:var(--mint); }