/* ========================================
   Movie Manager Pro - Main Stylesheet
   ======================================== */

:root {
	/* ensure WP admin bar sits atop theme elements */
  --wpadminbar-z: 200000;

	/* Colors */
	--color-primary: #FFB81C;
	--color-primary-dark: #E8A500;
	--color-primary-light: #FFC633;
	--color-bg-dark: #0F1419;
	--color-bg-dark-secondary: #1A1F28;
	--color-bg-dark-tertiary: #25292E;
	--color-text-primary: #E8E8E8;
	--color-text-secondary: #B0B0B0;
	--color-text-tertiary: #808080;
	--color-border: #404040;
	--color-success: #4CAF50;
	--color-error: #F44336;
	--color-warning: #FF9800;
	
	/* Spacing */
	--spacing-xxs: 2px; --spacing-xs: 4px; --spacing-sm: 8px; --spacing-md: 16px; --spacing-lg: 24px;
	--spacing-xl: 32px; --spacing-2xl: 48px; --spacing-3xl: 64px; --spacing-4xl: 80px;
	
	/* Typography - Fluid Scaling */
	--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--font-heading: 'Orbitron', 'Inter', sans-serif;
	--font-size-h1: clamp(24px, 1.5vw, 56px);
	--font-size-h2: clamp(20px, 1.2vw, 40px);
	--font-size-h3: clamp(18px, 0.9vw, 32px);
	--font-size-h4: clamp(16px, 0.8vw, 21px);
	--font-size-body: clamp(14px, 0.95vw, 16px);
	--font-size-small: clamp(12px, 0.85vw, 14px);
	--font-size-xs: clamp(11px, 0.75vw, 12px);
	--line-height-heading: 1.2; --line-height-body: 1.6;
	--font-weight-regular: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700;
	
	/* Unified Breakpoints - Mobile First */
	--breakpoint-xs: 320px;   /* Small phones */
	--breakpoint-sm: 480px;   /* Large phones */
	--breakpoint-md: 768px;   /* Tablets */
	--breakpoint-lg: 1024px;  /* Tablets landscape / small laptops */
	--breakpoint-xl: 1280px;  /* Desktop */
	--breakpoint-2xl: 1440px; /* Large desktop */
	--breakpoint-3xl: 1920px; /* Extra large desktop */
	--breakpoint-4xl: 2560px; /* Ultra-wide displays */
	
	/* Border Radius */
	--radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px; --radius-xl: 16px; --radius-2xl: 24px;
	
	/* Shadows */
	--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3); --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
	--shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5); --shadow-xl: 0 12px 32px rgba(0, 0, 0, 0.6);
	
	/* Transitions */
	--transition-fast: 150ms ease-in-out; --transition-normal: 300ms ease-in-out;
	--transition-slow: 500ms ease-in-out; --transition-hover: 200ms ease-in-out;
}

/* ========================================
   Reset & Base Styles
   ======================================== */

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

html { font-size: 16px; scroll-behavior: smooth; }

body {
	background-color: var(--color-bg-dark); color: var(--color-text-primary); font-family: var(--font-primary);
	font-size: var(--font-size-body); line-height: var(--line-height-body); font-weight: var(--font-weight-regular);
}

a { color: var(--color-primary); text-decoration: none; transition: color var(--transition-fast); }
a:hover { color: var(--color-primary-light); }

h1, h2, h3, h4, h5, h6 {
	font-weight: var(--font-weight-bold); line-height: var(--line-height-heading); margin-bottom: var(--spacing-md);
}

h1 { font-size: var(--font-size-h1); }
h2 { font-size: var(--font-size-h2); }
h3 { font-size: var(--font-size-h3); }
h4 { font-size: var(--font-size-h4); }

p { margin-bottom: var(--spacing-md); }
img { max-width: 100%; height: auto; display: block; }

/* ========================================
   Layout Components
   ======================================== */

.container {
	max-width: clamp(1200px, 95vw, 1280px);
	margin: 0 auto;
	padding: 0 clamp(12px, 3.5vw, 32px);
	width: 100%;
}
.page-container { display: flex; flex-direction: column; min-height: 100vh; }
.main-content { flex: 1; }

/* ========================================
   Header / Navigation & Search
   ======================================== */

.site-header {
	background-color: rgba(15,20,25,0.6); border-bottom: 1px solid rgba(255,255,255,0.04);
	position: sticky; top: 0; z-index: 100; backdrop-filter: blur(6px);
}

.site-header__inner {
	position: relative;
	display: flex; align-items: center; justify-content: flex-start;
	width: 100%; max-width: none;
	margin: 0; padding: calc(var(--spacing-md) - 4px) var(--spacing-lg); gap: var(--spacing-lg);
	padding-top: 10px; padding-bottom: 10px;
}

/* ========================================
   LOGO & TITLE - Professional Spanish Style
   ======================================== */

/* Primary navigation */
.site-navigation { display: flex; align-items: center; }
.main-navigation { display: flex; align-items: center; justify-content: flex-start; }

/* Make nav take available space and center its items on desktop */
@media (min-width: 768px) {
	.main-navigation { flex: 1 1 auto; justify-content: center; }
	.site-header__inner { align-items: center; }
}

/* Header search toggle and form */
.header-search-toggle {
	margin-left: auto;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	color: var(--color-text-primary);
}
.header-search-toggle svg { width: 20px; height: 20px; }

.header-search-container {
	display: none;
	position: absolute;
	top: calc(100% + 8px);
	right: var(--spacing-lg);
	left: auto;
	background: var(--color-bg-dark);
	padding: var(--spacing-sm) var(--spacing-md);
	z-index: 110;
	opacity: 0;
	transition: opacity 0.22s ease, transform 0.22s ease;
	min-width: 280px;
	max-width: 420px;
	border-radius: 8px;
	box-shadow: var(--shadow-md);
}
.site-header.search-open .header-search-container {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

/* hide submit button inside header variant */
.site-header .theme-search-form .search-submit { display: none; }

/* container-specific adjustments */
.header-search-container .theme-search-form { width: 100%; }
.header-search-container .theme-search-input { width: 100%; }

@media (max-width: 767px) {
	.header-search-container {
		left: 0;
		right: 0;
		top: 100%;
		padding: var(--spacing-sm) var(--spacing-lg);
		min-width: auto;
		max-width: none;
		border-radius: 0;
		box-shadow: none;
	}
}



.site-branding {
	flex-shrink: 0;
	margin-right: var(--spacing-lg);
	display: flex;
	align-items: center;
	gap: 14px;
	transition: all 0.3s ease;
}

.site-branding img {
	max-height: 50px;
	width: auto;
	display: block;
	transition: all 0.3s ease;
	filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.2));
}

.site-branding img:hover {
	transform: scale(1.08);
	filter: drop-shadow(0 4px 16px rgba(246, 201, 78, 0.3));
}

.site-title {
	margin: 0;
	font-size: clamp(16px, 3vw, 28px);
	font-weight: 900;
	letter-spacing: -0.5px;
	background: linear-gradient(135deg, #f6c94e 0%, #ffd93d 50%, #f5a928 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	background-size: 200% auto;
	transition: all 0.4s cubic-bezier(0.23, 1, 0.320, 1);
	position: relative;
	white-space: nowrap;
}

.site-title:hover {
	background-position: right center;
	filter: drop-shadow(0 4px 16px rgba(246, 201, 78, 0.4));
}

.site-title a {
	color: inherit;
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 10px;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background: linear-gradient(135deg, #f6c94e 0%, #ffd93d 50%, #f5a928 100%);
	background-clip: text;
	transition: all 0.3s ease;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.site-title a:hover {
	filter: drop-shadow(0 4px 16px rgba(246, 201, 78, 0.4));
	transform: translateY(-2px);
}

/* Decorative Elements */
.site-title::before {
	content: "";
	position: absolute;
	left: -14px;
	top: 50%;
	transform: translateY(-50%);
	width: 4px;
	height: 24px;
	background: linear-gradient(180deg, transparent 0%, #f6c94e 50%, transparent 100%);
	border-radius: 2px;
	opacity: 0.8;
}

.site-title::after {
	content: "";
	position: absolute;
	right: -12px;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 18px;
	background: linear-gradient(180deg, transparent 0%, #f5a928 100%);
	border-radius: 1.5px;
	opacity: 0.6;
}

/* ========================================
   RESPONSIVE - Logo & Title
   ======================================== */

@media (max-width: 1023px) {
	.site-branding {
		gap: 10px;
	}

	.site-branding img {
		max-height: 38px;
	}

	.site-title {
		font-size: clamp(12px, 3vw, 18px);
	}
}

@media (max-width: 767px) {
	.site-branding {
		gap: 8px;
		margin-right: auto;
	}

	.site-branding img {
		max-height: 36px;
	}

	.site-title {
		font-size: clamp(11px, 3.5vw, 15px);
	}

	.site-title::before,
	.site-title::after {
		display: none;
	}
}

@media (max-width: 479px) {
	.site-branding {
		gap: 6px;
	}

	.site-branding img {
		max-height: 28px;
	}

	.site-title {
		font-size: clamp(9px, 4vw, 12px);
		letter-spacing: 0;
		font-weight: 800;
	}

	.site-title a {
		gap: 4px;
	}
}



.menu { list-style: none; display: flex; gap: calc(var(--spacing-md)); align-items: center; }

.menu a {
	color: var(--color-text-primary);
	padding: 6px 12px;
	height: 36px;
	line-height: 36px;
	background-color: rgba(255,255,255,0.04);
	border-radius: 8px;
	transition: transform var(--transition-fast), box-shadow var(--transition-fast), background-color var(--transition-fast), color var(--transition-fast);
	font-weight: var(--font-weight-medium);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 1px solid rgba(255,255,255,0.04);
	box-shadow: 0 1px 0 rgba(0,0,0,0.12) inset;
	padding-top: 0; padding-bottom: 0;
}

.menu a:hover, .menu a:focus {
	background-color: rgba(246,201,78,0.08);
	color: var(--color-primary);
	transform: translateY(-2px);
	box-shadow: 0 6px 18px rgba(0,0,0,0.45);
}

/* Active/current menu item */
.menu .current-menu-item > a,
.menu .current_page_item > a {
	background: linear-gradient(90deg, var(--color-primary), var(--color-primary-dark));
	color: #0a0a0a;
	font-weight: var(--font-weight-bold);
	box-shadow: 0 6px 20px rgba(0,0,0,0.45);
	transform: translateY(-1px);
}

/* Extra menu button inserted on front page */
.menu-btn {
	color: var(--color-text-primary);
	background: rgba(255,255,255,0.04);
	padding: 6px 12px;
	height: 36px;
	line-height: 36px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border-radius: 8px;
	border: 1px solid rgba(255,255,255,0.04);
	text-decoration: none;
	margin-left: 12px;
	transition: all var(--transition-fast);
}
.menu-btn--nuevo {
	background: linear-gradient(90deg, rgba(246,201,78,0.12), rgba(246,201,78,0.08));
	color: var(--color-primary);
	font-weight: var(--font-weight-semibold);
}
.menu-btn:hover, .menu-btn:focus { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.45); }

/* Ensure the extra button participates in centering flow */
.site-navigation > .menu-btn { order: 2; }

/* Header search removed */

/* Theme Search Form & Input */
.theme-search-form {
	display: flex; gap: var(--spacing-sm); align-items: center; position: relative; max-width: clamp(480px, 75vw, 540px); box-sizing: border-box;
}

.theme-search-inner { display: flex; gap: var(--spacing-sm); align-items: center; width: 100%; box-sizing: border-box; flex-wrap: wrap; }

/* Header search styles removed */

.hero .theme-search-form {
	background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02)); padding: 12px;
	border-radius: 12px; border: 1px solid rgba(255,255,255,0.04); box-shadow: 0 10px 30px rgba(0,0,0,0.6);
	max-width: clamp(600px, 85vw, 720px); margin-top: var(--spacing-lg);
}

#theme-search-input,.theme-search-input,.theme-search-form input[type="search"] {
	background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.08);
	padding: 10px 14px; border-radius: 8px; color: var(--color-text-primary);
	min-width: 200px; transition: all .2s ease;
	flex: 1; height: 42px; box-sizing: border-box; outline: none; font-size: 14px; letter-spacing: 0.3px;
}

