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

:root {
    --vampire-black: #000000;
    --blood-red: #8b0000;
    --crimson: #dc143c;
    --dark-crimson: #3d0000;
    --midnight: #0a0000;
    --shadow-red: #4a0000;
    --text-primary: #ffffff;
    --text-blood: #ff0000;
    --text-muted: #999999;
    --border-blood: rgba(139, 0, 0, 0.3);
    --glow-red: rgba(220, 20, 60, 0.8);
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: var(--vampire-black);
    color: var(--text-primary);
    line-height: 1.6;
    overflow-x: hidden;
    position: relative;
    cursor: default; /* Ensure default cursor */
}

/* Ensure proper cursors */
a, button, .btn-primary, .btn-submit, .work-link, .contact-link {
    cursor: pointer !important;
}

body::before {
    content: '';
    position: fixed;
    inset: 0;
    background: 
        radial-gradient(circle at 20% 80%, var(--dark-crimson) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, var(--shadow-red) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, var(--blood-red) 0%, transparent 70%);
    opacity: 0.3;
    pointer-events: none;
    z-index: -5;
}

.noise {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.03;
    z-index: -4;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence baseFrequency='0.9' /%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.5'/%3E%3C/svg%3E");
    mix-blend-mode: multiply;
}

.gradient-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, transparent 0%, var(--vampire-black) 100%);
    pointer-events: none;
    z-index: -3;
}

/* Creepy Trees Background */
.trees-left,
.trees-right {
    position: fixed;
    width: 400px;
    height: 100%;
    pointer-events: none;
    z-index: -2;
    opacity: 0.6;
}

.trees-left {
    left: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 800' fill='%23000000'%3E%3Cpath d='M50 800 L50 700 L40 680 L45 650 L30 630 L35 600 L25 580 L30 550 L20 530 L25 500 L15 480 L20 450 L10 430 L15 400 L5 380 L10 350 L25 330 L20 300 L35 280 L30 250 L45 230 L40 200 L25 180 L30 150 L15 130 L20 100 L10 80 L15 50 L5 30 L10 0 L15 0 L20 30 L25 50 L30 80 L35 100 L40 130 L45 150 L50 180 L55 200 L60 230 L65 250 L70 280 L65 300 L80 330 L75 350 L90 380 L85 400 L95 430 L90 450 L100 480 L95 500 L105 530 L100 550 L110 580 L105 600 L115 630 L110 650 L120 680 L115 700 L125 800 Z M150 800 L150 720 L140 700 L145 670 L130 650 L135 620 L125 600 L130 570 L120 550 L125 520 L115 500 L120 470 L110 450 L115 420 L105 400 L110 370 L125 350 L120 320 L135 300 L130 270 L145 250 L140 220 L125 200 L130 170 L115 150 L120 120 L110 100 L115 70 L105 50 L110 0 L115 0 L120 50 L125 70 L130 100 L135 120 L140 150 L145 170 L150 200 L155 220 L160 250 L165 270 L170 300 L165 320 L180 350 L175 370 L190 400 L185 420 L195 450 L190 470 L200 500 L195 520 L205 550 L200 570 L210 600 L205 620 L215 650 L210 670 L220 700 L215 720 L225 800 Z M250 800 L250 740 L240 720 L245 690 L230 670 L235 640 L225 620 L230 590 L220 570 L225 540 L215 520 L220 490 L210 470 L215 440 L205 420 L210 390 L225 370 L220 340 L235 320 L230 290 L245 270 L240 240 L225 220 L230 190 L215 170 L220 140 L210 120 L215 90 L205 70 L210 0 L215 0 L220 70 L225 90 L230 120 L235 140 L240 170 L245 190 L250 220 L255 240 L260 270 L265 290 L270 320 L265 340 L280 370 L275 390 L290 420 L285 440 L295 470 L290 490 L300 520 L295 540 L305 570 L300 590 L310 620 L305 640 L315 670 L310 690 L320 720 L315 740 L325 800 Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: contain;
}

.trees-right {
    right: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 800' fill='%23000000'%3E%3Cpath d='M350 800 L350 700 L360 680 L355 650 L370 630 L365 600 L375 580 L370 550 L380 530 L375 500 L385 480 L380 450 L390 430 L385 400 L395 380 L390 350 L375 330 L380 300 L365 280 L370 250 L355 230 L360 200 L375 180 L370 150 L385 130 L380 100 L390 80 L385 50 L395 30 L390 0 L385 0 L380 30 L375 50 L370 80 L365 100 L360 130 L355 150 L350 180 L345 200 L340 230 L335 250 L330 280 L335 300 L320 330 L325 350 L310 380 L315 400 L305 430 L310 450 L300 480 L305 500 L295 530 L300 550 L290 580 L295 600 L285 630 L290 650 L280 680 L285 700 L275 800 Z M150 800 L150 720 L160 700 L155 670 L170 650 L165 620 L175 600 L170 570 L180 550 L175 520 L185 500 L180 470 L190 450 L185 420 L195 400 L190 370 L175 350 L180 320 L165 300 L170 270 L155 250 L160 220 L175 200 L170 170 L185 150 L180 120 L190 100 L185 70 L195 50 L190 0 L185 0 L180 50 L175 70 L170 100 L165 120 L160 150 L155 170 L150 200 L145 220 L140 250 L135 270 L130 300 L135 320 L120 350 L125 370 L110 400 L115 420 L105 450 L110 470 L100 500 L105 520 L95 550 L100 570 L90 600 L95 620 L85 650 L90 670 L80 700 L85 720 L75 800 Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: contain;
}

