/*
Theme Name: Professional Premium Theme
Version: 20.2
Description: Clean Movie Layout Stable - No Zoom
*/

/* RESET */
*{
margin:0;
padding:0;
box-sizing:border-box;
}

html,body{
width:100%;
overflow-x:hidden;
}

body{
font-family:'Poppins',sans-serif;
background:#0f172a;
color:#f1f5f9;
}

/* CONTAINER */
.container{
width:95%;
max-width:1400px;
margin:0 auto;
padding:0 20px;
}

/* HEADER */
.site-header{
background:#0b1120;
padding:20px 0;
}

.logo{
width:95%;
max-width:1400px;
margin:0 auto;
padding:0 20px;
}

.logo a{
color:#fff;
font-size:22px;
font-weight:700;
text-decoration:none;
}

/* MAIN */
.site-main{
padding:10px 0 60px;
}

.section-title{
display:flex;
align-items:center;
gap:12px;
font-size:20px;
font-weight:600;
margin:18px 0 20px;
}

/* Badge NEW */
.section-title .badge{
background:#2563eb;
color:#fff;
font-size:12px;
font-weight:600;
padding:5px 10px;
border-radius:999px; /* pill shape modern */
line-height:1;
display:inline-flex;
align-items:center;
}

/* GRID */
.movie-list{
display:grid;
grid-template-columns:repeat(auto-fill, minmax(190px,1fr));
gap:22px;
}

.movie-item{
width:100%;
}

/* POSTER TANPA ZOOM */
.movie-item img{
width:100%;
height:auto;
border-radius:16px;
display:block;
transition:0.3s ease;
}

/* PAGINATION */
.pagination{
margin-top:40px;
text-align:center;
}

.pagination .page-numbers{
display:inline-block;
padding:7px 13px;
margin:5px;
background:#1e293b;
color:#fff;
border-radius:6px;
text-decoration:none;
font-size:14px;
}

.pagination .current{
background:#e50914;
}

/* MOBILE */
@media (max-width:768px){

.container{
width:100%;
padding:0 14px;
}

.movie-list{
grid-template-columns:repeat(2,1fr);
gap:16px;
}

}

/* ================= HEADER MODERN ================= */

.site-header{
background:#0b1120;
padding:18px 0;
border-bottom:1px solid rgba(255,255,255,0.05);
}

.header-inner{
display:flex;
justify-content:space-between;
align-items:center;
}

.logo-wrapper img{
max-height:45px;
width:auto;
}

.site-title{
font-size:22px;
font-weight:700;
color:#fff;
text-decoration:none;
}

.main-nav .nav-menu{
list-style:none;
display:flex;
gap:25px;
}

.main-nav .nav-menu li a{
color:#cbd5e1;
text-decoration:none;
font-size:14px;
transition:0.3s;
}

.main-nav .nav-menu li a:hover{
color:#fff;
}

/* ================= FOOTER MODERN ================= */

.site-footer{
background:#0b1120;
padding:25px 0;
margin-top:60px;
border-top:1px solid rgba(255,255,255,0.05);
}

.footer-inner{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:15px;
}

.footer-right a{
color:#94a3b8;
margin-left:20px;
text-decoration:none;
font-size:14px;
transition:0.3s;
}

.footer-right a:hover{
color:#fff;
}

/* ================= MOBILE HEADER ================= */

@media(max-width:768px){

.header-inner{
flex-direction:column;
gap:15px;
}

.main-nav .nav-menu{
flex-wrap:wrap;
justify-content:center;
gap:15px;
}

.footer-inner{
flex-direction:column;
text-align:center;
}

.footer-right a{
margin:0 10px;
}

}

/* SINGLE PAGE */

.single-page{
max-width:1000px;
margin:0 auto;
padding:40px 20px;
}

/* TITLE */
.movie-title{
font-size:28px;
margin-bottom:25px;
}

/* PLAYER */
.player-section{
background:#0b1120;
padding:20px;
border-radius:16px;
margin-bottom:30px;
}

.video-frame{
position:relative;
width:100%;
padding-top:56.25%;
background:#000;
border-radius:12px;
overflow:hidden;
}

.video-frame iframe{
position:absolute;
top:0;
left:0;
width:100% !important;
height:100% !important;
}

.server-buttons{
margin-top:15px;
display:flex;
gap:10px;
flex-wrap:wrap;
}

.server-buttons button{
background:#1e293b;
color:#fff;
border:none;
padding:8px 16px;
border-radius:8px;
cursor:pointer;
transition:0.3s;
}

.server-buttons button.active{
background:#e50914;
}

.server-buttons button:hover{
background:#334155;
}

/* DOWNLOAD */
.download-section{
display:flex;
gap:20px;
background:#0b1120;
padding:20px;
border-radius:16px;
margin-bottom:20px;
flex-wrap:wrap;
}

.download-left img{
width:85px;
height:120px;        /* rasio 2:3 */
object-fit:cover;    /* biar proporsional */
border-radius:8px;
display:block;
}

.download-right{
flex:1;
}

.download-title{
margin-bottom:15px;
font-size:18px;
}