#theme-search-input:focus,.theme-search-input:focus,.theme-search-form input[type="search"]:focus {
	outline: none; border-color: #f6c94e; background: rgba(246,201,78,0.05);
	box-shadow: 0 0 0 3px rgba(246,201,78,0.1); transform: translateY(-1px);
}

#theme-search-input:hover,.theme-search-input:hover,.theme-search-form input[type="search"]:hover {
	border-color: rgba(246,201,78,0.5); background: rgba(255,255,255,0.03);
}

.theme-search-type {
	-webkit-appearance: none; -moz-appearance: none; appearance: none;
	background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.08);
	padding: 10px 28px 10px 12px; border-radius: 8px; color: var(--color-text-primary);
	font-size: 13px; cursor: pointer; transition: all .2s ease; height: 42px; box-sizing: border-box;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none'><path d='M7 10l5 5 5-5' stroke='%23f6c94e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	background-repeat: no-repeat; background-position: right 8px center; background-size: 14px;
}

.theme-search-type:focus { outline: none; border-color: #f6c94e; background-color: rgba(246,201,78,0.05); box-shadow: 0 0 0 3px rgba(246,201,78,0.1); }
.theme-search-type:hover { border-color: rgba(246,201,78,0.5); background-color: rgba(255,255,255,0.03); }

/* Dropdown options styling */
.theme-search-type option {
	background: var(--color-bg-dark);
	color: var(--color-text-primary);
	padding: 8px;
}

.theme-search-type option:checked {
	background: linear-gradient(#f6c94e, #f6c94e);
	background-color: #f6c94e;
	color: #000;
	font-weight: var(--font-weight-bold);
}

@media (max-width: 479px) { .theme-search-type { width: 100%; background-position: calc(100% - 12px) center; } }

.theme-search-results {
	position: absolute; top: calc(100% + 8px); left: 0; background: rgba(15,20,25,0.98);
	border: 1px solid var(--color-border); box-shadow: 0 12px 40px rgba(0,0,0,0.5); padding: var(--spacing-sm);
	width: 100%; max-width: clamp(450px, 80vw, 520px); display: none; z-index: 50; border-radius: 12px;
	max-height: 320px; overflow-y: auto; backdrop-filter: blur(6px);
	transition: opacity .12s ease, visibility .12s ease;
	scroll-behavior: smooth;
}

.theme-search-results.visible { display: block; opacity: 1; visibility: visible; }

.theme-search-results .search-item { 
	display: flex; gap: var(--spacing-sm); padding: var(--spacing-xs); align-items: center; 
	border-radius: var(--radius-sm); cursor: pointer; text-decoration: none; color: var(--color-text-primary);
	transition: background .12s ease, transform .12s ease;
}

.theme-search-results .search-item:hover,.theme-search-results .search-item.focused { 
	background: rgba(246,201,78,0.08);
	transform: translateX(4px);
}

.search-item .thumb { width: 56px; height: 84px; border-radius: 8px; overflow: hidden; }
.search-item .meta .title { font-weight: var(--font-weight-semibold); }
.search-item .meta .sub { color: var(--color-text-secondary); font-size: var(--font-size-small); }

.theme-search-controls { display: flex; gap: 8px; align-items: center; justify-content: flex-end; }
.theme-search-controls .theme-search-type { min-width: 140px; }

/* Search submit button - Modern bordered style */
.theme-search-controls .search-submit { 
	flex: 0 0 auto; 
	background: transparent;
	color: var(--color-primary);
	border: 2px solid var(--color-primary);
	padding: calc(var(--spacing-sm) - 4px) var(--spacing-lg);
	height: 44px;
	border-radius: 10px;
	font-weight: var(--font-weight-bold);
	cursor: pointer;
	transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);
	font-size: var(--font-size-body);
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.theme-search-controls .search-submit:hover {
	background: var(--color-primary);
	color: var(--color-bg-dark);
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(246,201,78,0.25);
}

.theme-search-controls .search-submit:active {
	transform: translateY(0);
	box-shadow: 0 2px 6px rgba(246,201,78,0.15);
}

.theme-search-controls .search-submit:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(246,201,78,0.2);
}

/* Search button icon and text */
.search-submit svg {
	width: 18px;
	height: 18px;
	display: inline-flex;
	transition: transform .2s ease;
}

.search-submit:hover svg {
	transform: rotate(15deg);
}

.search-submit span {
	display: inline-flex;
	align-items: center;
	margin-left: var(--spacing-xs);
}

.theme-search-form .search-submit,.theme-search-form .btn--search,.theme-search-form .btn {
	border-radius: var(--radius-lg); 
	padding: 10px 18px; 
	height: 44px; 
	border: 1px solid rgba(246, 201, 78, 0.3);
	background: linear-gradient(135deg, rgba(246, 201, 78, 0.1), rgba(246, 201, 78, 0.04));
	color: #f6c94e;
	font-weight: var(--font-weight-semibold); 
	cursor: pointer;
	display: inline-flex; 
	align-items: center; 
	justify-content: center;
	transition: all 0.3s ease;
	text-transform: uppercase; 
	letter-spacing: 0.5px;
	box-shadow: 0 2px 8px rgba(246, 201, 78, 0.1);
}

.theme-search-form .search-submit:hover,.theme-search-form .btn--search:hover,.theme-search-form .btn:hover {
	background: linear-gradient(135deg, rgba(246, 201, 78, 0.16), rgba(246, 201, 78, 0.08));
	border-color: rgba(246, 201, 78, 0.5);
	color: #f6c94e;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(246, 201, 78, 0.15);
}

/* Removed header-specific primary button sizing */

@media (max-width: 767px) {
	.theme-search-form { max-width: 100%; }
	.theme-search-inner { flex-wrap: wrap; width: 100%; }
	.theme-search-form .theme-search-input { flex: 1 1 100%; min-width: 0; }
	.hero .theme-search-form { flex-direction: column; align-items: stretch; gap: 8px; max-width: 100%; padding: 10px; border-radius: 12px; }
	.hero .theme-search-form .theme-search-input { width: 100%; min-width: 0; height: 44px; }
	.hero .theme-search-controls { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
	.hero .theme-search-controls .theme-search-type { flex: 1 1 auto; min-width: 100px; }
	.hero .theme-search-controls .search-submit { flex: 0 0 auto; padding: 8px 16px; }
}

@media (max-width: 479px) {
	.theme-search-form { width: 100%; }
	.theme-search-inner { display: flex; flex-direction: column; gap: 6px; width: 100%; }
	.theme-search-form .theme-search-input { width: 100%; height: 36px; padding: 8px 10px; box-sizing: border-box; }
	.theme-search-controls { display: flex; gap: 6px; flex-direction: row; align-items: center; width: 100%; }
	.theme-search-type { width: auto; min-width: 60px; max-width: 120px; height: 36px; padding: 6px 20px 6px 6px; font-size: 10px; background-position: calc(100% - 4px) center; background-size: 10px; }
	.theme-search-form .search-submit,.theme-search-form .btn { flex: 1; height: 36px; font-size: 11px; border-radius: 6px; padding: 6px 8px; }
	.search-submit span { display: inline-flex; }
	.search-submit svg { width: 14px; height: 14px; margin-right: 2px; }
}

/* ========================================
   Buttons
   ======================================== */

.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: var(--spacing-sm);
	padding: var(--spacing-md) var(--spacing-lg); border: none; border-radius: var(--radius-md);
	font-size: var(--font-size-body); font-weight: var(--font-weight-semibold); cursor: pointer;
	transition: all var(--transition-fast); text-decoration: none; font-family: var(--font-primary);
}

.btn--primary { background: transparent; color: var(--color-primary); font-weight: var(--font-weight-bold); box-shadow: none; border: none; }
.btn--primary:hover { background: transparent; color: var(--color-primary-light); box-shadow: none; transform: translateY(-2px); }

.btn--secondary { background-color: var(--color-bg-dark-secondary); color: var(--color-text-primary); border: 1px solid var(--color-border); }
.btn--secondary:hover { background-color: var(--color-bg-dark-tertiary); border-color: var(--color-primary); }

.btn--text { background: none; color: var(--color-primary); padding: 0; }
.btn--text:hover { color: var(--color-primary-light); text-decoration: underline; }

.btn--small { padding: var(--spacing-sm) var(--spacing-md); font-size: var(--font-size-small); }

.btn--search.btn--primary { 
	background: linear-gradient(135deg, rgba(246, 201, 78, 0.1), rgba(246, 201, 78, 0.04));
	color: #f6c94e; 
	border: 1px solid rgba(246, 201, 78, 0.3);
	border-radius: var(--radius-lg); 
	padding: var(--spacing-xs) var(--spacing-sm); 
	display: inline-flex; 
	align-items: center; 
	justify-content: center;
	box-shadow: 0 2px 8px rgba(246, 201, 78, 0.1);
	transition: all 0.3s ease;
}

.btn--search.btn--primary:hover {
	background: linear-gradient(135deg, rgba(246, 201, 78, 0.16), rgba(246, 201, 78, 0.08));
	border-color: rgba(246, 201, 78, 0.5);
	box-shadow: 0 4px 12px rgba(246, 201, 78, 0.15);
	transform: translateY(-1px);
}

/* ========================================
   Hero Section
   ======================================== */

.hero {
	position: relative; 
	background-size: cover; 
	background-position: center;
	background-color: var(--color-bg-dark-secondary); 
	background-repeat: no-repeat;
	background-attachment: scroll;
	padding: var(--spacing-3xl) var(--spacing-lg);
	min-height: 500px; 
	display: flex; 
	align-items: flex-end; 
	overflow: hidden; 
	margin-bottom: var(--spacing-2xl);
}

.hero--home {
	min-height: 400px; 
	padding: var(--spacing-2xl) var(--spacing-lg);
	align-items: center; 
	background-position: center center; 
	margin-bottom: var(--spacing-2xl);
	color: #fff; 
	background-attachment: fixed;
}
.hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.55) 55%, rgba(0,0,0,0.72) 100%); pointer-events: none; }
.hero--home::before { background: linear-gradient(135deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.55) 50%, rgba(25,25,40,0.85) 100%); }
.hero__gradient { position: absolute; inset: 0; background: radial-gradient(circle at 50% 0%, transparent 0%, rgba(0, 0, 0, 0.5) 100%); pointer-events: none; }

