@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* ===== keldo tasarım dili — Anka paleti üzerine ===== */
:root{
  --kld-line: rgba(2,55,29,.12);
  --kld-line-strong: rgba(2,55,29,.2);
  --kld-radius: 16px;
  --kld-radius-sm: 11px;
  --kld-font: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --kld-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --kld-shadow: 0 18px 50px -24px rgba(2,55,29,.28);
}
[data-theme="dark"]{
  --kld-line: rgba(168,197,160,.16);
  --kld-line-strong: rgba(168,197,160,.28);
  --kld-shadow: 0 18px 50px -24px rgba(0,0,0,.6);
}

html{scroll-behavior:smooth}
body{font-family:var(--kld-font);letter-spacing:-.01em;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.logo{font-family:var(--kld-font);font-weight:800;letter-spacing:-.025em;line-height:1.08}
h2{font-size:clamp(2rem,4vw,3.1rem)}
p{line-height:1.65}
.container{max-width:1180px;margin:0 auto;padding:0 24px}

/* ===== Nav ===== */
.header{background:color-mix(in srgb,var(--bg-primary) 80%,transparent);backdrop-filter:saturate(160%) blur(14px);-webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid var(--kld-line);box-shadow:none}
.header.scrolled{box-shadow:0 1px 0 var(--kld-line)}
.header-inner{padding:14px 24px;max-width:1180px;margin:0 auto}
.logo img{height:34px;width:auto}
.nav-link{font-size:14.5px;font-weight:600;color:var(--text-secondary);padding:8px 14px;border-radius:999px;transition:.18s}
.nav-link:hover,.nav-link.active{color:var(--text-primary);background:var(--bg-glass)}
.theme-toggle,.lang-current{border:1px solid var(--kld-line);border-radius:999px;background:transparent}
.lang-current{padding:8px 12px;font-family:var(--kld-mono);font-size:12px}

/* ===== Butonlar: pill ===== */
.btn{border-radius:999px;font-weight:600;letter-spacing:0;font-size:15px;padding:12px 26px;transition:.2s;border:1px solid transparent}
.btn-lg{padding:15px 32px;font-size:16px}
.btn-primary{background:var(--accent);color:var(--bg-primary);box-shadow:var(--kld-shadow)}
.btn-primary:hover{transform:translateY(-2px);background:var(--accent-hover)}
[data-theme="dark"] .btn-primary{color:#0c1a12}
.btn-outline{background:transparent;border:1px solid var(--kld-line-strong);color:var(--text-primary)}
.btn-outline:hover{border-color:var(--accent);background:var(--bg-glass)}

/* ===== Eyebrow etiket ===== */
.section-label{display:inline-flex;align-items:center;gap:8px;font-family:var(--kld-mono);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--accent);background:none;padding:0;margin-bottom:14px}
.section-label::before{content:"";width:22px;height:1px;background:var(--accent);opacity:.6}
.section-header{margin-bottom:48px}
.section-header p{color:var(--text-secondary);font-size:1.08rem;max-width:620px;margin-top:12px}
.section-header[style*="center"] .section-label::before{display:none}
.gradient-text{background:none;-webkit-text-fill-color:currentColor;color:var(--accent)}

/* ===== Section ritmi ===== */
.section{padding:96px 0}
.hero-badge{border:1px solid var(--kld-line);background:var(--bg-glass);border-radius:999px;font-family:var(--kld-mono);font-size:12px;letter-spacing:.04em;padding:7px 14px}

/* ===== Hero: temiz, gimmick yok ===== */
.hero-orb,.hero-grid-lines,.phone-mockup,.hero-visual,.float-badge{display:none!important}
.hero{position:relative;min-height:auto;padding:120px 0 80px;background:var(--bg-primary);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;background:radial-gradient(900px 480px at 78% -10%, var(--bg-glass), transparent 70%)}
#anka-hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.9}
.hero-inner{position:relative;z-index:2;display:block;max-width:1180px}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);margin:0 0 22px}
.hero-description{font-size:1.18rem;color:var(--text-secondary);max-width:620px;margin-bottom:34px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-metrics{display:flex;gap:48px;margin-top:58px;flex-wrap:wrap;border-top:1px solid var(--kld-line);padding-top:30px}
.hero-metric-num{font-size:2.4rem;font-weight:800;color:var(--accent);letter-spacing:-.03em}
.hero-metric-lbl{font-size:13.5px;color:var(--text-tertiary);margin-top:4px}

/* ===== Marquee ===== */
.marquee-section{border-block:1px solid var(--kld-line);background:var(--bg-secondary);padding:20px 0}
.marquee-item{font-family:var(--kld-mono);font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--text-tertiary)}
.marquee-item::after{content:"·";margin:0 26px;opacity:.5}

