body {margin: 0; font-family:"Roboto Condensed",Sans-serif; background: #111113; color: #fff;}
.container {width: 1200px; max-width: 95%; margin: 0 auto;}
.avr-section-reveal {opacity: 0; transform: translateY(40px); transition: opacity 1.6s ease, transform 1.6s ease !important; will-change: opacity, transform;}
.avr-section-reveal.is-visible {opacity: 1; transform: translateY(0);}
/* ==============================
   HEADER
============================== */
.site-header.overlay {position: absolute; top: 10px; left: 10px; right: 10px; z-index: 999; background: #25252780; border-radius: 10px;}
.header-inner {display: flex; align-items: center; justify-content: space-between; height: 70px;}
.logo img {height: 60px;}
.nav-menu > ul{display:flex; align-items:center; list-style:none; margin:0; padding:0;}
.nav-menu > ul > li{position:relative;}
.nav-menu > ul > li > a{display:flex; align-items:center; gap:8px; padding:18px 22px; color:#fff; font-weight:600; text-decoration:none;}
.nav-menu > ul > li:not(:last-child)::after{content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:18px; background:rgba(255,255,255,0.15);}
.nav-menu > ul > div.menu > ul > li.menu-item-has-children > a:after, .nav-menu > ul > li.menu-item-has-children > a:after {content: ' \f107'; font-family: 'FontAwesome'; line-height: 1;}
.nav-menu ul.sub-menu{position:absolute; top:100%; left:0; background:#1f2333; padding:0; margin:0; list-style:none; min-width:220px; display:none;}
.nav-menu li:hover > ul.sub-menu{display:block;}
.nav-menu ul.sub-menu > li{position:relative; border-bottom:1px solid rgba(255,255,255,0.06);}
.nav-menu ul.sub-menu > li:last-child{border-bottom:none;}
.nav-menu ul.sub-menu > li > a{display:flex; align-items:center; gap:8px; padding:14px 18px; color:#ddd; text-decoration:none;}
.nav-menu ul.sub-menu > li > a i{width:20px;}
.nav-menu ul.sub-menu > li:hover{background:rgba(255,255,255,0.08);}
.nav-menu ul.sub-menu > li.menu-item-has-children > a::after{content:' \f105'; font-family: 'FontAwesome'; line-height: 1; margin-left:auto; font-size:16px; opacity:0.7;}
.nav-menu ul.sub-menu ul.sub-menu{position:absolute; top:0; left:220px; background:#1f2333; min-width:220px; display:none;}
.nav-menu ul.sub-menu li:hover > ul.sub-menu{display:block;}
.nav-menu ul.sub-menu ul.sub-menu li{border-bottom:1px solid rgba(255,255,255,0.06);}
.nav-menu ul.sub-menu ul.sub-menu li a{padding:12px 18px; color:#ccc; display:block;}
.nav-menu ul.sub-menu ul.sub-menu li:hover{background:rgba(255,255,255,0.08);}
.header-right {display: flex; align-items: center; gap: 15px;}
.search-toggle {background-color: transparent; border: 1px solid #f63131; border-radius: 3px; color: #f63131; display: inline-block; padding: .5rem 1rem; text-align: center; transition: all .3s; font-size: 18px; cursor: pointer;}
.search-toggle:hover {background-color: #f63131; border: 1px solid #fff;}
.avrelax-user-area {position: relative; margin-right: 20px;}
.avrelax-header-btn {display: inline-block; background: #f63131; color: #fff; position: relative; overflow: hidden; z-index: 0; padding: 10px 20px; border-radius: 8px; text-decoration: none; font-size: 16px; font-weight: 600; border: none; cursor: pointer; text-align: center; transition: color 0.4s ease;}
.avrelax-header-btn::before {content: ""; position: absolute; inset: 0; width: 0; margin: auto; background-color: #ffffff; transition: width 0.4s ease; z-index: -1;}
.avrelax-header-btn:hover::before {width: 120%;}
.avrelax-header-btn:hover {color: #f63131; text-decoration: none;}
.btn-login {background: #e50914; padding: 6px 14px; border-radius: 4px; color: #fff; text-decoration: none;}
#avrelax-search-slide {position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 999999; background: radial-gradient(circle at top, #5a1f1f, #000); transform: translateY(-110%); transition: transform 0.6s ease-in-out !important; pointer-events: none; display: block; visibility: visible; isolation: isolate;}
#avrelax-search-slide.active {transform: translateY(0); pointer-events: auto;}
#avrelax-search-slide .avrelax-search-head {position: absolute; top: 24px; left: 24px; right: 24px; z-index: 10; display: flex; align-items: center; justify-content: space-between; pointer-events: auto;}
#avrelax-search-slide .avrelax-search-logo img {height: 90px; display: block;}
#avrelax-search-slide .avrelax-search-close {position: relative; width: 44px; height: 44px; border-radius: 50%; border: none; background: rgba(255, 255, 255, 0.2); cursor: pointer; padding: 0; outline: none;}
#avrelax-search-slide .avrelax-search-close::before, #avrelax-search-slide .avrelax-search-close::after {content: ""; position: absolute; top: 50%; left: 50%; width: 22px; height: 2px; background: #fff; border-radius: 2px; transform-origin: center;}
#avrelax-search-slide .avrelax-search-close::before {transform: translate(-50%, -50%) rotate(45deg);}
#avrelax-search-slide .avrelax-search-close::after {transform: translate(-50%, -50%) rotate(-45deg);}
#avrelax-search-slide .avrelax-search-body {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: center; pointer-events: auto;}
#avrelax-search-slide .avrelax-search-input {width: calc(100vw - 200px); padding: 22px 30px; font-size: 22px; border-radius: 50px; border: none; outline: none; box-sizing: border-box;}
.avr-search-form {display: flex; gap: 10px; align-items: center;}
.avr-search-type {padding: 6px 10px; border-radius: 6px; background: #111; color: #fff;}
.avr-search-input {padding: 8px 12px; border-radius: 6px; border: none; width: 250px;}
.avr-search-form button {padding: 8px 14px; background: #ff2c55; border: none; color: #fff; border-radius: 6px; cursor: pointer;}
/* ==============================
   FOOTER
============================== */
#site-footer{background:#0c0c0e; padding:40px; color:#ddd;}
.footer-container{max-width:600px;}
.footer-brand{display:flex; align-items:center; gap:50px;}
.footer-logo img{height:70px;}
.footer-social{display:flex; gap:10px;}
.social-item{width:36px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#2a102a; color:#fff; font-size:14px; transition:.2s;}
.social-item:hover{background:#ff2d55;}
.footer-menu{display:flex; flex-wrap:wrap; gap:20px;}
.footer-menu a{color:#ddd; font-size:14px; text-decoration:none;}
.footer-menu a:hover{color:#ff2d55;}
.footer-menu-list{display:flex; flex-wrap:wrap; gap:20px; list-style:none; padding:0; margin:10px 0;}
.footer-menu-list li a{color:#ddd; text-decoration:none; font-size:14px;}
.footer-menu-list li a:hover{color:#ff2d55;}
.footer-description{font-size:14px; color:#aaa; line-height:1.6; margin:10px 0;}
.footer-copyright{font-size:13px; color:#777;}
/* ==============================
   GRID MOVIE CARD
============================== */
.avrelax-movie-card {width: 100%;}
.avrelax-movie-card:hover .avrelax-movie-poster img{transform: scale(1.08);}
.avrelax-movie-card-link {display: block; text-decoration: none; color: #fff;}
.avrelax-movie-poster {position: relative; width: 100%; aspect-ratio: 2/3; overflow: hidden; border-radius: 10px; background: #000;}
.avrelax-movie-poster img {width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease !important; will-change: transform;}
.avrelax-movie-title {margin: 10px 0 0; font-size: 15px; font-weight: 600; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; color: #ffffff;}
.avrelax-movie-title a {color: inherit; text-decoration: none; display: block;}
.avrelax-grid {display: grid; gap: 10px;}
.avrelax-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
.avrelax-grid.cols-6 { grid-template-columns: repeat(6, 1fr); }
.avrelax-grid.cols-8 { grid-template-columns: repeat(8, 1fr); }
.avrelax-poster-card {display: flex; flex-direction: column; align-items: center; text-decoration: none; position: relative; overflow: hidden; border-radius: 12px;}
.avrelax-poster-card img {width: 100%; height: auto; display: block; aspect-ratio: 2/3; object-fit: cover; transform: matrix(1, 0, 0, 1, 0, 0); will-change: transform; transition-property: transform, -webkit-transform; transition-duration: 1.2s !important; transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);}
.avrelax-poster-card:hover img {transform: matrix(1.08, 0, 0, 1.08, 0, -4);}
.avrelax-poster-tag {position: relative; z-index: 2; margin-top: 8px; display: block; text-align: center; color: #ffffff; font-weight: 700; font-size: 16px;}