.hero__content {
	position: relative; z-index: 2; max-width: clamp(1200px, 95vw, 1280px); margin: 0 auto; width: 100%;
	display: flex; gap: var(--spacing-2xl); align-items: flex-end;
}

.hero__inner { display: flex; gap: var(--spacing-lg); align-items: center; justify-content: space-between; }

.hero__title { font-size: var(--font-size-h1); color: var(--color-text-primary); word-wrap: break-word; }
.hero__subtitle { font-size: var(--font-size-h4); color: var(--color-text-secondary); margin-bottom: var(--spacing-lg); word-wrap: break-word; }

.hero--home .hero__content { flex-direction: row; flex-wrap: wrap; align-items: center; text-align: center; justify-content: center; gap: var(--spacing-md); }
.hero--home .hero__inner { flex-direction: column; align-items: center; text-align: center; min-width: auto; flex-wrap: wrap; flex-basis: 100%; }
.hero--home .hero__search { flex-shrink: 0; margin-top: 0; margin-left: 0; flex-basis: 100%; }
.hero--single .hero__content { flex-direction: row; align-items: flex-end; }
.hero--archive { padding: 0; min-height: 200px; }
.hero--archive .hero__content { padding: var(--spacing-lg) 0; min-height: auto; }
.hero--archive .hero__title { font-size: var(--font-size-h2); }
.hero--archive .hero__subtitle { font-size: var(--font-size-h4); margin-bottom: var(--spacing-md); }

.hero__text { flex: 1 1 auto; min-width: 0; word-wrap: break-word; }
.hero--home .hero__text { max-width: none; flex: 1 1 auto; text-align: center; }
.hero__poster { flex-shrink: 0; width: clamp(150px, 25vw, 200px); height: auto; aspect-ratio: 2/3; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.hero__poster img { width: 100%; height: 100%; object-fit: cover; }
.hero__info { flex: 1; color: var(--color-text-primary); }

.hero__search { display: flex; gap: var(--spacing-sm); width: 100%; max-width: clamp(400px, 80vw, 500px); margin-top: var(--spacing-lg); }
.hero--home .hero__search { width: 100%; margin: 0; }
.hero--home .theme-search-form { width: 100%; max-width: 100%; margin: 0; display: flex; flex-wrap: wrap; }

.hero__search-input,.theme-search-input {
	flex: 1; height: 32px; padding: 0 var(--spacing-md); box-sizing: border-box;
	background-color: rgba(255, 255, 255, 0.1); border: 1px solid var(--color-border);
	border-radius: var(--radius-md); color: var(--color-text-primary); font-size: var(--font-size-body);
}

.hero__search-input::placeholder { color: var(--color-text-tertiary); }

/* keep WP admin bar on top */
#wpadminbar { z-index: var(--wpadminbar-z, 200000) !important; }

.hero__search .btn,.theme-search-form .btn,.hero__search-row .btn { height: 32px; padding: 0 var(--spacing-lg); display: inline-flex; align-items: center; justify-content: center; }

.hero__search-row { display: flex; gap: var(--spacing-sm); flex-wrap: wrap; align-items: center; }
.hero__filters { display: flex; gap: var(--spacing-sm); margin-top: var(--spacing-sm); flex-wrap: wrap; }
.hero__search-row .hero__filters { margin-top: 0; }

.hero__meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--spacing-md); margin: var(--spacing-lg) 0; }

.meta-card { background: rgba(0, 0, 0, 0.4); border: 1px solid rgba(255, 255, 255, 0.15); border-radius: var(--radius-md); padding: var(--spacing-sm); display: flex; flex-direction: column; gap: 4px; transition: all 0.3s ease; }
.meta-card:hover { background: rgba(0, 0, 0, 0.5); border-color: rgba(255, 255, 255, 0.25); transform: translateY(-2px); }

.meta-label { font-size: var(--font-size-small); color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-semibold); }
.meta-value { font-size: var(--font-size-body); color: var(--color-text-primary); font-weight: var(--font-weight-medium); word-wrap: break-word; overflow-wrap: break-word; }
.meta-value a { color: var(--color-primary); text-decoration: none; transition: color 0.2s ease; }
.meta-value a:hover { color: var(--color-primary-light); text-decoration: underline; }

.hero__rating { display: flex; align-items: center; gap: var(--spacing-md); margin-top: var(--spacing-md); }

.rating-badge { background: rgba(255, 184, 28, 0.1); border: 1px solid var(--color-primary); border-radius: var(--radius-md); padding: var(--spacing-sm) var(--spacing-md); display: flex; align-items: baseline; gap: var(--spacing-xs); }
.rating-value { font-size: 18px; font-weight: var(--font-weight-bold); color: var(--color-primary); }
.rating-max { font-size: var(--font-size-small); color: var(--color-text-secondary); }

/* ========================================
   Movie Cards & Search Cards
   ======================================== */

.movie-card {
	display: flex; flex-direction: column; align-items: stretch;
	background-color: var(--color-bg-dark-secondary); border-radius: var(--radius-lg);
	overflow: hidden; transition: transform var(--transition-normal), box-shadow var(--transition-normal); cursor: pointer;
}

.movie-card__poster { position: relative; width: 100%; aspect-ratio: 2/3; overflow: hidden; background: var(--color-bg-dark-tertiary); }
.movie-card__image { width: 100%; height: 100%; object-fit: cover; display: block; }

.movie-card__overlay {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	background: linear-gradient(180deg, rgba(0,0,0,0.0), rgba(0,0,0,0.45)); opacity: 0;
	transition: opacity var(--transition-fast); pointer-events: none;
}

.movie-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.movie-card:hover .movie-card__overlay { opacity: 1; }

.movie-card__overlay::before {
	content: ''; width: 64px; height: 64px; display: block;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><circle cx='32' cy='32' r='32' fill='%23000000' fill-opacity='0.45'/><path d='M26 20 L46 32 L26 44 z' fill='%23FFFFFF'/></svg>");
	background-size: 64px 64px; background-repeat: no-repeat; background-position: center;
	filter: drop-shadow(0 4px 10px rgba(0,0,0,0.5));
}