.download-buttons{
display:flex;
gap:10px;
flex-wrap:wrap;
}

.download-buttons a{
background:#2563eb;
color:#fff;
padding:8px 14px;
border-radius:6px;
text-decoration:none;
transition:0.3s;
font-size:14px;
}

.download-buttons a:hover{
background:#1d4ed8;
}

/* DIVIDER */
.content-divider{
border:none;
border-top:1px solid rgba(255,255,255,0.1);
margin:25px 0;
}

/* DESCRIPTION */
.movie-description{
color:#cbd5e1;
line-height:1.7;
margin-bottom:15px;
}

/* VIEWS */
.post-views{
font-size:14px;
color:#94a3b8;
margin-bottom:40px;
}

/* MOBILE */
@media(max-width:768px){
.download-section{
flex-direction:column;
align-items:center;
text-align:center;
}
.download-left img{
width:120px;
}
}

/* ===== RECOMMENDED MOVIES ===== */

.recommended-wrapper{
margin-top:50px;
}

.related-title{
margin-bottom:20px;
font-size:20px;
}

/* ===== RECOMMENDED GRID ===== */

.recommended-grid{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:20px;
}

/* Tablet */
@media (max-width:1024px){
.recommended-grid{
grid-template-columns:repeat(3,1fr);
}
}

/* Mobile FIX 2-2-2 */
@media (max-width:768px){
.recommended-grid{
grid-template-columns:repeat(2,1fr) !important;
gap:15px;
}
}

.recommended-item img{
width:100%;
aspect-ratio:2/3;
object-fit:cover;
border-radius:14px;
display:block;
transition:0.3s ease;
}

.recommended-item img:hover{
transform:scale(1.05);
}

/* Tablet */
@media(max-width:1024px){
.recommended-grid{
grid-template-columns:repeat(3,1fr);
}
}

/* Mobile */
@media(max-width:768px){
.recommended-grid{
grid-template-columns:repeat(2,1fr);
gap:15px;
}
}




.single-page{
max-width:1100px;
margin:0 auto;
padding:40px 20px 20px 20px;
}

.recommended-wrapper{
width:100%;
margin-top:50px;
}

.recommended-grid{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:20px;
}



/* ================= MOBILE DOWNLOAD LAYOUT ================= */

@media (max-width:768px){

.download-section{
display:flex;
flex-direction:row;
align-items:flex-start;
gap:15px;
padding:18px;
}

/* Poster kiri */
.download-left{
flex:0 0 80px;
}

.download-left img{
width:80px;
height:120px;
object-fit:cover;
border-radius:10px;
}

/* Kanan */
.download-right{
flex:1;
}

.download-title{
font-size:15px;
margin-bottom:10px;
line-height:1.4;
}

/* Tombol 2 per baris */
.download-buttons{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:8px;
}

.download-buttons a{
font-size:12px;
padding:6px 8px;
text-align:center;
}

/* Deskripsi */
.movie-description{
margin-top:20px;
font-size:14px;
line-height:1.6;
}

/* Tags */
.post-tags{
margin-top:10px;
font-size:12px;
color:#94a3b8;
}

}




/* Hilangkan jarak berlebihan sebelum footer */
.single-page{
padding-bottom:20px !important;
}

.recommended-wrapper{
margin-bottom:20px !important;
}

.site-footer{
margin-top:0 !important;
padding-top:25px;
}


/* ================= PAGE STYLE ================= */

.page-container{
max-width:900px;
margin:60px auto;
padding:0 20px;
}

.page-box{
background:#0b1120;
padding:40px;
border-radius:16px;
box-shadow:0 10px 30px rgba(0,0,0,0.4);
}

.page-title{
font-size:28px;
margin-bottom:25px;
border-bottom:1px solid rgba(255,255,255,0.08);
padding-bottom:15px;
}

.page-content{
color:#cbd5e1;
line-height:1.8;
font-size:15px;
}

.page-content h2{
margin-top:30px;
margin-bottom:10px;
font-size:20px;
}

.page-content ul{
margin-left:20px;
}

.page-content a{
color:#3b82f6;
text-decoration:none;
}

.page-content a:hover{
text-decoration:underline;
}

/* MOBILE */
@media(max-width:768px){
.page-box{
padding:25px;
}
.page-title{
font-size:22px;
}
}

/* ================= LEGAL PAGE STYLE ================= */

.page-container{
max-width:900px;
margin:60px auto 80px auto;
padding:0 20px;
}

.page-box{
background:#0b1120;
padding:50px;
border-radius:18px;
box-shadow:0 20px 60px rgba(0,0,0,0.4);
}

.page-title{
font-size:32px;
margin-bottom:30px;
font-weight:700;
letter-spacing:1px;
}

.page-content{
font-size:16px;
line-height:1.9;
color:#cbd5e1;
}

.page-content p{
margin-bottom:18px;
}

.page-content h2{
font-size:22px;
margin-top:40px;
margin-bottom:15px;
font-weight:600;
}

.page-content h3{
font-size:18px;
margin-top:30px;
margin-bottom:10px;
font-weight:600;
}

.page-content ul{
margin:15px 0 20px 25px;
}

