:root{
  --primary:#5f2e88;--primary-light:#7a4da3;--primary-dark:#4a236c;
  --secondary:#2C3E50;--light:#F8F9FA;--text:#495057;
  --gradient:linear-gradient(135deg,#5f2e88 0%,#7a4da3 100%);
  /* === HERO ARKAPLAN GÖRSELİNİ BURADA AYARLA === */
  --hero-img:url('../images/blog/walper/hero-bg.jpg'); /* CSS dosyasından göreceli yol */
}

/* Body stilleri kaldırıldı - ana sayfa CSS'i kullanılacak */

/* ============ HERO ============ */
.ala-hero{
  position:relative;min-height:450px;padding:150px 0;
  display:flex;align-items:center;overflow:hidden;background-color:#351d50;
}
.ala-hero::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image: var(--hero-img), linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.35));
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.ala-hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background: radial-gradient(1200px 600px at 50% 30%, rgba(0,0,0,.20), rgba(0,0,0,.55)),
              linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.45) 100%);
}

.ala-hero .container, .ala-hero .row, .ala-hero [class*="col-"]{position:relative;z-index:2}
.hero-title{color:#fff;font-weight:800;font-size:3rem;margin-bottom:1.1rem;line-height:1.1;text-shadow:0 2px 10px rgba(0,0,0,.18)}
.hero-subtitle{font-size:1.1rem;font-weight:400;opacity:.95;margin-bottom:2rem;max-width:720px;margin-inline:auto;color:#eaeaea}
@media (max-width:575.98px){.hero-title{font-size:2.2rem}.hero-subtitle{font-size:1rem}}

.btn-hero{
  position:relative;z-index:3;pointer-events:auto;
  background:#fff;color:#1b1a1a;border-radius:999px;font-weight:700;padding:.85rem 1.4rem;border:none;
  display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;
  box-shadow:0 10px 24px rgba(0,0,0,.12);transition:transform .2s, box-shadow .2s;
}
.btn-hero:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(0,0,0,.18)}
.btn-hero i{animation:bounce 1.6s infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* ============ BLOG GRID ============ */
.blog-grid{padding:80px 0}
.section-title{text-align:center;margin-bottom:2.4rem}
.section-title h2{font-weight:800;color:var(--secondary);font-size:2rem;margin-bottom:1rem;display:inline-block;position:relative}
.section-title h2::after{content:'';position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);width:80px;height:4px;background:var(--gradient);border-radius:2px}

/* Kartları eşitle */
.blog-grid .row>[class*="col-"]{display:flex}
.blog-card{
  background:#fff;border-radius:16px;border:1px solid rgba(95,46,136,.1);
  box-shadow:0 4px 20px rgba(0,0,0,.08);transition:all .3s;margin-bottom:2rem;
  overflow:hidden;position:relative;display:flex;flex-direction:column;width:100%;
}
.blog-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(95,46,136,.15);border-color:rgba(95,46,136,.3)}

.card-image{position:relative;overflow:hidden;background:#eee;aspect-ratio:16/9}
@supports not (aspect-ratio:16/9){
  .card-image::before{content:"";display:block;padding-top:56.25%}
  .card-image>a,.card-image>img{position:absolute;inset:0}
}
.card-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.blog-card:hover .card-image img{transform:scale(1.05)}
.card-image a{display:block;width:100%;height:100%}

.card-content{padding:1.4rem 1.6rem;display:flex;flex-direction:column;flex:1}
.card-title{font-weight:700;color:var(--secondary);font-size:1.15rem;line-height:1.4;margin-bottom:.6rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-title a{text-decoration:none;color:inherit}
.card-excerpt{color:#6b7280;margin-bottom:1rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{display:flex;justify-content:space-between;align-items:center;padding-top:1rem;border-top:1px solid #e5e7eb}
.post-date{color:#9ca3af;font-size:.9rem}
.read-more{color:var(--primary);text-decoration:none;font-weight:600;transition:all .3s;display:inline-flex;align-items:center}
.read-more:hover{color:var(--primary-dark);transform:translateX(5px)}

/* Header scroll (senin sınıflarınla uyumlu) */
.navbar.navbar-fixed{position:fixed;top:0;right:0;left:0;background:#ffffff;animation:fadeInDown 1s ease-in-out;box-shadow:0 2px 4px rgba(3,27,78,.1);z-index:9999}
.navbar.navbar-fixed .navbar-brand .logo-dark{display:inline-block}
.navbar.navbar-fixed .navbar-brand .logo-light{display:none}
.navbar.navbar-fixed .navbar-nav>li>a{color:#1b1a1a}
.navbar.navbar-fixed .navbar-nav>li>a::before{background-color:#5f2e88}
@keyframes fadeInDown{0%{opacity:0;transform:translateY(-200px)}100%{opacity:1;transform:translateY(0)}}

/* Back to top */
.backtop{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:var(--gradient);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;visibility:hidden;transition:all .3s ease;z-index:9999;box-shadow:0 4px 15px rgba(95,46,136,.3)}
.backtop.show{opacity:1;visibility:visible}
.backtop:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(95,46,136,.4)}