.movie-card__content { padding: 12px 10px; display: flex; flex-direction: column; gap: 6px; flex: 1 1 auto; }
.movie-card__title { font-size: 14px; line-height: 1.2; margin: 0 0 4px 0; color: var(--color-text-primary); font-weight: var(--font-weight-bold); }
.movie-card__meta { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--color-text-secondary); flex-wrap: nowrap; margin-top: auto; }
.movie-card__rating { color: var(--color-primary); font-weight: var(--font-weight-bold); display: flex; align-items: center; gap: 3px; font-size: 12px; }
.movie-card__rating::before { content: '★ '; color: var(--color-primary); font-size: 12px; }
.movie-card__year { color: var(--color-primary); font-weight: var(--font-weight-medium); font-size: 12px; }
.movie-card__type { color: var(--color-text-tertiary); font-weight: var(--font-weight-medium); background: rgba(255,255,255,0.04); border-radius: var(--radius-sm); padding: 2px 8px; font-size: 11px; }
.movie-card__year::after { content: attr(data-year-short); display: inline-block; color: var(--color-primary); font-weight: var(--font-weight-medium); }
.movie-card .btn--primary { display: none !important; }

.search-card {
	background: rgba(255,255,255,0.02); border-radius: var(--radius-md); overflow: hidden;
	border: 1px solid rgba(255,255,255,0.03); display: flex; flex-direction: column; align-items: stretch;
	box-shadow: var(--shadow-sm); min-width: 180px; max-width: 240px; margin: 0 auto; transition: all var(--transition-normal);
}

.search-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg); }

.search-card__link { display: flex; flex-direction: column; align-items: stretch; gap: 0; height: 100%; padding: var(--spacing-md); text-align: center; }
.search-card__thumb { width: 100%; display: flex; justify-content: center; align-items: center; margin-bottom: var(--spacing-md); }
.search-card__thumb img { width: 100%; max-width: clamp(120px, 20vw, 160px); height: auto; aspect-ratio: 9/13; object-fit: cover; border-radius: var(--radius-sm); margin: 0 auto; box-shadow: var(--shadow-sm); }
.search-card__meta { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: var(--spacing-sm); margin-bottom: var(--spacing-sm); font-size: var(--font-size-small); }
.search-card__rating { color: var(--color-primary); font-weight: var(--font-weight-bold); display: flex; align-items: center; gap: 2px; }
.search-card__year { position: relative; color: var(--color-primary); font-weight: var(--font-weight-medium); }
.search-card__year::after { content: attr(data-year-short); display: inline-block; color: var(--color-primary); font-weight: var(--font-weight-medium); }
.search-card__type { color: var(--color-text-tertiary); font-weight: var(--font-weight-medium); background: rgba(255,255,255,0.04); border-radius: var(--radius-sm); padding: 2px 8px; }
.search-card__title-wrap { margin-top: auto; padding-top: var(--spacing-sm); border-top: 1px solid rgba(255,255,255,0.04); }
.search-card__title { font-size: 14px; margin: 0; color: var(--color-text-primary); font-weight: var(--font-weight-bold); line-height: 1.2; word-break: break-word; }

@media (max-width: 479px) { .search-card { min-width: 140px; max-width: 100%; } .search-card__thumb img { max-width: 100%; height: 160px; } }

/* ========================================
   Grids
   ======================================== */

.movies-grid,.tv-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--spacing-lg); margin: var(--spacing-2xl) 0; width: 100%; }
.actors-grid,.directors-grid,.persons-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: calc(var(--spacing-md)); margin: var(--spacing-2xl) 0; width: 100%; }
.grid--latest { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--spacing-lg); margin: var(--spacing-2xl) 0; width: 100%; }
.grid--latest .movie-card { width: 100%; }

.person-card { display: flex; flex-direction: column; align-items: stretch; background-color: rgba(255,255,255,0.02); border-radius: 12px; overflow: hidden; transition: transform var(--transition-fast), box-shadow var(--transition-fast); border: 1px solid rgba(255,255,255,0.03); }
.person-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,0,0,0.55); }
.person-card__link { color: inherit; text-decoration: none; display: block; height: 100%; }
.person-card__media { width: 100%; aspect-ratio: 1/1; background-color: var(--color-bg-dark-tertiary); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.person-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.person-card__placeholder { width: 70%; height: 70%; background: linear-gradient(135deg, rgba(255,255,255,0.02), rgba(0,0,0,0.12)); border-radius: 10px; }
.person-card__body { padding: 8px 10px; display: flex; flex-direction: column; gap: 6px; }
.person-card__name { font-size: 14px; margin: 0; font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: 1.3; }
.person-card__excerpt { color: var(--color-text-secondary); font-size: 12px; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Genre grid styling - responsive */
.genres-grid,
.genres-list {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(8px, 1.5vw, 16px);
	max-width: clamp(300px, 90vw, 600px);
	margin: clamp(16px, 3vw, 24px) auto;
	padding: 0 clamp(8px, 2vw, 16px);
}

.genre-card,
.genre-badge {
	display: inline-block;
	padding: clamp(6px, 1vw, 12px) clamp(12px, 2vw, 16px);
	background: linear-gradient(135deg, rgba(255, 184, 28, 0.1) 0%, rgba(255, 184, 28, 0.05) 100%);
	border: 1px solid rgba(255, 184, 28, 0.3);
	border-radius: 20px;
	color: var(--color-primary);
	font-size: clamp(12px, 0.9vw, 14px);
	text-decoration: none;
	transition: all var(--transition-normal);
}

.genre-card:hover,
.genre-badge:hover {
	background: linear-gradient(135deg, rgba(255, 184, 28, 0.2) 0%, rgba(255, 184, 28, 0.1) 100%);
	border-color: rgba(255, 184, 28, 0.6);
}

/* Hero person photo styling (single actor/director pages) */
.hero__photo { display: flex; align-items: center; justify-content: center; padding: clamp(8px, 2vw, 16px); }
.hero__photo img { width: clamp(140px, 25vw, 160px); height: clamp(140px, 25vw, 160px); aspect-ratio: 1/1; object-fit: cover; border-radius: 50%; display: block; }
.hero__photo .person-card__placeholder { width: clamp(140px, 25vw, 160px); height: clamp(140px, 25vw, 160px); aspect-ratio: 1/1; border-radius: 50%; background: linear-gradient(135deg, rgba(255,255,255,0.02), rgba(0,0,0,0.12)); }

@media (min-width: 1200px) {
	.actors-grid,.directors-grid,.persons-grid { grid-template-columns: repeat(6, 1fr); gap: var(--spacing-md); }
}

@media (min-width: 768px) and (max-width: 1023px) {
	.movies-grid,.tv-grid,.grid--latest { grid-template-columns: repeat(4, 1fr); gap: var(--spacing-lg); }
	.actors-grid,.directors-grid,.persons-grid { grid-template-columns: repeat(4, 1fr); gap: var(--spacing-md); }
	.person-card__body { padding: 8px 10px; }
	.person-card__name { font-size: 13px; }
	.person-card__excerpt { font-size: 11px; -webkit-line-clamp: 2; line-clamp: 2; }
}

@media (max-width: 767px) {
	.movies-grid,.tv-grid,.grid--latest { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-sm); }
	.actors-grid,.directors-grid,.persons-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-sm); margin: var(--spacing-xl) 0; }
	.person-card__body { padding: 8px 8px; }
	.person-card__name { font-size: 13px; }
	.person-card__excerpt { font-size: 11px; -webkit-line-clamp: 2; line-clamp: 2; }
}

	@media (max-width: 479px) {
	.person-card__body { padding: 8px 6px; gap: 4px; }
	.person-card__name { font-size: 12px; }
	.person-card__excerpt { font-size: 10px; -webkit-line-clamp: 2; line-clamp: 2; }
}

@media (max-width: 479px) {
	.actors-grid,.directors-grid,.persons-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; margin: var(--spacing-lg) 0; }
	.person-card__body { padding: 6px 5px; gap: 3px; }
	.person-card__name { font-size: 11px; line-height: 1.2; }
	.person-card__excerpt { font-size: 9px; -webkit-line-clamp: 2; line-clamp: 2; }
	.person-card:hover { transform: translateY(-4px); }
}

@media (max-width: 319px) {
	.person-card__body { padding: 5px 4px; gap: 2px; }
	.person-card__name { font-size: 10px; line-height: 1.2; }
	.person-card__excerpt { display: none; }
}

	/* Additional very small phone adjustments */
	@media (max-width: 319px) {
		.actors-grid,.directors-grid,.persons-grid { gap: 4px; }
	}

.cast-grid,
.directors-list {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: var(--spacing-md);
	margin: var(--spacing-lg) 0;
	align-items: start;
}

.cast-grid .people-visible,
.directors-list .people-visible {
	display: contents;
}

.cast-member,
.director-item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--spacing-xs);
	padding: var(--spacing-sm);
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--radius-lg);
	transition: all var(--transition-normal);
}

.cast-member:hover,
.director-item:hover {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.15);
	transform: translateY(-2px);
}

.cast-member h4,
.director-item h4 {
	margin: 0;
	font-size: clamp(13px, 0.95vw, 15px);
	font-weight: var(--font-weight-semibold);
	color: var(--color-text-primary);
	word-break: break-word;
	line-height: 1.3;
}

.cast-grid .people-hidden,.directors-list .people-hidden { display: none; }
.cast-grid .people-hidden.show,.directors-list .people-hidden.show { display: contents; }
.cast-grid .people-show-more-wrapper,.cast-grid .people-show-less-wrapper,.directors-list .people-show-more-wrapper,.directors-list .people-show-less-wrapper { grid-column: 1 / -1; display: flex; justify-content: center; margin: var(--spacing-md) 0; padding: var(--spacing-sm) 0; }
.cast-grid .people-show-more-wrapper.hide,.directors-list .people-show-more-wrapper.hide { display: none; }
.cast-grid .people-show-less-wrapper:not(.show),.directors-list .people-show-less-wrapper:not(.show) { display: none; }