/* Blood drip animation */
.blood-drips {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100px;
    pointer-events: none;
    z-index: -1;
}

.blood-drip {
    position: absolute;
    width: 4px;
    height: 20px;
    background: linear-gradient(to bottom, var(--blood-red), transparent);
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    animation: drip 8s ease-in-out infinite;
}

.blood-drip:nth-child(1) { left: 10%; animation-delay: 0s; }
.blood-drip:nth-child(2) { left: 25%; animation-delay: 2s; }
.blood-drip:nth-child(3) { left: 40%; animation-delay: 4s; }
.blood-drip:nth-child(4) { left: 60%; animation-delay: 1s; }
.blood-drip:nth-child(5) { left: 75%; animation-delay: 3s; }
.blood-drip:nth-child(6) { left: 90%; animation-delay: 5s; }

@keyframes drip {
    0% { transform: translateY(0); opacity: 0; }
    10% { opacity: 1; }
    100% { transform: translateY(100vh); opacity: 0; }
}

.container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 60px;
    position: relative;
    z-index: 10;
}

@media (max-width: 768px) {
    .container {
        padding: 0 30px;
    }
    
    .review-card {
        flex: 0 0 85%;
        min-width: 85%;
    }
}

/* Navigation */
.navigation {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    backdrop-filter: blur(20px) saturate(180%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.95), rgba(139, 0, 0, 0.1));
    border-bottom: 1px solid var(--border-blood);
    box-shadow: 0 4px 30px rgba(139, 0, 0, 0.5);
}

.nav-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 60px;
    position: relative;
}

.nav-logo {
    display: flex;
    align-items: center;
    height: 70px;
}

.logo-image {
    max-height: 70px !important;
    height: 70px !important;
    width: auto !important;
    display: block;
    filter: drop-shadow(0 0 8px var(--glow-red));
    transition: transform 0.3s ease, filter 0.3s ease;
}

.logo-image:hover {
    transform: scale(1.05);
    filter: drop-shadow(0 0 20px var(--crimson));
}

@keyframes pulse-glow {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.3) drop-shadow(0 0 20px var(--crimson)); }
}

.nav-links {
    display: flex;
    list-style: none;
    gap: 60px;
}

.nav-links a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.nav-links a::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--crimson), var(--blood-red));
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 0 10px var(--glow-red);
}

.nav-links a:hover {
    color: var(--crimson);
    text-shadow: 0 0 10px var(--glow-red);
}

.nav-links a:hover::after {
    width: 100%;
}

/* Hero Section */
.hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.hero-background {
    position: absolute;
    inset: 0;
    z-index: -1;
}

.hero-image {
    width: 100%;
    height: 100%;
    background: 
        linear-gradient(135deg, var(--vampire-black) 0%, var(--dark-crimson) 50%, var(--vampire-black) 100%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 1080'%3E%3Cpath d='M0,1080 C100,1000 200,950 300,900 C400,850 500,800 600,850 C700,900 800,950 900,900 C1000,850 1100,800 1200,850 C1300,900 1400,950 1500,900 C1600,850 1700,800 1800,850 C1900,900 1920,950 1920,1080 Z' fill='%23000000' opacity='0.5'/%3E%3C/svg%3E");
    background-size: cover;
    background-position: center;
    opacity: 0.7;
}

/* Bats animation */
.bats {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}

.bat {
    position: absolute;
    width: 30px;
    height: 30px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 20'%3E%3Cpath d='M20,10 C15,5 10,0 5,5 C0,10 5,10 10,10 C15,10 15,15 20,15 C25,15 25,10 30,10 C35,10 40,10 35,5 C30,0 25,5 20,10 Z' fill='black'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    animation: fly 20s linear infinite;
}

.bat:nth-child(1) { top: 10%; animation-delay: 0s; animation-duration: 15s; }
.bat:nth-child(2) { top: 30%; animation-delay: 5s; animation-duration: 18s; }
.bat:nth-child(3) { top: 50%; animation-delay: 10s; animation-duration: 20s; }

@keyframes fly {
    0% { transform: translateX(-100px) translateY(0); }
    25% { transform: translateX(25vw) translateY(-30px); }
    50% { transform: translateX(50vw) translateY(30px); }
    75% { transform: translateX(75vw) translateY(-20px); }
    100% { transform: translateX(calc(100vw + 100px)) translateY(0); }
}

.hero-content {
    width: 100%;
    padding: 0 60px;
    position: relative;
    z-index: 10;
}

.hero-text {
    max-width: 1400px;
    margin: 0 auto;
}

.hero-title {
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    line-height: 0.9;
    margin-bottom: 40px;
}

.title-line {
    display: block;
    font-size: clamp(60px, 12vw, 180px);
    letter-spacing: -0.02em;
    opacity: 0;
    transform: translateY(50px);
    animation: fadeInUp 1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    background: linear-gradient(180deg, var(--text-primary) 0%, var(--crimson) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: 0 0 40px rgba(139, 0, 0, 0.5);
}

.title-line:nth-child(2) {
    animation-delay: 0.2s;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-subtitle {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 30px;
    opacity: 0;
    animation: fadeIn 1s 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes fadeIn {
    to {
        opacity: 1;
    }
}

.subtitle-text {
    font-family: 'Crimson Text', serif;
    font-size: 24px;
    font-style: italic;
    color: var(--crimson);
    text-shadow: 0 0 20px var(--glow-red);
}

.subtitle-divider {
    width: 60px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--blood-red), transparent);
    box-shadow: 0 0 10px var(--glow-red);
}

.subtitle-location {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--text-muted);
}

.hero-description {
    margin-bottom: 50px;
    opacity: 0;
    animation: fadeIn 1s 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.hero-description p {
    font-size: 18px;
    color: var(--text-muted);
    font-weight: 300;
    letter-spacing: 0.5px;
}

.hero-cta {
    opacity: 0;
    animation: fadeIn 1s 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    display: flex;
    justify-content: center;
    margin-bottom: 120px;
}

.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    padding: 20px 40px;
    background: linear-gradient(135deg, var(--dark-crimson), var(--blood-red));
    color: var(--text-primary);
    border: 1px solid var(--crimson);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 30px rgba(139, 0, 0, 0.5);
}

.btn-primary::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: radial-gradient(circle, var(--crimson), transparent);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
    border-radius: 50%;
}

