/* IDEA 1: SPLIT SLIDER STYLING */
:root { --bg: #030303; --card: #0a0a0a; --accent: #ffffff; --dim: #666; }
* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Inter', sans-serif; }
body { background: var(--bg); color: #fff; overflow: hidden; } /* Prevents normal scrolling */

nav { display: flex; justify-content: space-between; padding: 30px 8%; background: rgba(3,3,3,0.95); position: absolute; width: 100%; top: 0; z-index: 2000; border-bottom: 1px solid #111; }
.logo { font-weight: bold; letter-spacing: 3px; font-size: 1rem; }
.nav-links a { text-decoration: none; color: var(--dim); margin-left: 20px; font-size: 0.8rem; transition: 0.3s; }
.nav-links a.active, .nav-links a:hover { color: var(--accent); }

.split-slider { height: 100vh; display: flex; align-items: center; justify-content: center; position: relative; }

.photo-side { flex: 1.2; height: 100%; position: relative; overflow: hidden; }
.slide { width: 100%; height: 100%; object-fit: cover; position: absolute; opacity: 0; transition: 1.5s ease-in-out; filter: grayscale(50%); }
.slide.active { opacity: 1; filter: grayscale(0%); }

.text-side { flex: 0.8; height: 100%; display: flex; align-items: center; justify-content: center; padding: 80px; background: var(--card); border-left: 1px solid #1a1a1a; }
.text-content { text-align: left; max-width: 400px; opacity: 0; transition: 1s; }
.text-content.active { opacity: 1; }
.text-content h1 { font-family: 'Playfair Display', serif; font-size: 3rem; margin-bottom: 15px; letter-spacing: -1px; }
.text-content .eyebrow { color: var(--dim); text-transform: uppercase; letter-spacing: 4px; font-size: 0.7rem; margin-bottom: 10px; display: block; }
.text-content p { color: var(--dim); margin-bottom: 30px; }
.advance-tag { display: inline-block; color: #ffab00; border: 1px solid #ffab00; padding: 5px 12px; font-size: 0.7rem; border-radius: 2px; }

@media (max-width: 900px) {
    .split-slider { flex-direction: column; }
    .photo-side, .text-side { flex: 1; width: 100%; }
    .text-side { border-left: none; border-top: 1px solid #1a1a1a; padding: 40px; }
    .text-content h1 { font-size: 2.2rem; }
}