/* =========================================
   GLOBAL TYPOGRAPHY & LAYOUT
   ========================================= */

/* Default Content Column (with wider breathing room) */
.content-col, .newmedia-content-col, .skills-content-col {
	line-height: 1.5; 
	font-size: 16px;  
	color: #000000;
	padding: 40px 100px 60px 100px; 
	box-sizing: border-box;
	background-color: #F4F4F0; 
}

/* Font Assignments */
.newmedia-text, .newmedia-text p, .newmedia-text td,
.skills-text, .skills-text p, .skills-text td, .skills-text ul, .skills-text li {
	font-family: "Georgia", serif;
}

.content-col, .content-col p, .content-col td {
	font-family: "Century Gothic", sans-serif;
}

/* =========================================
   HEADINGS & DIVIDERS
   ========================================= */

.heading-large, .section-title {
	color: #0000FF;
	font-size: 2em;
	font-weight: bold;
	text-align: center;
	margin: 0 0 40px 0; 
}

.section-title {
	margin: 60px 0 30px 0;
}

.heading-blue {
	color: #0000FF;
	font-size: 1.3em;
	font-weight: bold;
	margin-bottom: 0; 
	display: block;
}

.heading-blue + * {
	margin-top: 0 !important;
}

.director-credit {
	margin-top: 2px !important;
	margin-bottom: 10px !important;
}

.section-divider {
	border-top: 1px solid rgba(0, 0, 0, 0.15);
	margin: 35px auto;
	width: 50%;
	clear: both;
}

/* =========================================
   IMAGE GALLERIES & FLOATS
   ========================================= */

.img-left { float: left; margin: 5px 20px 15px 0 !important; }
.img-right { float: right; margin: 5px 0 15px 20px !important; }
.clear { clear: both; }

.natural-gallery {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 15px;
	margin: 20px 0;
	clear: both;
}
.natural-gallery img {
	max-width: 100%; 
	height: auto;
	margin: 0 !important;
}

/* =========================================
   WEBISODES PAGE FIXES
   ========================================= */

/* Valet & Seraphim: Touching, exact original sizes */
.no-gap-gallery {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto 15px auto;
	gap: 0; 
}
.no-gap-gallery img {
	width: auto !important; 
	height: auto !important; 
	margin: 0 !important;
	border-radius: 0 !important;
}
.photo-row {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	align-items: center;
	margin: 15px 0;
}
.photo-row img {
	margin: 0 !important;
	height: 160px; 
	width: auto;
	object-fit: cover;
	border-radius: 4px;
}

.painting-row {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 20px;
	margin-bottom: 20px;
}
.painting-row img {
	margin: 0 !important;
	border-radius: 4px;
	width: auto;
}


/* Valet Only: Shrunk by 10% */
.valet-gallery {
	transform: scale(0.9); 
}

/* Absurd TV: Shrunk by 20%, rows pulled closer together */
.absurd-gallery {
	display: flex;
	justify-content: center;
	align-items: center; 
	margin: -50px auto; /* Increased negative margin to pull the rows tighter together */
	gap: 0; 
	transform: scale(0.8); /* Shrinks by 20% */
}
.absurd-gallery img { 
	width: auto !important; 
	height: auto !important; 
	margin: 0 !important;
	border: 4px solid #000000 !important; 
}

/* Paradise Drive Orphan Text Fix */
.orphan-fix {
	overflow: hidden; 
	display: block;
}

/* =========================================
   VIDEO PLAYERS & MULTI-COLUMN LAYOUTS
   ========================================= */

.video-player {
	width: 100%;
	max-width: 380px; 
	max-height: 350px; 
	object-fit: contain; 
	background-color: #000; 
	border-radius: 6px;
	display: block;
	margin: 0 auto;
}

.video-col .video-player, .clip-col .video-player, .two-col-clip .video-player {
	max-width: 100%;
}

.project-block { margin: 20px 0; width: 100%; }
.double-wide-block { margin: 20px 0; }
.project-block img { max-width: 100%; height: auto; margin: 10px 0; border-radius: 4px; }

/* Essentials Rows */
.essentials-row {
	display: flex;
	gap: 30px;
	align-items: center;
	margin-bottom: 20px; 
	width: 100%;
	border-bottom: 1px solid rgba(0,0,0,0.15); 
	padding-bottom: 20px; 
}
.essentials-row:last-child { border-bottom: none; }
.video-col { flex: 0 0 55%; text-align: center; }
.text-col { flex: 0 0 40%; }
.text-col p { margin-top: 0; }

/* 3-Column Layout */
.three-col-row {
	display: flex;
	gap: 30px;
	align-items: center;
	margin-bottom: 20px;
	width: 100%;
	border-bottom: 1px solid rgba(0,0,0,0.15);
	padding-bottom: 20px;
}
.three-col-row:last-child { border-bottom: none; }
.role-col { flex: 1; text-align: right; } 
.clip-col { flex: 0 0 45%; text-align: center; }
.desc-col { flex: 1; text-align: left; } 

/* 2-Column Layout */
.two-col-row {
	display: flex;
	gap: 30px;
	align-items: center;
	margin-bottom: 20px;
	width: 100%; 
	border-bottom: 1px solid rgba(0,0,0,0.15);
	padding-bottom: 20px;
}
.two-col-row:last-child { border-bottom: none; }
.two-col-role { flex: 1; text-align: right; }
.two-col-clip { flex: 0 0 45%; text-align: center; }

.two-col-row::after {
	content: "";
	flex: 1;
}

/* Embeds & Audio */
.clip-col iframe, .clip-col video, .two-col-clip iframe, .two-col-clip video {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9; 
	background-color: #000;
	border-radius: 6px;
	display: block;
	margin: 0 auto;
	border: none;
}
.clip-col audio, .two-col-clip audio { width: 100%; margin: 0 auto; display: block; }
.desc-col p, .role-col p, .two-col-role p { margin: 0; }
.desc-col a { color: #000000; text-decoration: none; }
.desc-col a:hover { text-decoration: underline; }

/* =========================================
   UI ELEMENTS
   ========================================= */

.back-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 999;
}
.back-to-top img {
	border: 0;
	width: 80px; 
	height: auto;
	opacity: 0.8;
	transition: opacity 0.3s ease;
}
.back-to-top:hover img {
	opacity: 1;
}

/* =========================================
   BIO PAGE LAYOUT
   ========================================= */

.bio-content, .bio-content p {
	font-family: "Georgia", serif;
	font-size: 16px;
	line-height: 1.5;
	color: #000000;
}

.bio-content {
	padding: 30px 0 50px 0; 
}