/* ============================================================
   HostScore360 — Modern Tasarım Katmanı (2026-07-03)
   style.css ÜZERİNE additif iyileştirme. Yapıyı bozmaz; gölge,
   yumuşak geçiş, cam efektli header, kart hover lift, scroll-reveal,
   görsel yükleme, sponsor parıltı ve tipografi rafinesi ekler.
   ============================================================ */

:root{
  --hs-ease: cubic-bezier(.22,.61,.36,1);
  --hs-shadow-soft: 0 4px 24px -8px rgba(15,23,42,.14);
  --hs-shadow-hover: 0 18px 44px -18px rgba(30,64,175,.34);
  --hs-ring: 0 0 0 3px rgba(37,99,235,.12);
}

html{ scroll-behavior:smooth; }
body{ text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; }

/* ---- Cam efektli sticky header ---- */
.header{
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:saturate(180%) blur(12px);
  -webkit-backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid rgba(226,232,240,.9) !important;
  transition:box-shadow .25s var(--hs-ease), background .25s var(--hs-ease);
}
.header.hs-scrolled{ box-shadow:0 6px 24px -12px rgba(15,23,42,.22) !important; }
.logo i, .logo .fa-chart-line{ filter:drop-shadow(0 2px 6px rgba(37,99,235,.35)); }