/* ===== Kartlar ===== */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--bg-card);border:1px solid var(--kld-line);border-radius:var(--kld-radius);padding:30px 28px;box-shadow:none;transition:.22s}
.card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:var(--kld-shadow)}
.card-icon{width:52px;height:52px;display:flex;align-items:center;justify-content:center;font-size:24px;background:var(--bg-glass);border:1px solid var(--kld-line);border-radius:13px;margin-bottom:18px}
.card h3{font-size:1.2rem;margin-bottom:10px}
.card p{color:var(--text-secondary);font-size:14.5px}

/* ===== Neden biz ===== */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.why-item{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--kld-line)}
.why-icon{width:46px;height:46px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:20px;background:var(--bg-glass);border-radius:12px}
.why-item h4{font-size:1.05rem;margin-bottom:5px}
.why-item p{color:var(--text-secondary);font-size:14px}
.why-visual{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.metric-card{background:var(--bg-card);border:1px solid var(--kld-line);border-radius:var(--kld-radius);padding:28px 24px;box-shadow:none}
.metric-card.wide{grid-column:1/-1}
.metric-num{font-size:2.6rem;font-weight:800;color:var(--accent);letter-spacing:-.03em}
.metric-lbl{color:var(--text-tertiary);font-size:13.5px;margin-top:4px}

/* ===== Süreç ===== */
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.process-step{background:var(--bg-card);border:1px solid var(--kld-line);border-radius:var(--kld-radius);padding:28px 24px;position:relative}
.process-number{font-family:var(--kld-mono);font-size:2rem;font-weight:500;color:var(--accent);opacity:.85;margin-bottom:12px}
.process-step h4{font-size:1.08rem;margin-bottom:8px}
.process-step p{color:var(--text-secondary);font-size:14px}

/* ===== CTA ===== */
.cta-section{padding:110px 0;text-align:center;background:var(--bg-secondary);border-top:1px solid var(--kld-line)}
.cta-section h2{max-width:780px;margin:14px auto 16px}
.cta-section p{color:var(--text-secondary);font-size:1.12rem;margin-bottom:30px}

/* ===== Footer ===== */
.footer{background:var(--bg-primary);border-top:1px solid var(--kld-line);padding:72px 0 30px}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}
.footer-brand p{color:var(--text-secondary);font-size:14px;margin-top:14px;max-width:280px}
.footer-col h4{font-family:var(--kld-mono);font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--text-tertiary);margin-bottom:16px}
.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.footer-col a{color:var(--text-secondary);font-size:14px;text-decoration:none}
.footer-col a:hover{color:var(--accent)}
.footer-bottom{margin-top:48px;padding-top:24px;border-top:1px solid var(--kld-line);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;color:var(--text-tertiary);font-size:13.5px}
.social-link{width:38px;height:38px;border:1px solid var(--kld-line);border-radius:999px;display:inline-flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:.18s}
.social-link:hover{border-color:var(--accent);color:var(--accent)}

/* ===== Genel section bg override ===== */
.section[style*="bg-secondary"]{background:var(--bg-secondary)!important;border-block:1px solid var(--kld-line)}