.btn-primary:hover::before {
    width: 300px;
    height: 300px;
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 40px rgba(220, 20, 60, 0.6);
    border-color: var(--text-blood);
}

.btn-arrow {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-primary:hover .btn-arrow {
    transform: translateX(5px);
}

.scroll-indicator {
    position: fixed;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    opacity: 0;
    animation: fadeIn 1s 1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    cursor: pointer;
    z-index: 10;
}

.scroll-indicator:hover .scroll-arrow {
    animation-play-state: paused;
    transform: translateY(5px);
}

.scroll-text {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--crimson);
    text-shadow: 0 0 10px var(--glow-red);
    opacity: 0.7;
}

.scroll-arrow {
    width: 24px;
    height: 24px;
    color: var(--crimson);
    filter: drop-shadow(0 0 8px var(--glow-red));
    animation: bounceArrow 1.5s ease-in-out infinite;
}

.scroll-arrow svg {
    width: 100%;
    height: 100%;
    display: block;
}

@keyframes bounceArrow {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(8px);
    }
}

/* Old scroll-line kept for fallback */
.scroll-line {
    display: none;
}

.scroll-line::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--crimson);
    animation: scrollLine 2s ease-in-out infinite;
}

@keyframes scrollLine {
    to {
        left: 100%;
    }
}

/* Section Styles */
section {
    padding: 120px 0;
    position: relative;
}

.section-header {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 80px;
}

.section-number {
    font-size: 14px;
    font-weight: 500;
    color: var(--crimson);
    letter-spacing: 2px;
    text-shadow: 0 0 10px var(--glow-red);
}

.section-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(36px, 5vw, 60px);
    font-weight: 400;
    letter-spacing: -0.02em;
    background: linear-gradient(90deg, var(--text-primary), var(--crimson));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* About Section */
.about {
    background: linear-gradient(180deg, var(--vampire-black) 0%, var(--shadow-red) 50%, var(--vampire-black) 100%);
    position: relative;
}

.about::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--blood-red), transparent);
    box-shadow: 0 0 20px var(--glow-red);
}

.about-content {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 60px;
    align-items: center;
}

@media (max-width: 1024px) {
    .about-content {
        grid-template-columns: 1fr;
        gap: 60px;
    }
}

.lead-text {
    font-family: 'Crimson Text', serif;
    font-size: 28px;
    line-height: 1.4;
    margin-bottom: 40px;
    color: var(--text-primary);
}

.about-details p {
    font-size: 16px;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 24px;
}

.about-quote {
    margin-top: 60px;
    padding-left: 40px;
    border-left: 2px solid var(--blood-red);
    box-shadow: -5px 0 20px rgba(139, 0, 0, 0.3);
}

.about-quote blockquote {
    font-family: 'Crimson Text', serif;
    font-size: 20px;
    font-style: italic;
    line-height: 1.6;
    color: var(--crimson);
    margin-bottom: 20px;
    text-shadow: 0 0 15px rgba(220, 20, 60, 0.5);
}

.about-quote cite {
    font-size: 14px;
    color: var(--text-muted);
    font-style: normal;
}

.image-frame {
    position: relative;
    width: 100%;
    max-width: 350px;
    height: auto;
    margin: 0 auto;
    overflow: hidden;
    box-shadow: 0 0 50px rgba(139, 0, 0, 0.5);
}

.author-photo {
    width: 100%;
    height: auto;
    display: block;
}

.image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, transparent 50%, rgba(139, 0, 0, 0.3) 100%);
    mix-blend-mode: multiply;
}

/* Works Section */
.works {
    background: var(--vampire-black);
}

.works-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 60px;
}

@media (max-width: 1024px) {
    .works-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .works-grid {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }
}

.work-item {
    display: flex;
    gap: 40px;
    padding: 30px;
    padding-top: 40px;
    background: linear-gradient(135deg, var(--shadow-red), var(--vampire-black));
    border: 1px solid var(--border-blood);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: visible;
    box-shadow: 0 4px 30px rgba(139, 0, 0, 0.2);
    margin-bottom: 30px;
}