.page-content li{
margin-bottom:8px;
}

.page-content strong{
color:#ffffff;
}

.page-content a{
color:#3b82f6;
text-decoration:none;
}

.page-content a:hover{
text-decoration:underline;
}

/* MOBILE */
@media(max-width:768px){

.page-box{
padding:30px 22px;
}

.page-title{
font-size:24px;
}

.page-content{
font-size:15px;
}

}


/* ================= 404 PAGE ================= */

.error-page{
text-align:center;
padding:80px 20px;
}

.error-box{
margin-bottom:60px;
}

.error-code{
font-size:90px;
font-weight:800;
color:#e50914;
margin-bottom:10px;
}

.error-title{
font-size:28px;
margin-bottom:15px;
}

.error-text{
color:#94a3b8;
margin-bottom:25px;
}

.btn-home{
background:#2563eb;
padding:10px 20px;
border-radius:8px;
color:#fff;
text-decoration:none;
display:inline-block;
transition:0.3s;
}

.btn-home:hover{
background:#1d4ed8;
}

.error-search{
margin-top:30px;
}

.error-recommended{
margin-top:80px;
}

.error-recommended h3{
margin-bottom:30px;
font-size:22px;
}





/* ================= HEADER SEARCH MODERN ================= */


.header-search{
    flex:1;
    display:flex;
    justify-content:center;
    align-items:center;
}

.search-form{
    display:flex;
    align-items:center;
    width:100%;
    max-width:480px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:40px;
    overflow:hidden;
}

.search-input{
    flex:1;
    padding:12px 18px;
    background:transparent;
    border:none;
    color:#fff;
    font-size:14px;
    outline:none;
}

.search-input::placeholder{
    color:rgba(255,255,255,0.4);
}

.search-button{
    padding:0 18px;
    height:44px;
    border:none;
    background:#2563eb;
    color:#fff;
    cursor:pointer;
    font-size:16px;
    transition:0.3s;
}

.search-button:hover{
    background:#1d4ed8;
}


/* ================= SEARCH PAGE ================= */

.search-page{
max-width:1100px;
margin:60px auto 80px auto;
padding:0 20px;
}

.search-header{
text-align:center;
margin-bottom:50px;
}

.search-title{
font-size:30px;
margin-bottom:10px;
}

.search-keyword{
color:#94a3b8;
margin-bottom:25px;
}

.search-box{
display:flex;
justify-content:center;
}

.search-grid{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:20px;
}

.search-item img{
width:100%;
aspect-ratio:2/3;
object-fit:cover;
border-radius:14px;
transition:0.3s;
}

.search-item img:hover{
transform:scale(1.05);
}

.no-result{
text-align:center;
margin-bottom:40px;
color:#94a3b8;
}

/* Tablet */
@media(max-width:1024px){
.search-grid{
grid-template-columns:repeat(3,1fr);
}
}

/* Mobile */
@media(max-width:768px){
.search-grid{
grid-template-columns:repeat(2,1fr);
gap:15px;
}
.search-title{
font-size:22px;
}
}


/* ================= ARCHIVE PAGE ================= */

.archive-page{
    max-width:1200px;
    margin:70px auto 100px;
    padding:0 20px;
}

.archive-header{
    text-align:center;
    margin-bottom:60px;
}

.archive-title{
    font-size:30px;
    margin-bottom:15px;
}

.archive-description{
    color:#94a3b8;
    max-width:750px;
    margin:0 auto;
    line-height:1.7;
}

/* GRID */
.archive-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:22px;
}

.archive-item img{
    width:100%;
    aspect-ratio:2/3;
    object-fit:cover;
    border-radius:16px;
    transition:0.3s ease;
}

.archive-item img:hover{
    transform:scale(1.05);
}

/* PAGINATION */
.archive-pagination{
    text-align:center;
    margin-top:60px;
}

.archive-pagination ul{
    list-style:none;
    padding:0;
}

.archive-pagination li{
    display:inline-block;
    margin:5px;
}

.archive-pagination a,
.archive-pagination span{
    display:inline-block;
    padding:8px 14px;
    background:#1e293b;
    border-radius:6px;
    color:#fff;
    text-decoration:none;
}

.archive-pagination .current{
    background:#2563eb;
}

/* Tablet */
@media(max-width:1024px){
    .archive-grid{
        grid-template-columns:repeat(3,1fr);
    }
}

/* Mobile */
@media(max-width:768px){
    .archive-grid{
        grid-template-columns:repeat(2,1fr);
        gap:16px;
    }

    .archive-title{
        font-size:22px;
    }
}
    display:inline-block;
    margin:5px;
    padding:8px 14px;
    background:#1e293b;
    border-radius:6px;
    color:#fff;
    text-decoration:none;
}

.archive-pagination .current{
    background:#2563eb;
}

/* Tablet */
@media(max-width:1024px){
    .archive-grid{
        grid-template-columns:repeat(3,1fr);
    }
}

/* Mobile */
@media(max-width:768px){
    .archive-grid{
        grid-template-columns:repeat(2,1fr);
        gap:16px;
    }

    .archive-title{
        font-size:22px;
    }
}