.carousel { display: flex; align-items: center; gap: var(--spacing-sm); margin-top: var(--spacing-sm); }
.carousel-track { display: flex; gap: var(--spacing-sm); overflow-x: auto; scroll-behavior: smooth; padding: var(--spacing-sm) 0; scroll-snap-type: x proximity; }
.carousel-track .movie-card { flex: 0 0 180px; scroll-snap-align: start; }
.carousel.mini .movie-card { flex: 0 0 135px; }

@media (min-width: 1200px) { .carousel-track .movie-card { flex: 0 0 220px; } .carousel.mini .movie-card { flex: 0 0 155px; } }
@media (max-width: 380px) {
	.carousel-track .movie-card { flex: 0 0 140px; } .carousel.mini .movie-card { flex: 0 0 105px; }
	.carousel.mini .carousel-track { max-width: calc(105px * 3 + var(--spacing-sm) * 2); overflow-x: auto; scroll-snap-type: x mandatory; }
	.carousel.mini .movie-card { scroll-snap-align: start; }
}

/* Modern styles for AJAX "Mehr laden" button */
.mmp-load-more-wrap { display: flex; justify-content: center; margin: var(--spacing-lg) 0; }
.mmp-load-more {
	appearance: none; -webkit-appearance: none; -moz-appearance: none;
	background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
	color: var(--color-bg-dark);
	border: none; border-radius: var(--radius-2xl);
	padding: 12px 28px; font-size: 16px; font-weight: var(--font-weight-semibold);
	box-shadow: 0 8px 20px rgba(0,0,0,0.45), 0 2px 6px rgba(246,201,78,0.18) inset;
	cursor: pointer; transition: transform var(--transition-fast), box-shadow var(--transition-fast), opacity .18s ease;
	display: inline-flex; align-items: center; gap: 12px; justify-content: center;
	text-transform: uppercase; letter-spacing: 0.6px;
}
.mmp-load-more::after {
	content: '\2193'; /* down arrow */
	display: inline-block; transform: translateY(0); transition: transform var(--transition-fast) .05s;
	font-size: 14px; opacity: 0.95;
}
.mmp-load-more:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(0,0,0,0.55); }
.mmp-load-more:active { transform: translateY(-1px); }
.mmp-load-more:disabled { opacity: 0.6; cursor: wait; transform: none; }
.mmp-load-more.small { padding: 8px 18px; font-size: 14px; }

@media (max-width: 479px) {
	.mmp-load-more { width: 100%; padding: 14px 18px; font-size: 15px; border-radius: 12px; }
}

.carousel-prev,.carousel-next { background: var(--color-bg-dark-tertiary); border: none; color: var(--color-text-primary); padding: 8px 10px; border-radius: 6px; cursor: pointer; }

/* ========================================
   Sections
   ======================================== */

.section {
	padding: var(--spacing-3xl) var(--spacing-lg); margin-bottom: var(--spacing-2xl); position: relative;
	background: linear-gradient(135deg, rgba(20,20,30,0.6) 0%, rgba(25,25,40,0.8) 100%);
	border: 1px solid rgba(255,182,28,0.08); border-radius: 12px;
	backdrop-filter: blur(10px); box-shadow: 0 8px 32px rgba(0,0,0,0.3);
	transition: all var(--transition-normal);
}

.section:hover {
	background: linear-gradient(135deg, rgba(25,25,35,0.7) 0%, rgba(30,30,45,0.9) 100%);
	border-color: rgba(255,182,28,0.15); box-shadow: 0 12px 48px rgba(255,182,28,0.1);
	transform: translateY(-2px);
}

.section::before {
	content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(255,182,28,0.2), transparent);
	opacity: 1; border-radius: 12px 12px 0 0;
}

.section::after {
	content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(255,182,28,0.1), transparent);
	opacity: 0; transition: opacity var(--transition-normal); border-radius: 0 0 12px 12px;
}

.section:hover::after { opacity: 1; }
.section:last-child { margin-bottom: 0; }
.section > .container { padding: 0; }

.section__header {
	display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--spacing-xl);
	flex-wrap: wrap; gap: var(--spacing-md); position: relative; padding-bottom: var(--spacing-md);
	border-bottom: 1px solid rgba(255,182,28,0.05); transition: border-color var(--transition-fast);
}

.section__header--grid {
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}

.section__header:hover { border-bottom-color: rgba(255,182,28,0.1); }

.section__title {
	font-size: var(--font-size-h2); margin: 0; font-weight: 700; letter-spacing: -0.5px;
	transition: all var(--transition-fast); background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
	-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

.section__title:hover { letter-spacing: 0px; }

.section--related-tv,.section--related-movies,.section--search-results,.section--multi {
	padding: var(--spacing-3xl) var(--spacing-lg); margin-bottom: var(--spacing-2xl);
	background: linear-gradient(135deg, rgba(20,20,30,0.5) 0%, rgba(25,25,40,0.7) 100%);
	border: 1px solid rgba(255,182,28,0.08); border-radius: 12px;
	backdrop-filter: blur(10px); box-shadow: 0 8px 32px rgba(0,0,0,0.3);
	border-top: none; transition: all var(--transition-normal);
}

.section--related-tv:hover,.section--related-movies:hover,.section--search-results:hover,.section--multi:hover {
	background: linear-gradient(135deg, rgba(25,25,35,0.6) 0%, rgba(30,30,45,0.8) 100%);
	border-color: rgba(255,182,28,0.15); box-shadow: 0 12px 48px rgba(255,182,28,0.1);
	transform: translateY(-2px);
}

.section--home {
	padding: var(--spacing-3xl) var(--spacing-lg); margin-bottom: var(--spacing-2xl);
	background: linear-gradient(135deg, rgba(20,20,30,0.5) 0%, rgba(25,25,40,0.7) 100%);
	border: 1px solid rgba(255,182,28,0.08); border-radius: 12px;
	backdrop-filter: blur(10px); box-shadow: 0 8px 32px rgba(0,0,0,0.3);
	transition: all var(--transition-normal);
}

.section--home:hover {
	background: linear-gradient(135deg, rgba(25,25,35,0.6) 0%, rgba(30,30,45,0.8) 100%);
	border-color: rgba(255,182,28,0.15); box-shadow: 0 12px 48px rgba(255,182,28,0.1);
	transform: translateY(-2px);
}

.section--related-tv .movies-grid,.section--related-movies .movies-grid {
	display: grid; grid-template-columns: repeat(6, 1fr);
	gap: var(--spacing-lg); margin: var(--spacing-2xl) 0; width: 100%;
}

.section--related-tv .movies-grid .movie-card,.section--related-movies .movies-grid .movie-card { transition: all var(--transition-normal); }
.section--related-tv .movies-grid .movie-card:hover,.section--related-movies .movies-grid .movie-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg); }

.section--seo-keywords { padding: var(--spacing-md) var(--spacing-lg); }
.section--seo-keywords .seo-keywords { color: rgba(255,255,255,0.65); font-size: 13px; line-height: 1.4; margin: 0; word-break: keep-all; }

/* ========================================
   Details Grid (Movie/TV Information)
   ======================================== */

.details-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: var(--spacing-lg); margin-top: var(--spacing-lg); }

.detail-item { background-color: var(--color-bg-dark-secondary); border: 1px solid var(--color-border); border-radius: 8px; padding: var(--spacing-lg); display: flex; flex-direction: column; transition: all 0.3s ease; }
.detail-item:hover { border-color: var(--color-primary); background-color: var(--color-bg-dark-tertiary); transform: translateY(-2px); }

.detail-label { font-size: var(--font-size-small); color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: var(--spacing-sm); font-weight: var(--font-weight-semibold); }
.detail-value { font-size: var(--font-size-body); color: var(--color-text-primary); font-weight: var(--font-weight-medium); word-break: break-word; }
.detail-value a { color: var(--color-primary); text-decoration: none; transition: color 0.2s ease; }
.detail-value a:hover { color: var(--color-primary-light); text-decoration: underline; }

/* ========================================
   Archive Layout
   ======================================== */

.archive-layout { display: grid; grid-template-columns: 1fr; gap: var(--spacing-2xl); margin: var(--spacing-2xl) 0; width: 100%; }
.archive-layout--fullwidth { grid-template-columns: 1fr; }

.filter-group { margin-bottom: var(--spacing-lg); }
.filter-group:last-child { margin-bottom: 0; }
.filter-group h3 { font-size: var(--font-size-h4); margin-bottom: var(--spacing-md); }
.filter-options label { display: flex; gap: var(--spacing-sm); margin-bottom: var(--spacing-sm); cursor: pointer; }

.filter-select,.filter-input,.filter-type-select { padding: 8px 10px; border-radius: 6px; border: 1px solid var(--color-border); background: var(--color-bg-dark-secondary); color: var(--color-text-primary); height: 40px; min-width: 120px; box-sizing: border-box; }
.filter-select:focus,.filter-input:focus,.filter-type-select:focus { outline: none; border-color: var(--color-primary); }

