/* İD Bilişim — Blog Slider ve Kart Düzeltmesi 2026
   Yalnız blog.php vitrini ve blog kartlarını etkiler. */

.premium-blog-showcase{
  position:relative;
  isolation:isolate;
  padding:clamp(18px,2.4vw,30px) 0 clamp(30px,4vw,54px);
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 8%,color-mix(in srgb,var(--idb-accent) 12%,transparent),transparent 32%),
    radial-gradient(circle at 92% 12%,color-mix(in srgb,var(--idb-accent-2) 14%,transparent),transparent 36%),
    linear-gradient(180deg,color-mix(in srgb,var(--idb-surface) 97%,#020713),var(--idb-bg));
  border-bottom:1px solid color-mix(in srgb,var(--idb-border) 70%,transparent);
}
.premium-blog-showcase:before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.12;
  background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:46px 46px;
}
.premium-blog-showcase>.container{position:relative}
.premium-blog-showcase .premium-slider-stage{
  position:relative;
  width:100%;
  min-height:clamp(500px,48vw,680px);
  border:1px solid color-mix(in srgb,var(--idb-border) 88%,transparent);
  border-radius:clamp(20px,2.5vw,32px);
  overflow:hidden;
  background:linear-gradient(145deg,#071426,#050b16);
  box-shadow:0 28px 90px rgba(0,0,0,.38);
}
.premium-blog-showcase .premium-slider-slide{
  grid-template-columns:minmax(0,1.12fr) minmax(330px,.88fr);
  width:100%;
  height:100%;
  min-height:inherit;
}
.premium-blog-showcase .premium-slider-visual{
  position:relative;min-width:0;min-height:100%;
  display:grid;place-items:center;overflow:hidden;background:#050b14;
}
.premium-blog-showcase .premium-slider-visual:after{display:none}
.premium-slider-backdrop{
  position:absolute;inset:-28px;background-position:center;background-size:cover;
  filter:blur(30px) saturate(.9);transform:scale(1.1);opacity:.28;
}
.premium-slider-backdrop:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(3,8,18,.10),rgba(3,8,18,.30));
}
.premium-slider-image-button{
  position:relative;z-index:1;width:100%;height:100%;display:grid;place-items:center;
  border:0;padding:clamp(14px,2.2vw,30px);background:transparent;cursor:zoom-in;
}
.premium-blog-showcase .premium-slider-visual img{
  width:100%;height:100%;max-width:100%;max-height:100%;display:block;
  object-fit:contain;object-position:center;border-radius:clamp(12px,1.5vw,18px);
  filter:drop-shadow(0 22px 46px rgba(0,0,0,.38));
}
.premium-blog-showcase .premium-slider-copy{
  position:relative;padding:clamp(28px,4vw,58px);justify-content:center;
  background:
    radial-gradient(circle at 100% 0,color-mix(in srgb,var(--idb-accent-2) 15%,transparent),transparent 42%),
    linear-gradient(155deg,color-mix(in srgb,var(--idb-card) 93%,transparent),color-mix(in srgb,var(--idb-bg) 98%,transparent));
}
.premium-blog-showcase .premium-slider-copy h2{
  font-size:clamp(1.75rem,3.4vw,3.65rem);line-height:1.04;letter-spacing:-.038em;overflow-wrap:anywhere;
}
.premium-blog-showcase .premium-slider-copy p{
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;
}
.premium-blog-showcase .premium-slider-link{
  padding:12px 16px;border-radius:13px;
  border:1px solid color-mix(in srgb,var(--idb-accent) 35%,transparent);
  background:color-mix(in srgb,var(--idb-accent) 9%,transparent);
}
.premium-slider-topline{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* Oklar sliderın tam sol ve sağ orta noktasındadır. */
.premium-blog-showcase .premium-slider-controls-overlay{
  position:absolute;inset:0;z-index:8;display:block;pointer-events:none;
}
.premium-blog-showcase .premium-slider-controls-overlay button{
  position:absolute;top:50%;transform:translateY(-50%);
  width:54px;height:54px;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.17);border-radius:50%;
  background:rgba(4,10,22,.82);color:#fff;font-size:2.1rem;line-height:1;
  box-shadow:0 14px 34px rgba(0,0,0,.38);backdrop-filter:blur(14px);
  cursor:pointer;pointer-events:auto;transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.premium-blog-showcase .premium-slider-controls-overlay button:hover{
  transform:translateY(-50%) scale(1.06);
  border-color:var(--idb-accent);
  background:color-mix(in srgb,rgba(4,10,22,.9) 80%,var(--idb-accent) 20%);
}
.premium-blog-showcase .premium-slider-controls-overlay [data-premium-prev]{left:16px}
.premium-blog-showcase .premium-slider-controls-overlay [data-premium-next]{right:16px}

.premium-blog-showcase .premium-slider-rail{
  grid-auto-columns:minmax(210px,1fr);gap:12px;padding-top:16px;scroll-snap-type:x mandatory;
}
.premium-blog-showcase .premium-slider-thumb{
  scroll-snap-align:start;grid-template-columns:82px minmax(0,1fr);min-height:72px;
  padding:9px;border-radius:16px;background:color-mix(in srgb,var(--idb-card) 86%,transparent);
}
.premium-slider-thumb-media{
  width:82px;height:54px;display:grid;place-items:center;border-radius:10px;overflow:hidden;background:#071426;
}
.premium-blog-showcase .premium-slider-thumb img{
  width:100%;height:100%;object-fit:cover;object-position:center;border-radius:0;
}
.premium-blog-showcase .premium-slider-thumb b{font-size:.78rem;line-height:1.35}
.premium-blog-showcase .premium-slider-progress{
  margin-top:15px;height:4px;background:color-mix(in srgb,var(--idb-border) 60%,transparent);
}

/* Blog kartları */
.premium-blog-grid{gap:clamp(18px,2.6vw,30px);align-items:stretch;padding-top:clamp(28px,4vw,54px)}
.premium-blog-card{
  display:flex;flex-direction:column;min-width:0;overflow:hidden;
  border-radius:22px;background:linear-gradient(180deg,color-mix(in srgb,var(--idb-card) 94%,transparent),color-mix(in srgb,var(--idb-bg) 98%,transparent));
}
.premium-blog-card .modern-content-body{display:flex;flex:1;flex-direction:column}
.premium-blog-card .modern-content-link{margin-top:auto;padding-top:10px}
.premium-blog-media{
  position:relative;isolation:isolate;aspect-ratio:16/9;min-height:0;
  display:block;overflow:hidden;background:#050b14;
}
.premium-blog-media .premium-blog-backdrop{display:none!important}
.premium-blog-media .premium-blog-image-button{
  width:100%;height:100%;display:block;padding:0;border:0;background:#050b14;overflow:hidden;
}
.premium-blog-media img{
  width:100%!important;height:100%!important;display:block;
  object-fit:cover!important;object-position:center center;
  border-radius:0!important;filter:none!important;transform:scale(1.02)!important;
}
.premium-blog-card:hover .premium-blog-media img{transform:scale(1.055)!important}
.premium-blog-badge{display:none!important}
.premium-blog-card .modern-content-body h2{overflow-wrap:anywhere}
.premium-blog-card .modern-content-body p{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  overflow:hidden;min-height:5.25em;
}

@media(max-width:900px){
  .premium-blog-showcase{padding-top:14px}
  .premium-blog-showcase .premium-slider-stage{min-height:0}
  .premium-blog-showcase .premium-slider-slide{
    position:relative;inset:auto;display:none;grid-template-columns:1fr;min-height:0;transform:none;
  }
  .premium-blog-showcase .premium-slider-slide.is-active{display:grid}
  .premium-blog-showcase .premium-slider-visual{aspect-ratio:16/9;min-height:0}
  .premium-blog-showcase .premium-slider-copy{min-height:310px;padding:28px 26px 34px}
  .premium-blog-showcase .premium-slider-controls-overlay button{width:48px;height:48px;font-size:1.8rem}
  .premium-blog-showcase .premium-slider-controls-overlay [data-premium-prev]{left:10px}
  .premium-blog-showcase .premium-slider-controls-overlay [data-premium-next]{right:10px}
}
@media(max-width:640px){
  .premium-blog-showcase{padding:10px 0 26px}
  .premium-blog-showcase .premium-slider-stage{border-radius:18px}
  .premium-blog-showcase .premium-slider-visual{aspect-ratio:16/10}
  .premium-blog-showcase .premium-slider-image-button{padding:8px}
  .premium-blog-showcase .premium-slider-copy{padding:22px 18px 26px;min-height:0}
  .premium-blog-showcase .premium-slider-copy h2{font-size:clamp(1.5rem,8vw,2.05rem);margin:12px 0}
  .premium-blog-showcase .premium-slider-copy p{-webkit-line-clamp:3;font-size:.94rem}
  .premium-blog-showcase .premium-slider-controls-overlay button{
    width:42px;height:42px;font-size:1.55rem;background:rgba(4,10,22,.88);
  }
  .premium-blog-showcase .premium-slider-controls-overlay [data-premium-prev]{left:7px}
  .premium-blog-showcase .premium-slider-controls-overlay [data-premium-next]{right:7px}
  .premium-blog-showcase .premium-slider-rail{grid-auto-columns:82%}
  .premium-blog-showcase .premium-slider-thumb{grid-template-columns:72px minmax(0,1fr)}
  .premium-slider-thumb-media{width:72px;height:50px}
  .premium-blog-grid{gap:18px}
  .premium-blog-card{border-radius:18px}
  .premium-blog-media{aspect-ratio:16/9}
  .premium-blog-card .modern-content-body{padding:20px 17px}
  .premium-blog-card .modern-content-body h2{font-size:1.3rem}
  .premium-blog-card .modern-content-body p{min-height:0;-webkit-line-clamp:4}
}
@media(prefers-reduced-motion:reduce){
  .premium-blog-showcase *, .premium-blog-card *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}