/* =========================================
   VİZYON GÖZ — SHARED DESIGN SYSTEM v3
   ========================================= */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400;1,700&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

/* ── TOKENS ── */
:root {
  --ink:    #0a0318;
  --dark:   #130728;
  --plum:   #2a0f5c;
  --violet: #5b21b6;
  --purple: #7c3aed;
  --lilac:  #a78bfa;
  --petal:  #c4b5fd;
  --mist:   #ede9fe;
  --ghost:  #f5f3ff;
  --white:  #fdfcff;
  --emerald:#10b981;
  --muted:  #6b5b8a;
  --border: rgba(124,58,237,.11);
  --nav-h:  72px;
  --ease:   cubic-bezier(.16,1,.3,1);
  --s1: 0 2px 12px rgba(91,33,182,.07);
  --s2: 0 8px 32px rgba(91,33,182,.12);
  --s3: 0 20px 60px rgba(91,33,182,.17);
  --s4: 0 40px 100px rgba(91,33,182,.22);
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Plus Jakarta Sans',sans-serif; background:var(--white); color:var(--ink); overflow-x:hidden; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; height:auto; }
a { text-decoration:none; color:inherit; }
button { font-family:'Plus Jakarta Sans',sans-serif; cursor:pointer; }

/* ── TOPBAR ── */
.topbar {
  height:40px; background:var(--ink);
  display:flex; align-items:center; padding:0 56px;
  justify-content:space-between;
  border-bottom:1px solid rgba(167,139,250,.07);
  position:relative; z-index:901;
}
.tb-left { display:flex; align-items:center; gap:22px; }
.tb-item { display:flex; align-items:center; gap:7px; color:rgba(255,255,255,.45); font-size:12px; font-weight:500; }
.tb-item i { color:var(--lilac); font-size:11px; }
.tb-item a { color:rgba(255,255,255,.45); transition:color .2s; }
.tb-item a:hover { color:var(--petal); }
.tb-sep { width:1px; height:13px; background:rgba(255,255,255,.08); }
.tb-right { display:flex; gap:5px; }
.lang-btn {
  padding:3px 10px; border-radius:4px;
  border:1px solid rgba(167,139,250,.2);
  background:transparent; color:rgba(255,255,255,.38);
  font-size:11px; font-weight:700; letter-spacing:1.5px;
  cursor:pointer; font-family:'Plus Jakarta Sans',sans-serif;
  transition:all .2s;
}
.lang-btn:hover, .lang-btn.active {
  background:var(--violet); border-color:var(--violet); color:#fff;
}

/* ── NAVBAR ── */
.navbar {
  position:sticky; top:0; z-index:900; height:var(--nav-h);
  background:rgba(253,252,255,.95);
  backdrop-filter:blur(22px) saturate(180%);
  -webkit-backdrop-filter:blur(22px) saturate(180%);
  border-bottom:1px solid var(--border);
  transition:box-shadow .3s;
}
.navbar.scrolled { box-shadow:var(--s2); }
.nav-wrap {
  max-width:1340px; margin:0 auto; height:100%;
  padding:0 56px; display:flex; align-items:center; gap:0;
}

/* Logo */
.logo { display:flex; align-items:center; gap:13px; flex-shrink:0; margin-right:40px; }
.logo-mark {
  width:42px; height:42px; border-radius:11px;
  background:linear-gradient(135deg,var(--violet),var(--lilac));
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(91,33,182,.35); flex-shrink:0;
}
.logo-mark i { color:#fff; font-size:18px; }
.logo-name { font-family:'Cormorant Garamond',serif; font-size:19px; font-weight:700; color:var(--dark); line-height:1.15; }
.logo-tag { font-size:9px; font-weight:700; color:var(--purple); letter-spacing:3px; text-transform:uppercase; }

/* Nav list */
.nav-list { display:flex; align-items:center; gap:1px; flex:1; list-style:none; }
.nav-item { position:relative; }
.nav-a {
  display:flex; align-items:center; gap:5px;
  padding:9px 13px; border-radius:8px;
  color:var(--muted); font-size:13px; font-weight:600;
  transition:all .2s; white-space:nowrap; cursor:pointer;
}
.nav-a:hover { background:var(--ghost); color:var(--violet); }
.nav-a.cur { color:var(--violet); }
.nav-a .chv { font-size:9px; color:var(--lilac); transition:transform .2s; }
.nav-item:hover .chv { transform:rotate(180deg); }

/* Dropdown */
.dropdown {
  position:absolute; top:calc(100% + 8px); left:50%;
  transform:translateX(-50%) translateY(-6px);
  background:#fff; border:1px solid var(--border);
  border-radius:14px; box-shadow:var(--s3);
  padding:7px; min-width:240px;
  opacity:0; visibility:hidden;
  transition:all .22s var(--ease); pointer-events:none; z-index:200;
}
.nav-item:hover .dropdown {
  opacity:1; visibility:visible;
  transform:translateX(-50%) translateY(0); pointer-events:all;
}
.dd-a {
  display:flex; align-items:center; gap:11px;
  padding:10px 12px; border-radius:9px;
  color:var(--muted); font-size:13px; font-weight:500; transition:all .15s;
}
.dd-a:hover { background:var(--ghost); color:var(--violet); }
.dd-ico {
  width:32px; height:32px; border-radius:8px; background:var(--ghost);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.dd-ico i { font-size:13px; color:var(--violet); }

/* Nav right */
.nav-right { display:flex; align-items:center; gap:9px; margin-left:auto; }
.btn-ghost {
  display:flex; align-items:center; gap:7px;
  padding:9px 18px; border-radius:9px;
  background:var(--ghost); color:var(--violet);
  font-size:13px; font-weight:700; border:none; transition:all .2s;
}
.btn-ghost:hover { background:var(--mist); }
.btn-pri {
  display:flex; align-items:center; gap:7px;
  padding:10px 22px; border-radius:10px;
  background:linear-gradient(135deg,var(--violet),var(--lilac));
  color:#fff; font-size:13px; font-weight:700; border:none;
  box-shadow:0 4px 18px rgba(91,33,182,.35);
  transition:all .25s var(--ease);
}
.btn-pri:hover { transform:translateY(-1px); box-shadow:0 8px 30px rgba(91,33,182,.45); }

/* ── PAGE HERO ── */
.page-hero {
  background:var(--ink); padding:88px 0 64px;
  position:relative; overflow:hidden;
}
.page-hero::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 70% 130% at 90% 50%,rgba(91,33,182,.48),transparent);
}
.page-hero::after {
  content:''; position:absolute; inset:0;
  background-image:radial-gradient(circle, rgba(167,139,250,.07) 1px, transparent 1px);
  background-size:30px 30px; pointer-events:none;
}
.ph-inner { position:relative; z-index:2; }
.breadcrumb {
  display:flex; align-items:center; gap:8px; margin-bottom:20px;
  font-size:12px; color:rgba(255,255,255,.28);
}
.breadcrumb a { color:rgba(255,255,255,.28); transition:color .2s; }
.breadcrumb a:hover { color:var(--petal); }
.breadcrumb i { font-size:8px; color:rgba(255,255,255,.16); }
.page-hero h1 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(38px,5.5vw,70px); font-weight:700;
  color:#fff; line-height:1.08; margin-bottom:16px; letter-spacing:-.5px;
}
.page-hero h1 em { font-style:italic; color:var(--petal); }
.page-hero p { color:rgba(255,255,255,.46); font-size:16.5px; max-width:520px; line-height:1.74; }