.hero__filters .filter-select,.hero__filters .filter-input,.hero__filters .filter-type-select { color: var(--color-text-primary); }
.hero__filters .filter-select:focus:not([value=""]),.hero__filters .filter-select:active:not([value=""]),.hero__filters .filter-select option:checked,.hero__filters .filter-input:focus:not([value=""]),.hero__filters .filter-type-select:focus:not([value=""]) { color: #111; }

@media (max-width: 479px) {
	.hero__search-row { flex-wrap: wrap; } .hero__filters { flex-wrap: wrap; }
	.filter-type-select { order: 2; margin-left: auto; margin-right: var(--spacing-sm); min-width: 120px; }
	.hero__search-row .btn { order: 3; }
}

.archive-sorting { display: flex; gap: var(--spacing-md); align-items: center; margin-bottom: var(--spacing-md); }
.archive-sorting__label { color: var(--color-text-secondary); font-size: var(--font-size-small); }
.archive-sorting__link { color: var(--color-text-primary); text-decoration: none; padding: 6px; border-radius: 6px; }
.archive-sorting__link:hover { background: var(--color-bg-dark-tertiary); }

/* ========================================
   Pagination
   ======================================== */

.pagination {
	--pagination-gap: var(--spacing-md, 16px); --pagination-padding: var(--spacing-md);
	--pagination-border: 1px solid var(--color-border, #e0e0e0); --pagination-radius: var(--radius-md, 6px);
	--pagination-bg: var(--color-bg-dark-secondary, #2a2a2a); --pagination-color: var(--color-text-primary, #ffffff);
	--pagination-hover-bg: var(--color-primary, #007bff); --pagination-hover-color: var(--color-text-inverted, #ffffff);
	--pagination-active-bg: var(--color-primary, #007bff); --pagination-active-color: var(--color-text-inverted, #ffffff);
	--pagination-disabled-opacity: 0.6; --pagination-disabled-cursor: not-allowed;
	display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;
	gap: var(--pagination-gap); margin: var(--spacing-2xl, 2rem) 0; padding: 0; list-style: none;
}

.pagination .page-numbers,.pagination .pagination__item {
	flex: 0 0 auto; min-width: 50px; height: 50px; display: inline-flex; justify-content: center; align-items: center;
	padding: var(--pagination-padding) calc(var(--pagination-padding) * 1.8); border: var(--pagination-border);
	border-radius: var(--pagination-radius); background-color: var(--pagination-bg); color: var(--pagination-color);
	text-decoration: none; font-size: var(--font-size-base, 1rem); font-weight: 500; line-height: 1;
	text-align: center; cursor: pointer; transition: all 0.2s ease-in-out; user-select: none; margin: 0 2px;
}

.pagination .prev,.pagination .next,.pagination .pagination__arrow { min-width: 60px; padding-left: calc(var(--pagination-padding) * 2.5); padding-right: calc(var(--pagination-padding) * 2.5); }

.pagination--wide { --pagination-gap: var(--spacing-lg, 24px); gap: var(--spacing-lg); }
.pagination--wide .page-numbers,.pagination--wide .pagination__item { min-width: 60px; height: 60px; padding: var(--spacing-md) calc(var(--spacing-md) * 2); font-size: var(--font-size-lg, 1.125rem); margin: 0 4px; }

.pagination--medium { --pagination-gap: var(--spacing-md, 16px); }

.pagination--margin { gap: 0; }
.pagination--margin .page-numbers,.pagination--margin .pagination__item { margin: 0 10px; }
.pagination--margin .prev { margin-right: 20px; }
.pagination--margin .next { margin-left: 20px; }

.pagination--variable { gap: 0; }
.pagination--variable .page-numbers:not(.prev, .next, .current) { margin: 0 8px; }
.pagination--variable .current { margin: 0 12px; }
.pagination--variable .prev { margin-right: 24px; }
.pagination--variable .next { margin-left: 24px; }
.pagination--variable .dots { margin: 0 4px; }

@media (max-width: 767px) {
	.pagination { --pagination-gap: var(--spacing-sm, 12px); gap: var(--spacing-sm); margin: var(--spacing-xl, 1.5rem) 0; }
	.pagination .page-numbers,.pagination .pagination__item { min-width: 44px; height: 44px; padding: calc(var(--pagination-padding) * 0.75); font-size: var(--font-size-sm, 0.875rem); }
	.pagination--wide { --pagination-gap: var(--spacing-md, 16px); }
	.pagination--wide .page-numbers,.pagination--wide .pagination__item { min-width: 48px; height: 48px; padding: var(--spacing-sm); }
}

@media (max-width: 380px) {
	.pagination { --pagination-gap: var(--spacing-xs); gap: var(--spacing-xs); margin: var(--spacing-lg) 0; }
	.pagination .page-numbers { padding: var(--spacing-xs) var(--spacing-sm); font-size: var(--font-size-xs); }
}

/* ========================================
   Single Layout
   ======================================== */

.single-layout { display: grid; grid-template-columns: 1fr; gap: var(--spacing-2xl); margin: var(--spacing-2xl) 0; width: 100%; }

/* ========================================
   Ad Containers
   ======================================== */

.ad-container { background-color: var(--color-bg-dark-secondary); border: 1px dashed var(--color-border); border-radius: var(--radius-lg); padding: var(--spacing-2xl); margin: var(--spacing-2xl) 0; text-align: center; width: 100%; box-sizing: border-box; }
.ad-placeholder { color: var(--color-text-tertiary); font-size: var(--font-size-body); padding: var(--spacing-lg); }

.hero ~ .ad-container { margin-top: var(--spacing-lg); margin-bottom: var(--spacing-2xl); }

.section--latest ~ #ad-below-latest-1 { 
	margin-top: var(--spacing-3xl); 
	margin-bottom: var(--spacing-3xl);
	background: linear-gradient(135deg, rgba(30,30,40,0.6) 0%, rgba(35,35,50,0.8) 100%);
	border: 1px solid rgba(255,182,28,0.1);
	min-height: 180px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 32px rgba(0,0,0,0.3);
	transition: all var(--transition-normal);
}

.section--latest ~ #ad-below-latest-1:hover {
	background: linear-gradient(135deg, rgba(35,35,45,0.7) 0%, rgba(40,40,55,0.9) 100%);
	border-color: rgba(255,182,28,0.15);
	box-shadow: 0 12px 48px rgba(255,182,28,0.1);
}

/* Collapse ad containers when they contain no ad content.
   Use :has() for modern browsers and :empty as a fallback. Apply globally. */
.ad-container:empty,
.mmp-ad-container:empty,
.mmp-banner-ad-container:empty,
.mmp-native-ad-container:empty,
.mmp-video-ad-container:empty {
	display: none !important;
	margin: 0 !important;
	padding: 0 !important;
	min-height: 0 !important;
	height: 0 !important;
}

/* Collapse reserved ad space when no ads are loaded */
.mmp-ad-space-reserved:not([style*="height"]),
.mmp-ad-space-reserved[style*="min-height:auto"] {
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    min-height: 0 !important;
    height: 0 !important;
    transition: all var(--transition-normal) !important;
}

@supports (selector(:has(*))) {
    .ad-container:not(:has(iframe,ins,ins.adsbygoogle,script,img)),
    .mmp-ad-container:not(:has(iframe,ins,ins.adsbygoogle,script,img)),
    .mmp-banner-ad-container:not(:has(iframe,ins,ins.adsbygoogle,script,img)),
    .mmp-native-ad-container:not(:has(iframe,ins,ins.adsbygoogle,script,img)),
    .mmp-video-ad-container:not(:has(iframe,ins,ins.adsbygoogle,script,img)),
    .mmp-ad-space-reserved:not(:has(ins.adsbygoogle[data-ad-client])) {
        display: none !important;
        max-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
	}
}

/* ========================================
   Details Section (above footer)
   ======================================== */
.section--details { background: var(--color-bg-dark-secondary); padding: var(--spacing-2xl) 0; }
.section--details .container { text-align: center; }
.section--details .details-keywords { color: var(--color-text-secondary); font-size: var(--font-size-small); line-height: 1.5; }

/* ========================================
   404 Error Page
   ======================================== */

.error-404-content { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: var(--spacing-3xl) var(--spacing-lg); min-height: 60vh; gap: var(--spacing-2xl); }

.error-404__icon { font-size: 120px; font-weight: var(--font-weight-bold); color: var(--color-primary); line-height: 1; opacity: 0.8; }
.error-404__title { font-size: var(--font-size-h1); color: var(--color-text-primary); margin: 0; }
.error-404__message { font-size: var(--font-size-body); color: var(--color-text-secondary); max-width: clamp(400px, 85vw, 500px); margin: 0; }

.error-404__actions { display: flex; gap: var(--spacing-lg); flex-wrap: wrap; justify-content: center; margin: var(--spacing-lg) 0; }
/* Modern bordered primary button on 404 page */
.error-404__actions .btn--primary {
	color: var(--color-primary);
	background: transparent;
	border: 2px solid rgba(0,0,0,0.08);
	border-radius: var(--radius-lg);
	padding: calc(var(--spacing-sm) + 4px) var(--spacing-lg);
	box-shadow: 0 6px 18px rgba(0,0,0,0.06);
	transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast);
}
.error-404__actions .btn--primary:hover {
	color: #000;
	opacity: 0.98;
	transform: translateY(-3px);
	border-color: var(--color-primary);
	box-shadow: 0 12px 36px rgba(0,0,0,0.08);
}

.error-404__search { width: 100%; max-width: clamp(500px, 90vw, 600px); background-color: var(--color-bg-dark-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--spacing-2xl); }
.error-404__search h3 { font-size: var(--font-size-h3); color: var(--color-text-primary); margin: 0 0 var(--spacing-lg) 0; }
.error-404__search .theme-search-form { display: flex; align-items: center; justify-content: center; gap: var(--spacing-sm); }
.error-404__search .theme-search-input { min-width: 260px; }

@media (max-width: 479px) {
	.error-404__search { padding: var(--spacing-lg); }
	.error-404__search .theme-search-form { flex-direction: column; align-items: stretch; gap: 12px; }
	.error-404__search .theme-search-input,.error-404__search .theme-search-type,.error-404__search .theme-search-form .search-submit,.error-404__search .theme-search-form .btn { width: 100%; min-width: 0; }
	.error-404__search .theme-search-controls { display: flex; flex-direction: column; gap: 8px; }
}

.section--search-results .no-results { text-align: center; padding: 48px 24px; }
.section--search-results .no-results .no-results__title { font-size: 1.5rem; margin-bottom: 8px; }
.section--search-results .no-results .no-results__desc { margin-bottom: 24px; color: var(--color-text-secondary); }
.section--search-results .no-results .no-results__icon { width: 96px; height: 96px; margin: 0 auto 24px; opacity: .6; }
.section--search-results .no-results .no-results__placeholders { display: flex; justify-content: center; gap: 16px; margin-top: 12px; }
.section--search-results .no-results .no-results__placeholder { width: clamp(100px, 20vw, 120px); height: auto; aspect-ratio: 3/2; border: 2px dashed var(--color-border); border-radius: 6px; display: flex; align-items: center; justify-content: center; color: var(--color-text-secondary); background: transparent; }
.section--search-results .no-results .no-results__search-wrap { margin-top: 36px; display: flex; justify-content: center; }

@media (max-width: 479px) {
	.section--search-results .no-results .no-results__placeholders { flex-wrap: wrap; gap: 12px; }
	.section--search-results .no-results .no-results__placeholder { width: calc(33% - 12px); min-width: 100px; }
}

/* ========================================
   Footer
   ======================================== */

.site-footer { background-color: var(--color-bg-dark-secondary); border-top: 1px solid var(--color-border); padding: var(--spacing-3xl) 0 var(--spacing-2xl) 0; margin-top: 1rem; width: 100%; }
.site-footer__inner { max-width: clamp(1200px, 95vw, 1280px); margin: 0 auto; padding: 0 var(--spacing-lg); }

.footer-columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--spacing-2xl); margin-bottom: var(--spacing-2xl); justify-items: center; text-align: center; width: 100%; }
.footer-column { text-align: center; }
.footer-column h3 { font-size: var(--font-size-h4); margin-bottom: var(--spacing-lg); color: var(--color-text-primary); }