@media(max-width:900px){
  .grid-3,.process-grid{grid-template-columns:1fr 1fr}
  .why-grid{grid-template-columns:1fr;gap:36px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .hero h1{font-size:clamp(2.2rem,9vw,3rem)}
}
@media(max-width:560px){
  .grid-3,.process-grid,.why-visual,.footer-grid{grid-template-columns:1fr}
  .hero-metrics{gap:28px}
}

/* ===== v4 düzeltmeleri ===== */
.logo img{height:48px}
.header-inner{gap:30px}
.nav{gap:6px}
.nav-link{white-space:nowrap;font-size:13px;padding:8px 11px;text-transform:uppercase;letter-spacing:.05em}
.nav-link::after{display:none}
.nav-link:hover,.nav-link.active{background:transparent;color:var(--accent)}
[data-theme="dark"] .nav{background:transparent!important}
[data-theme="dark"] .header{background:color-mix(in srgb,var(--bg-primary) 82%,transparent)!important;border-bottom:1px solid var(--kld-line)!important}
[data-theme="dark"] .header.scrolled{background:color-mix(in srgb,var(--bg-primary) 88%,transparent)!important}

.why-item{border-radius:12px;border:1px solid transparent;border-bottom:1px solid var(--kld-line)}
.why-item:hover{transform:none;box-shadow:none;background:var(--bg-glass);border-color:transparent;border-bottom:1px solid var(--kld-line)}
.why-visual{grid-template-columns:1fr 1fr}
.why-visual .metric-card.wide{grid-column:auto}

.process-grid::before{display:none!important}

.grid:not(.grid-3){grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.service-card{background:var(--bg-card)}
.service-card img{height:180px!important}

/* ===== v5: keldo.dev kompakt ölçek + düzeltmeler ===== */
.container{max-width:1160px}
.hero{padding:clamp(96px,11vw,114px) 0 clamp(54px,7vw,70px)}
.hero h1{font-size:clamp(2.3rem,4.8vw,3.9rem)}
.hero-description{font-size:clamp(0.97rem,1vw,1.05rem);max-width:560px;margin-bottom:30px}
.hero-metric-num{font-size:1.95rem}
h2,.section-header h2,.page-hero h1{font-size:clamp(1.55rem,3vw,2.4rem)}
.page-hero h1{font-size:clamp(1.9rem,4vw,3rem)}
.section-header p,.page-hero p,.cta-section p{font-size:clamp(0.95rem,1vw,1.02rem)}
.section{padding:clamp(52px,7vw,80px) 0}
.section-header{margin-bottom:38px}
.cta-section{padding:clamp(64px,9vw,92px) 0}
.card{padding:26px 24px}
.card h3{font-size:1.1rem}
.card p{font-size:14px}
.card-icon{width:46px;height:46px;font-size:21px}
.metric-num{font-size:2.1rem}
.process-number{font-size:1.7rem}
.why-item h4{font-size:1rem}
.marquee-item{font-size:12px}

/* #2 section-label tiresi sadece bölüm başlıklarında; proje etiketi/chip'lerde değil */
.service-card .section-label::before{display:none}
.service-card .section-label{color:var(--text-tertiary);margin-bottom:0}

/* #4 footer marka logosu */
.footer-brand .logo img{height:38px;width:auto}
.footer-brand .logo span{display:none}

/* #1 proje kategori filtresi */
.proj-filter{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:36px}
.proj-fbtn{font-family:var(--kld-mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;padding:8px 16px;border:1px solid var(--kld-line);border-radius:999px;background:transparent;color:var(--text-secondary);cursor:pointer;transition:.18s}
.proj-fbtn:hover{border-color:var(--accent);color:var(--accent)}
.proj-fbtn.is-active{background:var(--accent);color:var(--bg-primary);border-color:var(--accent)}
[data-theme="dark"] .proj-fbtn.is-active{color:#0c1a12}