:root{
  --bg: #f3f6fb;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --border: rgba(15, 23, 42, .10);

  --shadow: 0 16px 40px rgba(15, 23, 42, .10);
  --shadow-sm: 0 10px 22px rgba(15, 23, 42, .08);
  --radius: 18px;

  /* Brand */
  --accent: #1d4ed8;
  --accent-hover: #1e40af;

  /* Floating buttons */
  --float-offset: 74px; /* daha yukarı/aşağı için bunu değiştir */
  --float-gap: 62px;
}

html, body { height: 100%; }

body{
  /* Band yapan radial gradientleri KALDIRDIK */
  background: linear-gradient(180deg, #f7f9ff 0%, #f2f6fb 100%);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body, .btn, .form-control, textarea{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}

/* Layout */
main.container{ max-width: 1100px; }

/* Navbar */
.navbar{
  background: rgba(255,255,255,.90) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 8px 24px rgba(15,23,42,.06);
}

.navbar-brand{ letter-spacing: .2px; }

.nav-link{
  color: rgba(15,23,42,.72) !important;
  font-weight: 600;
}
.nav-link:hover{
  color: rgba(15,23,42,1) !important;
}
.navbar .nav-link.active{
  color: rgba(15,23,42,1) !important;
  background: rgba(29,78,216,.10);
  border-radius: 999px;
  padding-left: .85rem !important;
  padding-right: .85rem !important;
}

/* Links */
a{
  color: var(--accent);
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
}
a:hover{
  color: var(--accent-hover);
  text-decoration-thickness: .12em;
}

/* Hero */
.hero{
  border-radius: calc(var(--radius) + 10px);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  background:
    linear-gradient(135deg, rgba(255,255,255,.95), rgba(255,255,255,.70));
}

.hero .display-6{
  font-size: clamp(1.9rem, 2.6vw, 2.6rem);
  letter-spacing: -0.6px;
  line-height: 1.12;
}

.hero .lead{
  color: var(--muted);
  max-width: 60ch;
}

/* Cards */
.card{
  border-radius: var(--radius) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-sm);
  background: var(--card);
}

.card .card-body{ padding: 1.25rem; }

.card.h-100{
  transition: transform .18s ease, box-shadow .18s ease;
}
.card.h-100:hover{
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}

/* Hero içindeki hızlı iletişim kartı */
.hero .card{
  border: 1px solid rgba(15,23,42,.08) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78));
}

/* Headings */
h2.h4{ letter-spacing: -.2px; }

/* Buttons */
.btn{
  border-radius: 999px;
  padding: .62rem 1.08rem;
  font-weight: 700;
  letter-spacing: .2px;
}
.btn-dark{
  background: linear-gradient(180deg, #111827, #0b1220) !important;
  border: none !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .18);
}
.btn-dark:hover{ transform: translateY(-1px); }

.btn-outline-dark{
  border-color: rgba(15,23,42,.25) !important;
  color: rgba(15,23,42,.90) !important;
}
.btn-outline-dark:hover{
  background: rgba(15,23,42,.06) !important;
}

/* Forms */
.form-control, textarea{
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.14);
  padding: .78rem .95rem;
}
.form-control:focus, textarea:focus{
  border-color: rgba(15,23,42,.35);
  box-shadow: 0 0 0 .25rem rgba(15,23,42,.10);
}

/* Footer (çizgi yok, hafif premium gölge var) */
footer{
  background: rgba(255,255,255,.65);
  border-top: none !important;
  box-shadow: 0 -10px 30px rgba(15,23,42,.06);
}

/* Floating WhatsApp */
.wa-float{
  position: fixed;
  right: 18px;
  bottom: var(--float-offset);
  z-index: 9999;
  background: #16a34a;
  color: #fff !important;
  text-decoration: none;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 800;
  box-shadow: 0 16px 36px rgba(22,163,74,.30);
  transform: translateY(0);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.wa-float:hover{
  transform: translateY(-2px);
  filter: brightness(1.02);
  box-shadow: 0 20px 44px rgba(22,163,74,.34);
}

/* Floating Telegram */
.tg-float{
  position: fixed;
  right: 18px;
  bottom: calc(var(--float-offset) + var(--float-gap));
  z-index: 9999;
  background: #229ED9;
  color: #fff !important;
  text-decoration: none;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 800;
  box-shadow: 0 16px 36px rgba(34,158,217,.28);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.tg-float:hover{
  transform: translateY(-2px);
  filter: brightness(1.02);
  box-shadow: 0 20px 44px rgba(34,158,217,.32);
}

/* Layout: footer en altta */
body.layout{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
body.layout main{ flex: 1; }
body.layout main.container{ padding-bottom: 1.25rem !important; }

/* Logo */
.brand-logo{
  width: 34px;
  height: 34px;
  object-fit: contain;
}

/* Mobile */
@media (max-width: 768px){
  .hero{ padding: 1.25rem !important; }
  main.container{ padding-left: 1rem; padding-right: 1rem; }
}
body{ background: #f3f6fb !important; }

.profile-side{
  padding: 14px;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 18px;
  background: rgba(255,255,255,.75);
}

.about-photo-lg{
  width: 100%;
  max-width: 220px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 14px 30px rgba(15,23,42,.10);
}
/* Linklerde alt çizgiyi kaldır (genel) */
a{ text-decoration: none !important; }
a:hover{
  text-decoration: underline;
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
}

/* Kart içindeki CTA linki */
a.details-link{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-weight: 700;
  color: var(--accent) !important;
  text-decoration: none !important;
}
a.details-link:hover{
  color: var(--accent-hover) !important;
  text-decoration: none !important;
  transform: translateX(2px);
  transition: transform .12s ease;
}
.exp-note{
  margin-top: 12px;
  padding: 10px 12px;
  border-left: 3px solid rgba(15,23,42,.22);
  background: rgba(15,23,42,.03);
  color: rgba(15,23,42,.78);
  border-radius: 12px;
  font-size: .95rem;
}
/* Link altı çizgileri azalt (özellikle kartlarda) */
.card-link{
  text-decoration: none !important;
  color: inherit !important;
  display: block;
}
.card-link:hover{
  text-decoration: none !important;
}

/* Kart içindeki “Detayları görüntüle →” daha temiz dursun */
.project-cta{
  text-decoration: none !important;
}

/* Modal içindeki proje görseli */
.project-image-wrap{
  background: rgba(255,255,255,.7);
  border-radius: 18px;
  padding: 12px;
}
.project-image{
  box-shadow: 0 18px 40px rgba(15,23,42,.10);
}