.work-item::before {
    content: attr(data-year);
    position: absolute;
    top: -10px;
    left: 210px; /* Position after book cover */
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-muted);
    background: var(--vampire-black);
    padding: 4px 10px;
    border-radius: 12px;
    border: 1px solid var(--border-blood);
    z-index: 10;
}

.work-item::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(220, 20, 60, 0.1), transparent 50%);
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}

.work-item:hover {
    transform: translateY(-5px);
    border-color: var(--crimson);
    box-shadow: 0 8px 40px rgba(220, 20, 60, 0.4);
}

.work-item:hover::after {
    opacity: 1;
}

.work-image {
    position: relative;
    overflow: hidden;
    width: 200px;
    height: 300px;
    border: 1px solid var(--border-blood);
    flex-shrink: 0;
}

.book-cover {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #000;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.work-item:hover .book-cover {
    transform: scale(1.1);
}

.work-rating {
    color: var(--crimson);
    font-size: 14px;
    margin-bottom: 20px;
    text-shadow: 0 0 10px var(--glow-red);
}

.work-quotes {
    margin: 20px 0;
    padding: 15px;
    border-left: 2px solid var(--blood-red);
    background: rgba(139, 0, 0, 0.1);
}

.work-quotes p {
    font-style: italic;
    color: var(--text-muted);
    margin-bottom: 10px;
}

.work-quotes p:last-child {
    margin-bottom: 0;
}

.work-item.upcoming::before {
    display: none; /* Hide year for upcoming books */
}

.coming-soon-badge {
    position: absolute;
    top: -10px;
    right: 20px;
    background: var(--blood-red);
    color: var(--text-primary);
    padding: 6px 14px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 4px 20px rgba(139, 0, 0, 0.5);
    border-radius: 12px;
    z-index: 15;
}

.work-link.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    color: var(--text-muted);
}

/* Reviews Section */
.reviews {
    background: linear-gradient(180deg, var(--vampire-black) 0%, rgba(77, 0, 0, 0.2) 50%, var(--vampire-black) 100%);
    padding: 120px 0;
    position: relative;
}

.reviews::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--blood-red), transparent);
    box-shadow: 0 0 20px var(--glow-red);
}

.reviews-container {
    position: relative;
    margin: 60px 0 100px;
    overflow: hidden;
}

.reviews-grid {
    display: flex;
    gap: 40px;
    overflow-x: auto;
    padding: 40px 60px 60px;
    scroll-snap-type: x mandatory;
    background: linear-gradient(90deg, transparent, rgba(139, 0, 0, 0.02), transparent);
    border-radius: 20px;
    position: relative;
    scroll-behavior: smooth;
}

.review-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(139, 0, 0, 0.8);
    border: 2px solid var(--crimson);
    color: var(--accent-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 100;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.review-arrow:hover {
    background: var(--crimson);
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 0 30px rgba(139, 0, 0, 0.8);
}

.review-arrow-left {
    left: 20px;
}

.review-arrow-right {
    right: 20px;
}

.reviews-grid::before {
    content: '❝';
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 80px;
    color: var(--crimson);
    opacity: 0.3;
    font-family: 'Playfair Display', serif;
}

.reviews-grid::-webkit-scrollbar {
    height: 4px;
}

.reviews-grid::-webkit-scrollbar-track {
    background: rgba(139, 0, 0, 0.05);
    border-radius: 2px;
}

.reviews-grid::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, var(--crimson), var(--blood-red));
    border-radius: 2px;
}

.reviews-grid::-webkit-scrollbar-thumb:hover {
    background: var(--blood-red);
}

.review-card {
    background: linear-gradient(145deg, rgba(0, 0, 0, 0.95), rgba(20, 0, 0, 0.85));
    border: 1px solid rgba(139, 0, 0, 0.2);
    border-radius: 15px;
    padding: 55px 40px 45px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    backdrop-filter: blur(20px);
    flex: 0 0 420px;
    min-width: 420px;
    scroll-snap-align: center;
    box-shadow: 
        0 10px 40px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(139, 0, 0, 0.3);
    overflow: visible;
}

.review-card::before {
    content: '★★★★★';
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 20px;
    color: var(--accent-gold);
    opacity: 0.8;
    letter-spacing: 5px;
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.5);
}

.review-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(220, 20, 60, 0.05), transparent 60%);
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}

.review-card:hover::after {
    opacity: 1;
}

.review-card:hover {
    transform: translateY(-12px) scale(1.02);
    box-shadow: 
        0 25px 70px rgba(139, 0, 0, 0.4),
        0 15px 35px rgba(0, 0, 0, 0.8),
        inset 0 1px 0 rgba(212, 175, 55, 0.2);
    border-color: var(--accent-gold);
}

.review-card:hover::before {
    animation: sparkle 1s ease-in-out;
}

@keyframes sparkle {
    0%, 100% { opacity: 0.8; transform: translateX(-50%) scale(1); }
    50% { opacity: 1; transform: translateX(-50%) scale(1.1); }
}

.review-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(139, 0, 0, 0.2);
}

.reviewer-name {
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--accent-gold);
    letter-spacing: 0.5px;
    text-shadow: 0 2px 10px rgba(212, 175, 55, 0.3);
    position: relative;
    z-index: 10;
}