/* ── LAYOUT ── */
.sec { padding:100px 0; }
.sec-ghost { background:var(--ghost); }
.sec-dark { background:var(--ink); }
.wrap { max-width:1340px; margin:0 auto; padding:0 56px; }

/* ── TYPOGRAPHY ── */
.eyebrow {
  display:inline-flex; align-items:center; gap:9px;
  font-size:10.5px; font-weight:700; letter-spacing:3px;
  text-transform:uppercase; color:var(--violet); margin-bottom:16px;
}
.eyebrow::before { content:''; display:block; width:18px; height:2px; background:var(--lilac); border-radius:2px; }
.eyebrow-lt { color:var(--petal); }
.eyebrow-lt::before { background:var(--lilac); }

.disp {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(34px,4.5vw,60px); font-weight:700;
  line-height:1.07; color:var(--dark); letter-spacing:-.5px;
}
.disp em { font-style:italic; color:var(--violet); }
.disp-w { color:#fff; }
.disp-w em { color:var(--petal); }
.lead { font-size:16px; color:var(--muted); line-height:1.78; }

/* ── BUTTONS ── */
.cta-p {
  display:inline-flex; align-items:center; gap:9px;
  padding:14px 30px; border-radius:11px;
  background:linear-gradient(135deg,var(--violet),var(--lilac));
  color:#fff; font-size:14px; font-weight:700; border:none;
  box-shadow:0 6px 24px rgba(91,33,182,.38);
  transition:all .28s var(--ease); cursor:pointer;
}
.cta-p:hover { transform:translateY(-2px); box-shadow:0 12px 36px rgba(91,33,182,.5); }
.cta-o {
  display:inline-flex; align-items:center; gap:9px;
  padding:13px 28px; border-radius:11px;
  background:transparent; color:var(--violet); font-size:14px; font-weight:700;
  border:1.5px solid rgba(91,33,182,.3); transition:all .28s; cursor:pointer;
}
.cta-o:hover { background:var(--ghost); border-color:var(--lilac); }

/* ── REVEAL ── */
[data-r] { opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
[data-r].in { opacity:1; transform:translateY(0); }

/* ── FOOTER ── */
footer { background:var(--ink); border-top:1px solid rgba(167,139,250,.07); }
.ft-main {
  max-width:1340px; margin:0 auto; padding:64px 56px 40px;
  display:grid; grid-template-columns:2fr 1fr 1fr 1.4fr; gap:48px;
}
.ft-logo { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.ft-logo-mark {
  width:38px; height:38px; border-radius:9px;
  background:linear-gradient(135deg,var(--violet),var(--lilac));
  display:flex; align-items:center; justify-content:center;
}
.ft-logo-mark i { color:#fff; font-size:15px; }
.ft-name { font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:700; color:#fff; }
.ft-tag { font-size:8.5px; color:var(--lilac); letter-spacing:3px; text-transform:uppercase; }
.ft-about { color:rgba(255,255,255,.35); font-size:13px; line-height:1.8; max-width:280px; margin-bottom:20px; }
.ft-socials { display:flex; gap:9px; }
.ft-soc {
  width:35px; height:35px; border-radius:9px;
  border:1px solid rgba(167,139,250,.17);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.35); font-size:14px; transition:all .2s;
}
.ft-soc:hover { background:var(--violet); border-color:var(--violet); color:#fff; }
.ft-col h5 {
  font-size:9.5px; font-weight:700; letter-spacing:2.5px;
  text-transform:uppercase; color:rgba(255,255,255,.25); margin-bottom:14px;
}
.ft-col a { display:block; color:rgba(255,255,255,.44); font-size:13px; margin-bottom:9px; transition:color .2s; }
.ft-col a:hover { color:var(--petal); }
.ft-ci { display:flex; align-items:flex-start; gap:10px; margin-bottom:13px; }
.ft-ci-ico {
  width:28px; height:28px; border-radius:7px; flex-shrink:0;
  background:rgba(167,139,250,.08); display:flex; align-items:center; justify-content:center;
}
.ft-ci-ico i { font-size:12px; color:var(--lilac); }
.ft-ci-txt { font-size:12.5px; color:rgba(255,255,255,.4); line-height:1.5; }
.ft-ci-txt strong { color:rgba(255,255,255,.65); display:block; font-size:13px; margin-bottom:1px; }
.ft-bot {
  max-width:1340px; margin:0 auto; padding:15px 56px;
  border-top:1px solid rgba(167,139,250,.06);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px;
}
.ft-bot p { color:rgba(255,255,255,.18); font-size:12px; }
.ft-legal { display:flex; gap:20px; }
.ft-legal a { color:rgba(255,255,255,.18); font-size:12px; transition:color .2s; }
.ft-legal a:hover { color:var(--petal); }

/* ── FLOATING BUTTONS ── */
.floats {
  position:fixed; bottom:24px; right:24px; z-index:800;
  display:flex; flex-direction:column; gap:9px; align-items:flex-end;
}
.fp {
  display:flex; align-items:center; gap:9px;
  padding:11px 20px; border-radius:100px; border:none;
  font-family:'Plus Jakarta Sans',sans-serif; font-size:13.5px; font-weight:700;
  cursor:pointer; text-decoration:none;
  transition:all .3s var(--ease); box-shadow:0 5px 22px rgba(0,0,0,.17); white-space:nowrap;
}
.fp-wa { background:#22c55e; color:#fff; }
.fp-wa:hover { transform:scale(1.05) translateX(-4px); box-shadow:0 10px 28px rgba(34,197,94,.38); }
.fp-ph { background:linear-gradient(135deg,var(--violet),var(--lilac)); color:#fff; }
.fp-ph:hover { transform:scale(1.05) translateX(-4px); box-shadow:0 10px 28px rgba(91,33,182,.48); }
.fp i { font-size:16px; }

/* ── RESPONSIVE ── */
@media(max-width:1100px) {
  .wrap { padding:0 32px; }
  .nav-wrap { padding:0 32px; }
  .topbar { padding:0 32px; }
  .ft-main { grid-template-columns:1fr 1fr; padding:48px 32px 36px; }
  .ft-bot { padding:14px 32px; }
}
@media(max-width:768px) {
  .topbar { display:none; }
  .nav-list { display:none; }
  .nav-wrap { padding:0 20px; }
  .wrap { padding:0 20px; }
  .sec { padding:68px 0; }
  .ft-main { grid-template-columns:1fr; padding:36px 20px 24px; }
  .ft-bot { padding:12px 20px; flex-direction:column; align-items:flex-start; }
  .fp span { display:none; }
  .fp { padding:13px; border-radius:50%; width:50px; height:50px; justify-content:center; }
}

/* ═══════════════════════════════════════════════════
   ANIMASYONLAR — Vizyon Göz v3
   ═══════════════════════════════════════════════════ */

/* ── Floating Orbs / Ambient ── */
.orb {
  position:absolute; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle at 40% 40%, rgba(167,139,250,.35), transparent 70%);
  animation:orb-drift ease-in-out infinite alternate;
  filter:blur(40px);
}
@keyframes orb-drift {
  from { transform:translate(0,0) scale(1); opacity:.5; }
  to   { transform:translate(30px,-20px) scale(1.15); opacity:.8; }
}

/* ── Shimmer / Skeleton loader ── */
@keyframes shimmer {
  0%   { background-position:-400px 0; }
  100% { background-position:400px 0; }
}
.shimmer {
  background:linear-gradient(90deg, var(--ghost) 25%, var(--mist) 50%, var(--ghost) 75%);
  background-size:800px 100%;
  animation:shimmer 1.6s infinite;
}

/* ── Smooth underline hover ── */
.anim-underline {
  position:relative; display:inline-block;
}
.anim-underline::after {
  content:''; position:absolute; bottom:-2px; left:0; width:0; height:2px;
  background:linear-gradient(90deg, var(--violet), var(--lilac));
  transition:width .35s var(--ease);
  border-radius:2px;
}
.anim-underline:hover::after { width:100%; }

/* ── Number Ticker ── */
@keyframes ticker-in {
  from { transform:translateY(20px); opacity:0; }
  to   { transform:translateY(0);    opacity:1; }
}
.ticker-in { animation:ticker-in .6s var(--ease) both; }

/* ── Card lift ── */
.card-lift {
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  will-change:transform;
}
.card-lift:hover {
  transform:translateY(-8px) scale(1.01);
  box-shadow:var(--s4);
}

/* ── Glow pulse (badge, badge-dot vs.) ── */
@keyframes glow-pulse {
  0%,100% { box-shadow:0 0 0 0 rgba(124,58,237,.4); }
  50%     { box-shadow:0 0 0 10px rgba(124,58,237,.0); }
}
.glow-pulse { animation:glow-pulse 2.5s infinite; }

/* ── Staggered fade-up grid children ── */
.stagger > * {
  opacity:0; transform:translateY(22px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.stagger.in > * { opacity:1; transform:translateY(0); }
.stagger.in > *:nth-child(1)  { transition-delay:.05s; }
.stagger.in > *:nth-child(2)  { transition-delay:.12s; }
.stagger.in > *:nth-child(3)  { transition-delay:.19s; }
.stagger.in > *:nth-child(4)  { transition-delay:.26s; }
.stagger.in > *:nth-child(5)  { transition-delay:.33s; }
.stagger.in > *:nth-child(6)  { transition-delay:.40s; }
.stagger.in > *:nth-child(7)  { transition-delay:.47s; }
.stagger.in > *:nth-child(8)  { transition-delay:.54s; }

/* ── Text gradient shimmer (başlık vurgu) ── */
@keyframes gradient-shift {
  0%   { background-position:0% 50%;   }
  50%  { background-position:100% 50%; }
  100% { background-position:0% 50%;   }
}
.grad-animate {
  background:linear-gradient(270deg, var(--violet), var(--lilac), var(--petal), var(--violet));
  background-size:300% 300%;
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
  animation:gradient-shift 5s ease infinite;
}

/* ── Parallax wrapper ── */
.parallax-wrap { overflow:hidden; position:relative; }
.parallax-img  { will-change:transform; transition:transform .1s linear; }

/* ── Magnetic hover (JS ile birlikte) ── */
.magnetic { transition:transform .3s cubic-bezier(.23,1,.32,1); display:inline-flex; }

/* ── Hero entry sequence ── */
.hero-seq-1 { animation:fup .9s .00s var(--ease) both; }
.hero-seq-2 { animation:fup .9s .12s var(--ease) both; }
.hero-seq-3 { animation:fup .9s .24s var(--ease) both; }
.hero-seq-4 { animation:fup .9s .36s var(--ease) both; }
.hero-seq-5 { animation:fup .9s .48s var(--ease) both; }
@keyframes fup {
  from { opacity:0; transform:translateY(28px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ── Page transition overlay ── */
#page-transition {
  position:fixed; inset:0; z-index:9999; pointer-events:none;
  background:linear-gradient(135deg, var(--violet), var(--dark));
  transform:translateY(-100%);
  transition:transform .45s cubic-bezier(.76,0,.24,1);
}
#page-transition.active { transform:translateY(0); }
#page-transition.out    { transform:translateY(100%); }

/* ── Scroll progress bar ── */
#scroll-progress {
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:linear-gradient(90deg, var(--violet), var(--lilac));
  z-index:1000; transition:width .1s linear;
  box-shadow:0 0 8px rgba(124,58,237,.5);
}

/* ── Image hover zoom ── */
.img-hover-zoom { overflow:hidden; border-radius:inherit; }
.img-hover-zoom img {
  transition:transform .55s var(--ease);
  will-change:transform;
}
.img-hover-zoom:hover img { transform:scale(1.07); }

/* ── Ripple effect ── */
.ripple {
  position:relative; overflow:hidden;
}
.ripple::after {
  content:''; position:absolute; border-radius:50%;
  background:rgba(255,255,255,.25);
  width:0; height:0; top:50%; left:50%;
  transform:translate(-50%,-50%);
  transition:width .5s, height .5s, opacity .5s;
  opacity:0;
}
.ripple:active::after {
  width:200px; height:200px; opacity:0;
}

/* ── Tilt card (JS ile) ── */
.tilt-card {
  transform-style:preserve-3d; will-change:transform;
  transition:transform .1s linear;
}
.tilt-card-inner { transform:translateZ(20px); }

/* ── Floating label input ── */
.float-label-group { position:relative; }
.float-label-group input:not(:placeholder-shown) + label,
.float-label-group input:focus + label {
  top:4px; font-size:10px; color:var(--violet); font-weight:700; letter-spacing:1px;
}
.float-label-group label {
  position:absolute; top:14px; left:14px;
  font-size:14px; color:var(--muted); pointer-events:none;
  transition:all .2s var(--ease);
}

/* ── Smooth counter ── */
.count-up { display:inline-block; }

/* ── Entrance from left/right ── */
[data-r-left]  { opacity:0; transform:translateX(-32px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
[data-r-right] { opacity:0; transform:translateX(32px);  transition:opacity .7s var(--ease), transform .7s var(--ease); }
[data-r-left].in,
[data-r-right].in { opacity:1; transform:translateX(0); }

/* ── Scale in ── */
[data-r-scale] { opacity:0; transform:scale(.92); transition:opacity .6s var(--ease), transform .6s var(--ease); }
[data-r-scale].in { opacity:1; transform:scale(1); }