/* ---- Nav link mikro-etkileşim + alt çizgi ---- */
.nav-link{ position:relative; transition:color .18s var(--hs-ease), background .18s var(--hs-ease); }
.nav-link:not(.nav-cta)::after{
  content:''; position:absolute; left:12px; right:12px; bottom:3px; height:2px;
  background:linear-gradient(90deg,#2563eb,#60a5fa); border-radius:2px;
  transform:scaleX(0); transform-origin:left; transition:transform .22s var(--hs-ease);
}
.nav-link:not(.nav-cta):hover::after, .nav-link.active:not(.nav-cta)::after{ transform:scaleX(1); }
.nav-link.nav-cta{ box-shadow:0 6px 18px -8px rgba(15,23,42,.5); transition:transform .18s var(--hs-ease), box-shadow .18s var(--hs-ease); }
.nav-link.nav-cta:hover{ transform:translateY(-1px); box-shadow:0 10px 24px -8px rgba(15,23,42,.55); }

/* ---- Kart hover lift (tüm kart tipleri) ---- */
.firm-card, .firm-card2, .fc2-card, .stat-card, .pricing-card,
.fk-deal, .fk-ram-card, .fd-card, .blog-card, .podium-card,
.cmp-header-firm{
  transition:transform .2s var(--hs-ease), box-shadow .2s var(--hs-ease), border-color .2s var(--hs-ease) !important;
  will-change:transform;
}
.firm-card:hover, .firm-card2:hover, .stat-card:hover, .fd-card:hover,
.blog-card:hover, .fk-ram-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--hs-shadow-hover) !important;
}
.pricing-card{ border-radius:16px !important; }
.pricing-card:hover{ transform:translateY(-4px); box-shadow:var(--hs-shadow-hover) !important; }
.pricing-card.popular{ border-color:#2563eb !important; box-shadow:0 0 0 1px #2563eb, var(--hs-shadow-soft) !important; }

/* ---- Butonlar: yumuşak, dolgulu, mikro-hareket ---- */
.btn, .btn-visit, .btn-review, .cea-btn, .fc2-btn, .fk-fbtn, .df-sbtn,
.btn-plan, .btn-write-review, .cmp-btn{
  transition:transform .16s var(--hs-ease), box-shadow .16s var(--hs-ease), background .16s var(--hs-ease), filter .16s var(--hs-ease) !important;
}
.btn-visit:hover, .btn-plan:hover, .cmp-btn:hover, .btn-write-review:hover{
  transform:translateY(-1px); filter:brightness(1.03);
  box-shadow:0 10px 24px -10px rgba(37,99,235,.5);
}
:focus-visible{ outline:none; box-shadow:var(--hs-ring); border-radius:8px; }

/* ---- Görsel yükleme: aspect korunur, yumuşak fade ---- */
img{ max-width:100%; height:auto; }
img[loading="lazy"]{ background:#f1f5f9; }
.firm-logo-large, .fc2-logo, .fd-logo, .firm-logo{ transition:transform .25s var(--hs-ease); }
.firm-card:hover .fc2-logo, .fd-card:hover .fd-logo{ transform:scale(1.06); }

/* ---- Scroll-reveal (JS ile .hs-reveal → .hs-in) ---- */
.hs-reveal{ opacity:0; transform:translateY(16px); }
.hs-reveal.hs-in{ opacity:1; transform:none; transition:opacity .5s var(--hs-ease), transform .5s var(--hs-ease); }

/* ---- Sponsor / öne çıkan parıltı ---- */
.is-sponsored, .firm-row.sponsored, [data-sponsored="1"]{ position:relative; }
.hs-sponsor-badge{
  display:inline-flex; align-items:center; gap:5px;
  background:linear-gradient(135deg,#f59e0b,#f97316); color:#fff;
  font-size:11px; font-weight:800; letter-spacing:.3px; padding:3px 10px; border-radius:20px;
  box-shadow:0 4px 12px -4px rgba(245,158,11,.6);
}
.hs-sponsor-badge i{ font-size:10px; }
@keyframes hsGlow{ 0%,100%{box-shadow:0 0 0 1px rgba(245,158,11,.5),0 0 18px -6px rgba(245,158,11,.5);} 50%{box-shadow:0 0 0 1px rgba(245,158,11,.9),0 0 26px -4px rgba(245,158,11,.75);} }
.hs-sponsor-glow{ animation:hsGlow 3s ease-in-out infinite; border-radius:14px; }

/* ---- Modern footer rafinesi ---- */
.footer{ background:linear-gradient(180deg,#0f172a,#0b1220) !important; }
.footer a{ transition:color .15s var(--hs-ease), padding-left .15s var(--hs-ease); }
.footer a:hover{ color:#fff !important; padding-left:3px; }
.footer-links-col h4{ position:relative; padding-bottom:8px; }
.footer-links-col h4::after{ content:''; position:absolute; left:0; bottom:0; width:28px; height:2px; background:linear-gradient(90deg,#2563eb,#60a5fa); border-radius:2px; }

/* ---- Bölüm başlıkları: hafif gradient vurgu ---- */
.hero-highlight::after{ height:6px !important; opacity:.18 !important; background:linear-gradient(90deg,#2563eb,#60a5fa) !important; border-radius:4px !important; }

/* ---- Tablo satır hover yumuşatma ---- */
.fk-table tr, .df-table tr{ transition:background .12s var(--hs-ease); }

/* ---- AI/modern estetik: hero gradient mesh + aksan ---- */
.hero{ position:relative; overflow:hidden; background:linear-gradient(180deg,#ffffff,#f8fafc) !important; }
.hero::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(520px 300px at 15% -10%, rgba(37,99,235,.10), transparent 60%),
    radial-gradient(480px 280px at 88% 0%, rgba(124,58,237,.10), transparent 60%);
}
.hero .container{ position:relative; z-index:1; }
.hero-badge-top{ backdrop-filter:blur(4px); }
.hero-title{ background:linear-gradient(90deg,#0f172a,#1e293b); -webkit-background-clip:text; background-clip:text; }

/* Bölüm başlıklarına ince AI aksanı */
.podium-header h2, .firms-section h2, .hs-cmp-head h2, .fk-sec-title, .fd-sec-head h2{ letter-spacing:-.02em; }

/* Skor/rozet rakamlarına yumuşak parıltı */
.score-badge, .podium-score, .hero-stat strong{ text-shadow:0 1px 0 rgba(255,255,255,.5); }

/* Kart köşe yumuşatma tutarlılığı */
.firm-card2, .fd-card, .fk-deal, .fk-ram-card, .blog-card, .stat-card{ border-radius:14px !important; }

/* Arama kutusu odak halkası */
.hero-search:focus-within{ box-shadow:0 0 0 4px rgba(37,99,235,.12); border-radius:14px; }

/* ---- Erişilebilirlik: hareketi azalt tercihi ---- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .hs-reveal{ opacity:1 !important; transform:none !important; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}