.footer-category-list { list-style: none; }
.footer-category-list li { margin-bottom: var(--spacing-sm); }
.footer-category-list a { color: var(--color-text-secondary); transition: color var(--transition-fast); }
.footer-category-list a:hover { color: var(--color-primary); }

.footer-bottom { display: flex; justify-content: center; align-items: center; flex-direction: column; padding-top: var(--spacing-lg); border-top: 1px solid var(--color-border); gap: var(--spacing-md); text-align: center; }
.footer-bottom__copyright { font-size: var(--font-size-small); color: var(--color-text-tertiary); display: inline-block; }
.footer-bottom__links { display: flex; gap: var(--spacing-lg); font-size: var(--font-size-small); flex-wrap: wrap; justify-content: center; }
.footer-bottom__links a { color: var(--color-text-secondary); transition: color var(--transition-fast); }
.footer-bottom__links a:hover { color: var(--color-primary); }

/* ========================================
   Utility Classes
   ======================================== */

.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ========================================
   Responsive Design
   ======================================== */

@media (max-width: 1280px) { :root { --spacing-3xl: 48px; --spacing-2xl: 40px; } }

@media (max-width: 1023px) {
	:root { --font-size-h1: 36px; --font-size-h2: 28px; --font-size-h3: 24px; --spacing-2xl: 36px; --spacing-lg: 20px; }
	.single-layout { grid-template-columns: 1fr; }
	.archive-layout { grid-template-columns: 1fr; }
	.hero { min-height: 300px; padding: var(--spacing-2xl) var(--spacing-lg); }
	.hero__content { flex-direction: column; gap: var(--spacing-lg); }
	.hero__poster { width: clamp(120px, 20vw, 150px); height: auto; aspect-ratio: 2/3; }
	.movies-grid,.tv-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-md); }
	.section--related-tv .movies-grid,.section--related-movies .movies-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-md); }
	.actors-grid,.directors-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-md); }
	.footer-columns { grid-template-columns: repeat(2, 1fr); }
	.footer-bottom { flex-direction: column; text-align: center; }
	.error-404-content { padding: var(--spacing-2xl) var(--spacing-lg); min-height: 50vh; }
	.error-404__icon { font-size: 80px; }
	.error-404__actions { flex-direction: column; }
	.error-404__actions .btn { width: 100%; }
}

@media (max-width: 767px) {
	:root { --font-size-h1: 28px; --font-size-h2: 24px; --font-size-h3: 20px; --spacing-lg: 16px; --spacing-md: 12px; --spacing-2xl: 32px; }
	.section { padding: var(--spacing-2xl) var(--spacing-md); margin-bottom: var(--spacing-lg); border-radius: 8px; }
	.section::before { opacity: 0; }
	.section--home { padding: var(--spacing-2xl) var(--spacing-md); margin-bottom: var(--spacing-lg); }
	.section--related-tv,.section--related-movies,.section--search-results,.section--multi { padding: var(--spacing-2xl) var(--spacing-md); margin-bottom: var(--spacing-lg); }
	.section--related-grid { grid-template-columns: repeat(2, 1fr); gap: var(--spacing-2xl); }
	.container { padding: 0 var(--spacing-md); }
	.site-header__inner { gap: var(--spacing-sm); flex-wrap: wrap; }

	/* header search removed */
	.hero { min-height: 250px; padding: var(--spacing-xl) var(--spacing-md); }
	.hero__poster { width: clamp(100px, 18vw, 120px); height: auto; aspect-ratio: 2/3; }
	.hero__inner { gap: var(--spacing-md); }
	.movies-grid,.tv-grid,.actors-grid,.directors-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-md); }
	.section--related-tv .movies-grid,.section--related-movies .movies-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-md); }
	.movie-card__content { padding: 10px 8px; gap: 5px; }
	.movie-card__title { font-size: 13px; }
	.movie-card__meta { font-size: 10px; gap: 6px; }
	.person-card__body { padding: 8px 6px; gap: 4px; }
	.person-card__name { font-size: 12px; }
	.person-card__excerpt { font-size: 10px; }
	.archive-layout { gap: var(--spacing-lg); }
	.footer-columns { grid-template-columns: 1fr; gap: var(--spacing-lg); }

	/* Keep 'About' full-width and place the link lists side-by-side on small phones */
	.footer-columns { grid-template-columns: repeat(2, 1fr); gap: var(--spacing-lg); }
	.footer-column--about { grid-column: 1 / -1; }

	/* Add vertical divider and spacing between the two link columns */
	.footer-column--categories { padding-right: 14px; border-right: 1px solid rgba(255,255,255,0.04); }
	.footer-column--contact { padding-left: 14px; }
	.footer-bottom { flex-direction: column; gap: var(--spacing-md); }
	.pagination { --pagination-gap: var(--spacing-sm); gap: var(--spacing-sm); margin: var(--spacing-xl) 0; }
	.pagination .page-numbers,.pagination .pagination__item { min-width: 44px; height: 44px; padding: calc(var(--spacing-xs) * 0.75); font-size: var(--font-size-small); }
}

@media (max-width: 380px) {
	:root { --font-size-h1: 24px; --font-size-h2: 20px; --font-size-h3: 18px; --spacing-md: 8px; --spacing-lg: 12px; --spacing-2xl: 24px; }
	.section { padding: var(--spacing-lg) var(--spacing-sm); margin-bottom: var(--spacing-md); border-radius: 8px; }
	.section--home { padding: var(--spacing-lg) var(--spacing-sm); margin-bottom: var(--spacing-md); }
	.section--related-tv,.section--related-movies,.section--search-results,.section--multi { padding: var(--spacing-lg) var(--spacing-sm); margin-bottom: var(--spacing-md); }
	.section--related-grid { grid-template-columns: 1fr; gap: var(--spacing-2xl); }
	.container { padding: 0 var(--spacing-md); }
	.hero { padding: var(--spacing-lg) var(--spacing-md); min-height: 200px; }
	.hero__content { gap: var(--spacing-md); }
	.hero__inner { flex-direction: column; align-items: flex-start; }
	.hero__text { max-width: 100%; }
	.hero__search-row { width: 100%; }
	.hero__poster { width: clamp(80px, 15vw, 100px); height: auto; aspect-ratio: 2/3; }
	.movies-grid,.tv-grid,.actors-grid,.directors-grid,.grid--latest { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-md); }
	.section--related-tv .movies-grid,.section--related-movies .movies-grid { grid-template-columns: repeat(2, 1fr); gap: var(--spacing-md); }
	.movie-card__content { padding: 8px 6px; gap: 4px; }
	.movie-card__title { font-size: 12px; margin: 0 0 2px 0; }
	.movie-card__meta { font-size: 9px; gap: 4px; }
	.person-card__body { padding: 6px 5px; gap: 3px; }
	.person-card__name { font-size: 11px; }
	.person-card__excerpt { font-size: 9px; }
	.cast-grid,.directors-list { grid-template-columns: 1fr; }
	.archive-layout { gap: var(--spacing-md); }
	.footer-columns { gap: var(--spacing-lg); }
	.pagination { --pagination-gap: var(--spacing-xs); gap: var(--spacing-xs); margin: var(--spacing-lg) 0; }
	.pagination .page-numbers { padding: var(--spacing-xs) var(--spacing-sm); font-size: var(--font-size-xs); }
	.error-404-content { padding: var(--spacing-lg); gap: var(--spacing-lg); }
	.error-404__icon { font-size: 60px; }
	.error-404__title { font-size: var(--font-size-h2); }
	.error-404__search { padding: var(--spacing-lg); }
	.ad-container { padding: var(--spacing-lg); margin: var(--spacing-lg) 0; }
	.carousel { align-items: flex-start; }
	.carousel-prev,.carousel-next { display: none; }
	.section--multi .multi-grid { gap: var(--spacing-md); }
}