.review-stars {
    color: var(--crimson);
    font-size: 16px;
    text-shadow: 0 0 15px var(--glow-red);
    letter-spacing: 2px;
}

.review-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #fff;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
    letter-spacing: 0.5px;
    line-height: 1.4;
}

.review-text {
    font-size: 16px;
    line-height: 1.9;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 25px;
    text-align: center;
    font-family: 'Crimson Text', serif;
    font-style: italic;
    padding: 0 10px;
}

.review-book {
    display: inline-flex;
    align-items: center;
    padding: 10px 24px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15), rgba(139, 0, 0, 0.15));
    border: 1px solid rgba(212, 175, 55, 0.4);
    border-radius: 25px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
}

.review-book:hover {
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.3), rgba(220, 20, 60, 0.2));
    transform: scale(1.05);
    box-shadow: 0 5px 20px rgba(220, 20, 60, 0.3);
}

.work-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
    position: relative;
}

.work-category {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--crimson);
    margin-bottom: 20px;
    margin-top: 0;
    padding-top: 5px;
    text-shadow: 0 0 10px var(--glow-red);
    display: block;
}

.work-title {
    font-family: 'Playfair Display', serif;
    font-size: 32px;
    font-weight: 400;
    margin-bottom: 20px;
    letter-spacing: -0.02em;
    background: linear-gradient(180deg, var(--text-primary), var(--crimson));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.work-description {
    font-size: 15px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 30px;
}

.work-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--crimson);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-shadow: 0 0 10px var(--glow-red);
}

.work-link:hover {
    gap: 15px;
    color: var(--text-blood);
}

/* Praise Section */
.praise {
    background: linear-gradient(180deg, var(--vampire-black) 0%, var(--dark-crimson) 50%, var(--vampire-black) 100%);
    padding: 160px 0;
    position: relative;
}

.praise::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(139, 0, 0, 0.1), transparent);
    animation: pulse 4s ease-in-out infinite;
}

@keyframes pulse {
    0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; }
    50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0.3; }
}

.praise-content {
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 10;
}

.praise-quote {
    position: relative;
}

.quote-mark {
    margin-bottom: 40px;
    opacity: 0.2;
    filter: drop-shadow(0 0 20px var(--crimson));
}

.praise-quote blockquote {
    font-family: 'Crimson Text', serif;
    font-size: 32px;
    line-height: 1.5;
    font-style: italic;
    margin-bottom: 40px;
    color: var(--text-primary);
    text-shadow: 0 0 30px rgba(220, 20, 60, 0.3);
}

