
        /* Vita Style Modern Hero */
        .vita-hero-container {
            background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 50%, #dee2e6 100%);
            position: relative;
            overflow: hidden;
            min-height: 100vh;
        }
        
        /* Hero Overlay for Text Readability */
        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(
                135deg,
                rgba(0, 0, 0, 0.4) 0%,
                rgba(0, 0, 0, 0.2) 40%,
                rgba(0, 0, 0, 0.1) 70%,
                transparent 100%
            );
            z-index: 5;
        }
        
        .vita-hero-content {
            position: absolute;
            /* center horizontally and vertically */
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            text-align: center;
            /* Allow more horizontal room so long titles can breathe */
            max-width: 820px;
            width: 86%;
            z-index: 15;
            
            /* Make content box fully transparent so background (image/video) is visible */
            background: transparent !important;
            /* remove backdrop-filter so underlying media is clear */
            backdrop-filter: none !important;
            padding: 2.5rem 2.5rem;
            border-radius: 15px;
            border: none;
            box-shadow: none;
        }
        
        .vita-outline-title {
            font-family: 'Poppins', sans-serif;
            font-weight: 900;
            font-size: clamp(2.6rem, 6.2vw, 4.6rem);
            /* slightly more line-height so stacked words don't look squished */
            line-height: 1.02;
            margin-bottom: 1.4rem;
            letter-spacing: -0.02em;
            -webkit-text-stroke: 2px;
            -webkit-text-fill-color: transparent;
            filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.5));
            animation: colorChange 3s infinite;
            text-transform: uppercase;
            word-break: break-word;
        }
  
        @keyframes colorChange {
            0% { -webkit-text-stroke-color: #ff6b6b; }
            25% { -webkit-text-stroke-color: #4ecdc4; }
            50% { -webkit-text-stroke-color: #45b7d1; }
            75% { -webkit-text-stroke-color: #96ceb4; }
            100% { -webkit-text-stroke-color: #ffeaa7; }
        }
        
        .vita-subtitle {
            font-family: 'Inter', sans-serif;
            font-weight: 400;
            font-size: clamp(1rem, 1.6vw, 1.25rem);
            color: #ffffff;
            /* a touch more breathing room between lines */
            line-height: 1.7;
            margin-bottom: 1.8rem;
            text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
        }
        
        .vita-button {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 15px 35px;
            border: none;
            border-radius: 50px;
            font-family: 'Inter', sans-serif;
            font-weight: 600;
            font-size: 1.1rem;
            text-decoration: none;
            transition: all 0.3s ease;
            display: inline-block;
            box-shadow: 0 8px 20px rgba(102, 126, 234, 0.3);
        }
        
        .vita-button:hover {
            transform: translateY(-2px);
            box-shadow: 0 15px 30px rgba(102, 126, 234, 0.4);
            color: white;
        }
        
        .scroll-down-circle {
            position: absolute;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            width: 80px;
            height: 40px;
            border: 3px solid #495057;
            border-top: none;
            border-bottom-left-radius: 40px;
            border-bottom-right-radius: 40px;
            cursor: pointer;
            transition: all 0.3s ease;
            z-index: 25;
            background: transparent;
        }
        
        .scroll-down-circle:hover {
            border-color: #ff6b6b;
            background: rgba(255, 107, 107, 0.1);
            transform: translateX(-50%) scale(1.1);
        }
        
        .scroll-down-circle::after {
            content: '↓';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -30%);
            font-size: 20px;
            color: #495057;
            transition: color 0.3s ease;
        }
        
        .scroll-down-circle:hover::after {
            color: #ff6b6b;
        }
        
        /* Küçük ekranlar için optimize edilmiş neşeli surat */
        @media (max-width: 768px) {
            .scroll-down-circle {
                width: 60px;
                height: 30px;
                bottom: 100px;
                border-width: 2px;
            }
            
            .scroll-down-circle::after {
                font-size: 16px;
                transform: translate(-50%, -40%);
            }
            
            .vita-hero-content {
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                
                max-width: 94%;
                width: calc(100% - 40px);
                padding: 1.5rem 1rem;
                border-radius: 12px;
                background: transparent !important;
                backdrop-filter: none !important;
                border: none;
                box-shadow: none;
            }

            .vita-outline-title {
                font-size: clamp(2rem, 8vw, 3.2rem);
                margin-bottom: 1rem;
                line-height: 1.04;
            }

            .vita-subtitle {
                font-size: clamp(0.95rem, 3vw, 1.15rem);
                margin-bottom: 1.3rem;
                line-height: 1.6;
            }
        }

        
        .hero-modern,
        .carousel-item {
            min-height: 100vh !important;
            height: 100vh !important;
        }
        
        /* Modern Minimal Carousel Kontrol Butonları */
        .carousel-control-prev,
        .carousel-control-next {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            z-index: 20 !important;
            width: 40px;
            height: 40px;
            background: rgba(255, 255, 255, 0.15) !important;
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.2);
            border-radius: 8px;
            opacity: 0.6;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        }
        
        .carousel-control-prev {
            left: 20px;
        }
        
        .carousel-control-next {
            right: 20px;
        }
        
        .carousel-control-prev:hover,
        .carousel-control-next:hover {
            background: rgba(255, 255, 255, 0.25) !important;
            border-color: rgba(255, 255, 255, 0.4);
            opacity: 1;
            transform: translateY(-50%) scale(1.05);
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
        }
        
        /* Modern Minimal Mobil Carousel Butonları */
        @media (max-width: 768px) {
            .carousel-control-prev,
            .carousel-control-next {
                width: 36px;
                height: 36px;
                top: auto;
                bottom: 130px;
                transform: none;
                border-radius: 6px;
                background: rgba(255, 255, 255, 0.1) !important;
                backdrop-filter: blur(15px);
                border: 1px solid rgba(255, 255, 255, 0.15);
            }
            
            .carousel-control-prev {
                left: 50%;
                margin-left: -55px;
            }
            
            .carousel-control-next {
                right: 50%;
                margin-right: -55px;
            }
            
            .carousel-control-prev:hover,
            .carousel-control-next:hover {
                transform: scale(1.05);
                background: rgba(255, 255, 255, 0.2) !important;
                border-color: rgba(255, 255, 255, 0.3);
            }
        }
        
        .carousel-control-prev-icon,
        .carousel-control-next-icon {
            width: 16px;
            height: 16px;
            background-size: 100% 100%;
        }
        
        .carousel-control-prev-icon {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e") !important;
        }
        
        .carousel-control-next-icon {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='m4.646 1.646 6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L9.293 8 3.646 2.354a.5.5 0 1 1 .708-.708z'/%3e%3c/svg%3e") !important;
        }
    
.hero-title-mobile { display: none; }
@media (max-width: 768px) { .hero-title-desktop { display: none; } .hero-title-mobile { display: block; } }