/* ========================================
   Top Rated Actors & Directors
   ======================================== */

.section--top-rated {
	padding: var(--spacing-md) var(--spacing-lg);
	background: transparent;
	border-bottom: 1px solid rgba(246,201,78,0.15);
}

/* Fix section--top-rated header alignment */
.section--top-rated .section__header {
	margin-bottom: var(--spacing-lg);
}

.section--top-rated .section__header--centered {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	border: none;
	padding-bottom: 0;
}

.section--top-rated .section__title {
	font-size: clamp(18px, 5vw, 28px);
}

.top-rated-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: var(--spacing-md);
	max-width: 1200px;
	margin: 0 auto;
	justify-items: center;
}

.top-rated-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-decoration: none;
	color: inherit;
	transition: transform 0.3s ease;
	cursor: pointer;
}

.top-rated-card:hover {
	transform: translateY(-4px);
}

.top-rated-image {
	width: 100px;
	height: 100px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(246,201,78,0.1);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--spacing-xs);
	border: 2px solid rgba(246,201,78,0.2);
	transition: border-color 0.3s ease;
}

.top-rated-card:hover .top-rated-image {
	border-color: rgba(246,201,78,0.4);
}

.top-rated-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.top-rated-placeholder {
	font-size: 40px;
	opacity: 0.5;
}

.top-rated-name {
	font-size: 13px;
	font-weight: 500;
	color: var(--color-text-primary);
	text-align: center;
	margin: 0;
	line-height: 1.3;
	max-width: 130px;
	word-wrap: break-word;
}

/* Responsive Design */
@media (max-width: 1199px) {
	.top-rated-grid {
		grid-template-columns: repeat(5, 1fr);
		gap: var(--spacing-md);
	}

	.top-rated-image {
		width: 95px;
		height: 95px;
		margin-bottom: 6px;
	}

	.top-rated-name {
		font-size: 12px;
		max-width: 120px;
	}
}

@media (max-width: 767px) {
	.top-rated-grid {
		grid-template-columns: repeat(4, 1fr);
		gap: var(--spacing-sm);
	}

	.top-rated-image {
		width: 80px;
		height: 80px;
		margin-bottom: 4px;
	}

	.top-rated-name {
		font-size: 11px;
		max-width: 100px;
	}
}

@media (max-width: 480px) {
	.top-rated-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: var(--spacing-sm);
	}

	.top-rated-image {
		width: 70px;
		height: 70px;
		margin-bottom: 3px;
	}

	.top-rated-name {
		font-size: 10px;
		max-width: 90px;
	}
}

@media (max-width: 380px) {
	.section--top-rated {
		padding: var(--spacing-md) var(--spacing-sm);
	}

	.section--top-rated .section__title {
		font-size: clamp(14px, 3.5vw, 18px);
	}

	.top-rated-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--spacing-xs);
		max-width: 100%;
	}

	.top-rated-image {
		width: 60px;
		height: 60px;
		margin-bottom: 3px;
	}

	.top-rated-name {
		font-size: 9px;
		max-width: 80px;
	}
}

/* ========================================
   Latest Movies & Episodes Two-Column Layout
   ======================================== */

.section--latest-duo {
	padding: var(--spacing-lg) var(--spacing-md);
}

.latest-duo-container {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: var(--spacing-lg);
	max-width: clamp(1100px, 95vw, 1200px);
	margin: 0 auto;
	align-items: start;
}

.latest-duo-column {
	flex: 1;
}

.latest-duo-header {
	margin-bottom: var(--spacing-sm);
	padding-bottom: 6px;
	border-bottom: 2px solid rgba(246,201,78,0.2);
}

.latest-duo-title {
	font-size: var(--font-size-h3);
	font-weight: 600;
	color: var(--color-text-primary);
	margin: 0;
	letter-spacing: 0.5px;
}

.latest-duo-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.latest-duo-item {
	display: block;
	padding: 6px 0;
	border-bottom: 1px solid rgba(255,255,255,0.05);
	transition: all .2s ease;
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}

.latest-duo-item:last-child {
	border-bottom: none;
}

.latest-duo-item:hover {
	background: rgba(246,201,78,0.03);
	padding-left: var(--spacing-sm);
	padding-right: var(--spacing-sm);
}

.latest-duo-text {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.latest-duo-left {
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 1;
	min-width: 0;
}

.latest-duo-right {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
	white-space: nowrap;
}

.latest-duo-title-text {
	color: var(--color-text-primary);
	font-weight: 500;
	font-size: 14px;
	line-height: 1.3;
}

.latest-duo-meta {
	color: rgba(255,255,255,0.6);
	font-size: 12px;
	display: inline-flex;
	gap: 3px;
}

.latest-duo-time {
	color: rgba(246,201,78,0.7);
	font-size: 11px;
	font-weight: 500;
}

.latest-duo-divider {
	width: 2px;
	background: linear-gradient(to bottom, 
		rgba(246,201,78,0), 
		rgba(246,201,78,0.3) 50%, 
		rgba(246,201,78,0));
	height: 100%;
	min-height: auto;
	border-radius: 1px;
	margin: 0 var(--spacing-lg);
}

.latest-duo-empty {
	color: rgba(255,255,255,0.5);
	text-align: center;
	padding: var(--spacing-2xl) var(--spacing-lg);
	font-style: italic;
}

/* Responsive Design */
@media (max-width: 1023px) {
	.latest-duo-container {
		grid-template-columns: 1fr 1fr;
		gap: var(--spacing-lg);
	}
	
	.latest-duo-divider {
		display: none;
	}
	
	.latest-duo-container::after {
		content: '';
		grid-column: 1 / -1;
		height: 1px;
		background: linear-gradient(to right, 
			rgba(246,201,78,0), 
			rgba(246,201,78,0.2) 50%, 
			rgba(246,201,78,0));
		margin-top: var(--spacing-xl);
	}
}

@media (max-width: 767px) {
	.section--latest-duo {
		padding: var(--spacing-lg) var(--spacing-sm);
	}
	
	.latest-duo-container {
		grid-template-columns: 1fr;
		gap: var(--spacing-lg);
	}
	
	.latest-duo-header {
		margin-bottom: var(--spacing-xs);
	}
	
	.latest-duo-title {
		font-size: var(--font-size-h4);
	}
	
	.latest-duo-item {
		padding: var(--spacing-sm) 0;
	}
}

@media (max-width: 479px) {
	.section--latest-duo {
		padding: var(--spacing-lg) var(--spacing-sm);
	}
	
	.latest-duo-title {
		font-size: 18px;
	}
	
	.latest-duo-title-text {
		font-size: 13px;
	}
	
	.latest-duo-meta {
		font-size: 11px;
	}
	
	.latest-duo-time {
		font-size: 10px;
	}
}

@media (max-width: 319px) {
	.section--latest-duo {
		padding: var(--spacing-lg) 8px;
	}
	
	.latest-duo-header {
		margin-bottom: 10px;
		padding-bottom: 10px;
	}
	
	.latest-duo-title {
		font-size: 16px;
		line-height: 1.3;
	}
	
	.latest-duo-item {
		padding: 10px 0;
	}
	
	.latest-duo-title-text {
		font-size: 12px;
		line-height: 1.3;
	}
	
	.latest-duo-meta {
		font-size: 10px;
		opacity: 0.8;
	}
	
	.latest-duo-time {
		font-size: 9px;
		margin-top: 2px;
	}
	
	.latest-duo-text {
		gap: 3px;
	}
}

/**
 * Show More / Show Less Toggle Styles
 */

/* People lists (cast/directors) */
.people-hidden {
	display: none;
}

.people-hidden.show {
	display: contents;
}

.people-show-more-wrapper {
	grid-column: 1 / -1;
	display: flex;
	justify-content: center;
	margin: var(--spacing-md) 0;
}

.people-show-more-wrapper.hide {
	display: none;
}

.people-show-less-wrapper {
	display: none;
	grid-column: 1 / -1;
	justify-content: center;
	margin: var(--spacing-md) 0;
}

.people-show-less-wrapper.show {
	display: flex;
}

/* Filter badges (genres/years) - horizontal display */
.filter-badge.badge-hidden-item {
	display: none;
}

.filter-badge.badge-hidden-item.show {
	display: flex;
}

.btn--show-more.hidden {
	display: none;
}

.btn--show-less.visible {
	display: flex;
}

/* Button styles */
.btn--show-more,
.btn--show-less {
	padding: clamp(6px, 0.8vw, 10px) clamp(14px, 1.5vw, 18px);
	border-radius: var(--radius-lg);
	border: 1px solid rgba(246, 201, 78, 0.3);
	background: linear-gradient(135deg, rgba(246, 201, 78, 0.08), rgba(246, 201, 78, 0.03));
	color: #f6c94e;
	font-weight: var(--font-weight-semibold);
	font-size: clamp(11px, 0.8vw, 13px);
	cursor: pointer;
	transition: all 0.3s ease;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	height: auto;
	line-height: 1.2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	box-shadow: 0 2px 8px rgba(246, 201, 78, 0.1);
}

.btn--show-more:hover,
.btn--show-less:hover {
	background: linear-gradient(135deg, rgba(246, 201, 78, 0.15), rgba(246, 201, 78, 0.08));
	border-color: rgba(246, 201, 78, 0.5);
	box-shadow: 0 4px 12px rgba(246, 201, 78, 0.15);
	transform: translateY(-1px);
}