.praise-quote cite {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cite-name {
    font-size: 16px;
    font-weight: 500;
    color: var(--crimson);
    text-shadow: 0 0 15px var(--glow-red);
}

.cite-title {
    font-size: 14px;
    color: var(--text-muted);
}

/* Form Takeover Effect */
.form-takeover {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: all;
    overflow: hidden;
}

.form-takeover.active {
    opacity: 1;
    animation: bloodPulse 2s ease-in-out infinite;
}

.form-takeover.fade-out {
    opacity: 0;
    transition: opacity 1s ease;
}

@keyframes bloodPulse {
    0%, 100% {
        background: linear-gradient(135deg, #000 0%, #1a0000 50%, #000 100%);
    }
    50% {
        background: linear-gradient(135deg, #000 0%, #8b0000 50%, #000 100%);
    }
}

.takeover-blood {
    position: absolute;
    top: -50%;
    left: 0;
    right: 0;
    height: 150%;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M0,50 Q25,20 50,50 T100,50 L100,100 L0,100 Z' fill='%238b0000' opacity='0.3'/%3E%3C/svg%3E");
    background-size: 200% 100%;
    animation: bloodDrip 3s ease-in-out infinite;
}

@keyframes bloodDrip {
    0% { transform: translateY(-100%); }
    50% { transform: translateY(0); }
    100% { transform: translateY(-100%); }
}

.takeover-content {
    position: relative;
    z-index: 10;
    text-align: center;
    animation: fadeInScale 1s ease-out;
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.5);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.takeover-text {
    font-family: 'Playfair Display', serif;
    font-size: clamp(2rem, 8vw, 6rem);
    font-weight: 900;
    color: #8b0000;
    text-shadow: 
        0 0 20px rgba(139, 0, 0, 0.8),
        0 0 40px rgba(139, 0, 0, 0.6),
        0 0 60px rgba(139, 0, 0, 0.4),
        0 0 80px rgba(139, 0, 0, 0.2);
    letter-spacing: 0.1em;
    margin: 0;
    animation: textGlitch 3s ease-in-out infinite;
}

@keyframes textGlitch {
    0%, 100% { 
        text-shadow: 
            0 0 20px rgba(139, 0, 0, 0.8),
            0 0 40px rgba(139, 0, 0, 0.6),
            0 0 60px rgba(139, 0, 0, 0.4),
            0 0 80px rgba(139, 0, 0, 0.2);
    }
    25% {
        text-shadow: 
            -2px 0 20px rgba(255, 0, 0, 0.8),
            2px 0 40px rgba(139, 0, 0, 0.6),
            0 0 60px rgba(139, 0, 0, 0.4),
            0 0 80px rgba(139, 0, 0, 0.2);
        transform: translateX(-2px);
    }
    75% {
        text-shadow: 
            2px 0 20px rgba(255, 0, 0, 0.8),
            -2px 0 40px rgba(139, 0, 0, 0.6),
            0 0 60px rgba(139, 0, 0, 0.4),
            0 0 80px rgba(139, 0, 0, 0.2);
        transform: translateX(2px);
    }
}

.takeover-subtext {
    font-family: 'Crimson Text', serif;
    font-size: clamp(1rem, 3vw, 1.5rem);
    color: rgba(139, 0, 0, 0.7);
    margin-top: 20px;
    font-style: italic;
    animation: fadeIn 2s ease-out 0.5s both;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.takeover-veins {
    position: absolute;
    inset: 0;
    background: 
        repeating-linear-gradient(
            45deg,
            transparent,
            transparent 10px,
            rgba(139, 0, 0, 0.05) 10px,
            rgba(139, 0, 0, 0.05) 20px
        ),
        repeating-linear-gradient(
            -45deg,
            transparent,
            transparent 10px,
            rgba(139, 0, 0, 0.05) 10px,
            rgba(139, 0, 0, 0.05) 20px
        );
    animation: veinsMove 10s linear infinite;
}

@keyframes veinsMove {
    0% { transform: translate(0, 0); }
    100% { transform: translate(20px, 20px); }
}

/* Form Messages */
.form-message {
    padding: 15px 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    animation: slideDown 0.5s ease;
}

.form-message.success {
    background: rgba(212, 175, 55, 0.1);
    border: 1px solid var(--accent-gold);
    color: var(--accent-gold);
}

.form-message.error {
    background: rgba(139, 0, 0, 0.1);
    border: 1px solid var(--blood-red);
    color: var(--crimson);
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Contact Section */
.contact {
    background: var(--vampire-black);
    border-top: 1px solid var(--border-blood);
}

.contact-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px;
}

@media (max-width: 1024px) {
    .contact-content {
        grid-template-columns: 1fr;
        gap: 60px;
    }
}

.contact-heading {
    font-family: 'Playfair Display', serif;
    font-size: 36px;
    margin-bottom: 20px;
    background: linear-gradient(90deg, var(--text-primary), var(--crimson));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.contact-text {
    font-size: 16px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 40px;
}

.contact-links {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.contact-link {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--text-primary);
    text-decoration: none;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 20px;
    background: linear-gradient(135deg, transparent, rgba(139, 0, 0, 0.1));
    border-left: 2px solid var(--blood-red);
}

.contact-link:hover {
    transform: translateX(10px);
    background: linear-gradient(135deg, transparent, rgba(220, 20, 60, 0.2));
    box-shadow: 0 0 30px rgba(220, 20, 60, 0.3);
}

.link-label {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--crimson);
    text-shadow: 0 0 10px var(--glow-red);
}

.link-value {
    font-size: 18px;
}

/* Form Styles */
.form {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.form-group {
    position: relative;
}

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 20px 0;
    background: transparent;
    border: none;
    border-bottom: 2px solid var(--border-blood);
    color: var(--text-primary);
    font-size: 16px;
    font-family: inherit;
    transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.form-group input:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--crimson);
    box-shadow: 0 2px 20px rgba(220, 20, 60, 0.3);
}

.form-group label {
    position: absolute;
    top: 20px;
    left: 0;
    color: var(--text-muted);
    font-size: 16px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.form-group input:focus ~ label,
.form-group input:valid ~ label,
.form-group textarea:focus ~ label,
.form-group textarea:valid ~ label {
    top: -10px;
    font-size: 12px;
    color: var(--crimson);
    text-shadow: 0 0 10px var(--glow-red);
}

.btn-submit {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    padding: 20px 40px;
    background: linear-gradient(135deg, var(--blood-red), var(--dark-crimson));
    color: var(--text-primary);
    border: 2px solid var(--crimson);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    align-self: flex-start;
    box-shadow: 0 4px 30px rgba(220, 20, 60, 0.4);
}

.btn-submit:hover {
    background: linear-gradient(135deg, var(--crimson), var(--blood-red));
    gap: 20px;
    transform: translateY(-2px);
    box-shadow: 0 8px 40px rgba(220, 20, 60, 0.6);
}

/* News Section */
.news {
    padding: 120px 0;
    position: relative;
    z-index: 10;
}

.news-content {
    margin-top: 60px;
}

.news-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 30px;
}

.news-card {
    background: linear-gradient(135deg, rgba(20, 0, 0, 0.95), rgba(40, 0, 0, 0.85));
    border: 1px solid var(--border-blood);
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
}

.news-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--crimson), transparent);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.news-card:hover {
    transform: translateY(-5px);
    border-color: var(--crimson);
    box-shadow: 0 10px 40px rgba(139, 0, 0, 0.3);
}

.news-card:hover::before {
    opacity: 1;
}

.news-image {
    width: 100%;
    height: 200px;
    overflow: hidden;
    position: relative;
}

.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.news-card:hover .news-image img {
    transform: scale(1.05);
}

.news-body {
    padding: 25px;
}

.news-date {
    display: inline-block;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--crimson);
    margin-bottom: 10px;
    opacity: 0.8;
}

.news-title {
    font-family: 'Playfair Display', serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 15px;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-excerpt {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--crimson);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
}

.news-link:hover {
    color: var(--text-primary);
    gap: 12px;
}

.news-link .link-arrow {
    transition: transform 0.3s ease;
}

