/* GENEL KAPSAYICI */
.showcase-wrapper { width: 100%; margin-bottom: 25px; position: relative; }
.swiper { border-radius: 15px; overflow: hidden; }

/* NAVİGASYON (Premium Glass) */
.swiper-button-next, .swiper-button-prev { 
    width: 40px; height: 40px; background: rgba(0,0,0,0.4); backdrop-filter: blur(10px);
    border-radius: 12px; border: 1px solid rgba(255,255,255,0.1); color: #fff; transition: 0.3s;
}
.swiper-button-next:hover, .swiper-button-prev:hover { background: var(--primary-color); transform: scale(1.05); }
.swiper-button-next::after, .swiper-button-prev::after { font-size: 14px; font-weight: bold; }
.swiper-pagination-bullet { background: #fff; opacity: 0.3; }
.swiper-pagination-bullet-active { background: var(--primary-color); opacity: 1; width: 20px; border-radius: 5px; }

/* ORTAK ROZETLER */
.s-badge { padding: 4px 8px; border-radius: 6px; font-size: 10px; font-weight: 700; text-transform: uppercase; display: inline-flex; align-items: center; gap: 4px; }
.b-dil { background: var(--primary-color); color: #fff; }
.b-imdb { background: #f5c518; color: #000; }
.b-cat { background: rgba(255,255,255,0.2); color: #fff; backdrop-filter: blur(5px); }

/* STYLE 1: Compact Poster Card */
.style1-card { position: relative; display: block; border-radius: 12px; overflow: hidden; background: #1a1a1a; transition: 0.3s; height: 280px; }
.style1-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.5); }
.s1-img { width: 100%; height: 100%; object-fit: cover; }
.s1-badges { position: absolute; top: 10px; left: 10px; right: 10px; display: flex; justify-content: space-between; z-index: 2; }
.s1-content { position: absolute; bottom: 0; left: 0; width: 100%; padding: 40px 12px 12px; background: linear-gradient(to top, #000 30%, transparent); }
.s1-title { color: #fff; font-weight: 700; font-size: 14px; margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.s1-info { font-size: 11px; color: #aaa; }

/* STYLE 2: Landscape Modern Card */
.style2-card { display: block; height: 220px; border-radius: 15px; background-size: cover; background-position: center; overflow: hidden; position: relative; transition: 0.4s; }
.s2-inner { position: absolute; inset: 0; background: linear-gradient(to right, rgba(0,0,0,0.9) 20%, transparent); padding: 20px; display: flex; flex-direction: column; justify-content: space-between; }
.s2-title { color: #fff; font-size: 22px; font-weight: 800; margin: 0; max-width: 70%; line-height: 1.2; }
.s2-footer { display: flex; align-items: center; justify-content: space-between; }
.s2-imdb { color: #f5c518; font-weight: 700; font-size: 14px; }
.s2-btn { width: 40px; height: 40px; background: #fff; color: #000; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; transition: 0.3s; }
.style2-card:hover .s2-btn { background: var(--primary-color); color: #fff; transform: scale(1.1); }

/* STYLE 3: Premium Hero Banner */
.style3-hero { height: 450px; background-size: cover; background-position: center; position: relative; }
.style3-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, #000 25%, transparent 100%); display: flex; align-items: center; padding: 0 50px; }
.style3-body { max-width: 550px; }
.s3-meta { display: flex; align-items: center; gap: 15px; margin-bottom: 15px; color: #ccc; font-weight: 600; font-size: 14px; }
.style3-title { font-size: 42px; font-weight: 900; color: #fff; margin: 0 0 15px; text-transform: uppercase; line-height: 1; }
.style3-text { color: #ddd; font-size: 15px; line-height: 1.5; margin-bottom: 25px; opacity: 0.8; }
.style3-btns { display: flex; gap: 15px; }
.btn-p, .btn-s { padding: 12px 25px; border-radius: 8px; font-weight: 700; font-size: 13px; text-decoration: none; transition: 0.3s; }
.btn-p { background: var(--primary-color); color: #fff; }
.btn-s { background: rgba(255,255,255,0.1); color: #fff; backdrop-filter: blur(10px); }
.btn-p:hover { transform: translateY(-3px); filter: brightness(1.2); }

@media (max-width: 768px) {
    .style3-hero { height: 350px; }
    .style3-overlay { padding: 25px; background: linear-gradient(to top, #000 50%, transparent); align-items: flex-end; }
    .style3-title { font-size: 24px; }
    .style3-text, .btn-s { display: none; }
}