.news-link:hover .link-arrow {
    transform: translate(2px, -2px);
}

.news-empty {
    text-align: center;
    padding: 60px 20px;
    background: linear-gradient(135deg, rgba(20, 0, 0, 0.95), rgba(40, 0, 0, 0.85));
    border: 1px solid var(--border-blood);
    border-radius: 8px;
}

.news-empty p {
    font-size: 18px;
    color: var(--text-secondary);
    margin-bottom: 15px;
}

.news-empty a {
    color: var(--crimson);
    text-decoration: none;
    transition: color 0.3s ease;
}

.news-empty a:hover {
    color: var(--text-primary);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .news-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .news-card {
        max-width: 100%;
    }
}

/* Footer */
.footer {
    padding: 60px 0;
    border-top: 1px solid var(--border-blood);
    background: linear-gradient(180deg, var(--vampire-black), var(--shadow-red));
}

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

@media (max-width: 768px) {
    .footer-content {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }
}

.copyright {
    font-size: 14px;
    color: var(--text-muted);
}

.footer-tagline {
    font-size: 14px;
    font-style: italic;
    color: var(--crimson);
    text-shadow: 0 0 15px var(--glow-red);
}

/* Custom cursor styles removed - using default cursor */

/* ========== MOBILE OPTIMIZATIONS ========== */

/* Prevent scroll when menu is open */
body.menu-open {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
}

/* Hamburger Menu Styles */
.hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 1001;
    padding: 0;
}

.hamburger span {
    display: block;
    width: 25px;
    height: 2px;
    background: var(--crimson);
    margin: 4px 0;
    transition: all 0.3s ease;
}

.hamburger.active span {
    background: var(--text-primary);
}

.hamburger.active span:nth-child(1) {
    transform: rotate(45deg) translateY(10px);
}

.hamburger.active span:nth-child(2) {
    opacity: 0;
}

.hamburger.active span:nth-child(3) {
    transform: rotate(-45deg) translateY(-10px);
}

/* Tablet Styles */
@media (max-width: 1024px) {
    .trees-left,
    .trees-right {
        display: none;
    }
}

/* Mobile Styles - 768px and below */
@media (max-width: 768px) {
    /* Navigation Mobile */
    .navigation {
        padding: 15px 0;
    }
    
    .nav-container {
        padding: 0 20px;
    }
    
    .nav-logo .logo-image {
        height: 50px !important;
        max-height: 50px !important;
    }
    
    .hamburger {
        display: flex;
    }
    
    .nav-links {
        display: flex;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100vh;
        background: 
            radial-gradient(ellipse at center, rgba(139, 0, 0, 0.8) 0%, rgba(0, 0, 0, 1) 50%),
            rgba(0, 0, 0, 0.95);
        backdrop-filter: blur(80px) brightness(0.3) saturate(200%);
        -webkit-backdrop-filter: blur(80px) brightness(0.3) saturate(200%);
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 40px;
        z-index: 999;
        opacity: 0;
        visibility: hidden;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        overflow: hidden;
    }
    
    /* Fog effect overlay */
    .nav-links::before {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: url("data:image/svg+xml,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='fog'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.01' numOctaves='2' /%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23fog)' opacity='0.3'/%3E%3C/svg%3E");
        animation: fogMove 20s ease-in-out infinite;
        opacity: 0.5;
        pointer-events: none;
    }
    
    @keyframes fogMove {
        0%, 100% { transform: translate(0, 0) scale(1); }
        33% { transform: translate(-30px, -20px) scale(1.1); }
        66% { transform: translate(20px, -30px) scale(0.9); }
    }
    
    .nav-links.active {
        opacity: 1;
        visibility: visible;
    }
    
    .nav-links li {
        opacity: 0;
        transform: translateY(30px);
        animation: none;
    }
    
    .nav-links.active li {
        animation: creepyFadeIn 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }
    
    .nav-links.active li:nth-child(1) { animation-delay: 0.1s; }
    .nav-links.active li:nth-child(2) { animation-delay: 0.2s; }
    .nav-links.active li:nth-child(3) { animation-delay: 0.3s; }
    .nav-links.active li:nth-child(4) { animation-delay: 0.4s; }
    .nav-links.active li:nth-child(5) { animation-delay: 0.5s; }
    
    @keyframes creepyFadeIn {
        0% {
            opacity: 0;
            transform: translateY(30px) scale(0.8);
            filter: blur(10px);
        }
        50% {
            filter: blur(5px);
        }
        100% {
            opacity: 1;
            transform: translateY(0) scale(1);
            filter: blur(0);
        }
    }
    
    .nav-links a {
        font-size: 28px;
        padding: 15px 30px;
        color: var(--text-primary);
        text-transform: uppercase;
        letter-spacing: 3px;
        font-family: 'Playfair Display', serif;
        font-weight: 700;
        position: relative;
        transition: all 0.3s ease;
        text-shadow: 0 0 20px rgba(139, 0, 0, 0);
    }
    
    .nav-links a::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 2px;
        background: linear-gradient(90deg, transparent, var(--crimson), transparent);
        transform: scaleX(0);
        transition: transform 0.3s ease;
    }
    
    .nav-links a:hover {
        color: var(--crimson);
        text-shadow: 0 0 30px var(--glow-red),
                     0 0 60px var(--glow-red);
        transform: scale(1.1);
    }
    
    .nav-links a:hover::before {
        transform: scaleX(1);
    }
    
    /* Update hamburger z-index to be above menu */
    .hamburger {
        z-index: 1001;
    }
    
    .hamburger.active {
        position: fixed;
        right: 20px;
    }
    
    /* Hero Section Mobile */
    .hero {
        min-height: 100vh;
        padding: 70px 0 20px;
    }
    
    .hero-content {
        padding: 0 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: calc(100vh - 80px);
        position: relative;
    }
    
    .hero-text {
        width: 100%;
        text-align: center;
    }
    
    .hero-title {
        margin-bottom: 30px;
        text-align: center;
    }
    
    .title-line {
        font-size: clamp(65px, 13vw, 75px);
        letter-spacing: -1px;
        display: block;
        text-align: center;
    }
    
    .title-line:first-child {
        white-space: nowrap;
        font-size: clamp(65px, 13vw, 75px);
    }
    
    .title-line:last-child {
        font-size: clamp(65px, 13vw, 75px);
    }
    
    .hero-subtitle {
        flex-direction: column;
        gap: 10px;
        margin-bottom: 30px;
    }
    
    .subtitle-text {
        font-size: 14px;
        letter-spacing: 1px;
        text-align: center;
        white-space: normal;
    }
    
    .subtitle-divider {
        width: 40px;
        height: 1px;
        margin: 10px auto;
    }
    
    .subtitle-location {
        font-size: 12px;
    }
    
    .hero-cta {
        margin-bottom: 20px;
        width: 100%;
        display: flex;
        justify-content: center;
    }
    
    .btn-primary {
        padding: 12px 24px;
        font-size: 14px;
    }
    
    .scroll-indicator {
        position: fixed;
        bottom: 15px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 5;
    }
    
    /* Container adjustments */
    .container {
        padding: 0 20px;
        width: 100%;
        box-sizing: border-box;
    }
    
    /* About Section Mobile */
    .about {
        padding: 60px 0;
    }
    
    .about-content {
        flex-direction: column;
        gap: 40px;
    }
    
    .about-text {
        max-width: 100%;
        padding-right: 0;
    }
    
    .about-image {
        max-width: 300px;
        margin: 0 auto;
    }
    
    .author-photo {
        max-width: 100%;
        height: auto;
    }
    
    /* Works Section Mobile */
    .works {
        padding: 60px 0;
    }
    
    .works-grid {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
        padding: 0;
    }
    
    .work-item {
        flex-direction: column !important;
        gap: 20px !important;
        padding: 20px !important;
        max-width: 100%;
    }
    
    .work-image {
        width: 100% !important;
        min-width: 100% !important;
        height: 250px !important;
    }
    
    .work-content {
        width: 100% !important;
    }
    
    .work-meta {
        flex-wrap: wrap;
        gap: 10px;
    }
    
    /* Reviews Section Mobile */
    .reviews {
        padding: 60px 0;
    }
    
    .reviews-container {
        margin: 40px 0 60px;
        position: relative;
    }
    
    .review-arrow {
        width: 35px;
        height: 35px;
        background: rgba(139, 0, 0, 0.95);
        top: auto;
        bottom: -50px;
        border: 1px solid var(--crimson);
        box-shadow: 0 4px 20px rgba(139, 0, 0, 0.5);
    }
    
    .review-arrow-left {
        left: calc(50% - 50px);
    }
    
    .review-arrow-right {
        right: calc(50% - 50px);
    }
    
    .reviews-track {
        padding: 0 20px;
        margin-bottom: 70px;
    }
    
    .review-card {
        padding: 25px 20px 30px;
    }
    
    .review-card .review-author {
        margin-bottom: 60px;
    }
    
    /* News Section Mobile */
    .news {
        padding: 60px 0;
    }
    
    .news-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .news-card {
        max-width: 100%;
    }
    
    /* Contact Section Mobile */
    .contact {
        padding: 60px 0;
    }
    
    .contact-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .contact-form {
        max-width: 100%;
    }
    
    /* Footer Mobile */
    .footer {
        padding: 40px 0;
    }
    
    .footer-content {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
    
    /* Section Headers Mobile */
    .section-header {
        margin-bottom: 40px;
    }
    
    .section-number {
        font-size: 60px;
    }
    
    .section-title {
        font-size: clamp(32px, 8vw, 48px);
    }
    
    /* Typography adjustments */
    .lead-text {
        font-size: 18px;
        line-height: 1.6;
    }
    
    .work-title {
        font-size: 22px;
    }
    
    .work-description {
        font-size: 14px;
    }
    
    /* Remove horizontal scroll */
    body {
        overflow-x: hidden;
    }
    
    .main-content {
        overflow-x: hidden;
    }
}

/* Extra small devices */
@media (max-width: 480px) {
    .title-line {
        font-size: clamp(55px, 14vw, 70px) !important;
    }
    
    .title-line:first-child {
        font-size: clamp(55px, 14vw, 70px) !important;
    }
    
    .title-line:last-child {
        font-size: clamp(58px, 15vw, 72px) !important;
    }
    
    .hero-subtitle {
        font-size: 12px;
    }
    
    .section-title {
        font-size: 28px;
    }
    
    .review-arrow {
        width: 35px;
        height: 35px;
    }
    
    .reviews-track {
        padding: 0 50px;
    }
}