/** Footer **/
        .hfooter {
            position: relative;
            background: linear-gradient(135deg, #1a2332 0%, #1e2838 50%, #1a2332 100%);
        }
        
        .hfooter::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: radial-gradient(circle at 20% 50%, rgba(93, 122, 188, 0.03) 0%, transparent 50%),
                        radial-gradient(circle at 80% 50%, rgba(197, 38, 58, 0.03) 0%, transparent 50%);
            pointer-events: none;
        }
        
        .hfooter .hmenu-item {
            position: relative;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .hfooter .hmenu-item:hover {
            transform: translateX(4px);
            text-shadow: 0 0 8px rgba(255, 255, 255, 0.3);
        }
        
        .hfooter .hmenu-item::before {
            content: '';
            position: absolute;
            left: -6px;
            top: 50%;
            transform: translateY(-50%) scaleY(0);
            width: 2px;
            height: 100%;
            background: linear-gradient(to bottom, transparent, currentColor, transparent);
            transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 0 8px currentColor;
        }
        
        .hfooter .hmenu-item:hover::before {
            transform: translateY(-50%) scaleY(1);
        }
        
        .hfooter .hmenu-item:hover .hmenu-icon {
            transform: scale(1.15) translateX(-2px);
            filter: drop-shadow(0 0 4px currentColor);
        }
        
        .hfooter .hmenu-icon {
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .hfooter .htoggle-button {
            position: relative;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            overflow: hidden;
        }
        
        .hfooter .htoggle-button::after {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0;
            height: 0;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.1);
            transform: translate(-50%, -50%);
            transition: width 0.6s, height 0.6s;
        }
        
        .hfooter .htoggle-button:hover::after {
            width: 300px;
            height: 300px;
        }
        
        .hfooter .htoggle-button:hover {
            background: rgba(255, 255, 255, 0.05);
            padding-left: 0.5rem;
            padding-right: 0.5rem;
            margin-left: -0.5rem;
            margin-right: -0.5rem;
            border-radius: 0.5rem;
        }
        
        .hfooter .htoggle-button:active {
            transform: scale(0.98);
        }
        
        .hfooter .hsocial-icon {
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
        }
        
        .hfooter .hsocial-icon::after {
            content: '';
            position: absolute;
            inset: -2px;
            border-radius: 0.5rem;
            background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.15), transparent);
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        
        .hfooter .hsocial-icon:hover {
            transform: translateY(-3px) scale(1.05);
            box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4), 0 0 12px rgba(255, 255, 255, 0.1);
        }
        
        .hfooter .hsocial-icon:hover::after {
            opacity: 1;
        }
        
        .hfooter .hfooter-link {
            position: relative;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            display: inline-block;
        }
        
        .hfooter .hfooter-link::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            width: 0;
            height: 1px;
            background: currentColor;
            transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 0 4px currentColor;
        }
        
        .hfooter .hfooter-link:hover {
            transform: translateX(2px);
        }
        
        .hfooter .hfooter-link:hover::after {
            width: 100%;
        }
        
        .hfooter .hcompany-info-box {
            position: relative;
            transition: all 0.3s ease;
        }
        
        .hfooter .hcompany-info-box::before {
            content: '';
            position: absolute;
            inset: -1px;
            border-radius: 1rem;
            padding: 1px;
            background: linear-gradient(135deg, rgba(93, 122, 188, 0.3), rgba(197, 38, 58, 0.3));
            -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        
        .hfooter .hcompany-info-box:hover::before {
            opacity: 1;
        }
        
        /* Fixed mobile menu toggle - removed display:none, using only max-height and opacity */
        @media (max-width: 639px) {
            .hfooter .hmenu-list {
                max-height: 0;
                overflow: hidden;
                opacity: 0;
                transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
            }
            
            .hfooter .hmenu-list.active {
                max-height: 500px;
                opacity: 1;
            }
        }
        
        .hfooter .hmenu-title {
            position: relative;
            display: inline-block;
        }
/** Footer Bitis **/

/** Head **/
        @keyframes float {
            0%, 100% { transform: translateY(0px); }
            50% { transform: translateY(-15px); }
        }
        @keyframes fadeIn {
            0% { opacity: 0; transform: translateY(10px); }
            100% { opacity: 1; transform: translateY(0); }
        }
        @keyframes slideIn {
            0% { opacity: 0; transform: translateX(-20px); }
            100% { opacity: 1; transform: translateX(0); }
        }
        
        .animate-float { animation: float 3s ease-in-out infinite; }
        .animate-fadeIn { animation: fadeIn 0.8s ease-out forwards; }
        .animate-slideIn { animation: slideIn 0.6s ease-out forwards; }
        
        /* Native select styling - professional appearance without JavaScript */
        .custom-select {
            appearance: none;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23c5263a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 0.75rem center;
            background-size: 1.25rem;
            padding-right: 2.5rem;
            cursor: pointer;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            font-weight: 600;
            letter-spacing: -0.01em;
        }
        
        .custom-select:hover {
            color: #c5263a;
            background-color: rgba(197, 38, 58, 0.02);
        }
        
        .custom-select:focus {
            outline: none;
            color: #c5263a;
            background-color: rgba(197, 38, 58, 0.04);
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23c5263a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
        }
        
        /* Enhanced option styling for professional dropdown appearance */
        .custom-select option {
            font-weight: 600;
            padding: 1rem 1.25rem;
            background-color: white;
            color: #1f2937;
            font-size: 0.95rem;
            line-height: 1.5;
            border-bottom: 1px solid #f3f4f6;
        }
        
        .custom-select option:hover,
        .custom-select option:focus {
            background-color: rgba(197, 38, 58, 0.1);
            color: #c5263a;
        }
        
        .custom-select option:checked {
            background-color: rgba(197, 38, 58, 0.15);
            color: #c5263a;
            font-weight: 700;
        }
/** Head Bitis **/

        /* Added pulse animation for map dots */
        @keyframes pulse {
            0%, 100% {
                opacity: 1;
                transform: scale(1);
            }
            50% {
                opacity: 0.5;
                transform: scale(1.2);
            }
        }
        
        .map-dot {
            animation: pulse 2s ease-in-out infinite;
        }
        
        /* Hide map dots on very small screens for better mobile experience */
        @media (max-width: 475px) {
            .map-dot {
                width: 8px;
                height: 8px;
            }
        }
		
		/** Partnerler **/
		        .logo-slider {
            overflow: hidden;
            width: 100%;
        }
        
        .logo-track {
            display: flex;
            gap: 3rem;
            transition: transform 0.8s ease-in-out;
        }
        
        .logo-item {
            flex-shrink: 0;
            width: 200px;
        }
		/** Partnerler Bitis **/
		
		       @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        
        @keyframes slideIn {
            from {
                opacity: 0;
                transform: translateX(-20px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }
        
        @keyframes float {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-8px);
            }
        }
        
        @keyframes scroll {
            0% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(8px);
            }
            100% {
                transform: translateY(0);
            }
        }
        
        .animate-fadeIn {
            animation: fadeIn 0.8s ease-out forwards;
        }
        
        .animate-float {
            animation: float 6s ease-in-out infinite;
        }
        
        .animate-bounce-slow {
            animation: bounce 2s infinite;
        }
        
        .animate-scroll {
            animation: scroll 1.5s ease-in-out infinite;
        }
		
		/** Paket Karşıaştırma **/
		        /* Added smooth animations for toggle details */
        /* Custom scrollbar for better mobile experience */
        .tw-overflow-x-auto::-webkit-scrollbar {
            height: 8px;
        }
        .tw-overflow-x-auto::-webkit-scrollbar-track {
            background: #f1f1f1;
            border-radius: 10px;
        }
        .tw-overflow-x-auto::-webkit-scrollbar-thumb {
            background: #c5263a;
            border-radius: 10px;
        }
        .tw-overflow-x-auto::-webkit-scrollbar-thumb:hover {
            background: #a01f2e;
        }

        /* Updated animation to work with tw-hidden class */
        .detail-row {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.4s ease-in-out, opacity 0.3s ease-in-out;
            opacity: 0;
        }
        
        .detail-row.active {
            max-height: 500px;
            opacity: 1;
        }

        /* Icon rotation animation */
        .info-icon {
            transition: transform 0.3s ease-in-out, color 0.2s ease-in-out;
            display: inline-block;
        }
        
        .info-icon.rotated {
            transform: rotate(180deg);
        }

        /* Enhanced detail content styling */
        .detail-content {
            background: linear-gradient(135deg, #e3f2fd 0%, #f3e5f5 100%);
            border-left: 4px solid #c5263a;
            border-radius: 8px;
            padding: 1rem;
            margin: 0.5rem;
        }

        @media (min-width: 640px) {
            .detail-content {
                padding: 1.5rem;
                margin: 0.75rem;
            }
        }
		/** Paket Karşılaştırma Bitis **/
		        .spec-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 36px;
            height: 36px;
            border-radius: 8px;
            background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
        }
		
		        .os-dropdown {
            opacity: 0;
            transform: translateY(-10px);
            pointer-events: none;
            transition: opacity 0.3s ease, transform 0.3s ease;
            z-index: 9999;
        }
        
        .os-card:hover {
            z-index: 9999;
        }
        
        .os-card:hover .os-dropdown {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }
		
        .spec-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 36px;
            height: 36px;
            border-radius: 8px;
            background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
        }
        /* Added spec-icon class with gradient background for icons */
        .spec-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 36px;
            height: 36px;
            border-radius: 8px;
            background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
        }
        /* Added styles for collapsible details section */
        .details-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-out;
        }
        .details-content.active {
            max-height: 500px;
            transition: max-height 0.3s ease-in;
        }
        .chevron-icon {
            transition: transform 0.3s ease;
        }
        .chevron-icon.rotate {
            transform: rotate(180deg);
        }
		
		/** Oretra kalitesini keşvedin **/
         .service-card {
            height: auto;
            min-height: 200px;
        }
        
        @media (min-width: 1536px) {
            .service-card {
                height: 206px;
            }
            .service-card-half {
                height: 206px;
            }
            .service-card-vds {
                height: 206px;
            }
            .service-card-bottom {
                height: 206px;
            }
        }
        
        .gradient-bg {
            background: linear-gradient(to top right, #c5263a, #f2c14b);
        }
        
        /* Outline butonlar için kritik border stilleri */
        .btn-outline {
            position: relative;
            overflow: hidden;
            background-color: transparent;
            transition: all 0.3s ease;
        }
        
        .btn-outline::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 50%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
            transition: left 0.5s ease;
        }
        
        .btn-outline:hover::before {
            left: 100%;
        }
        
        .btn-primary {
            position: relative;
            overflow: hidden;
            background-color: #c5263a;
            border: 2px solid #c5263a;
            color: white;
            transition: all 0.3s ease;
        }
        
        .btn-primary:hover {
            background-color: #cd5554;
            border-color: #cd5554;
        }
        
        .btn-primary::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 50%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
            transition: left 0.5s ease;
        }
        
        .btn-primary:hover::before {
            left: 100%;
        }
		/** Oretra Kalitesini Keşvedin Bitis **/
		
		/** Musteri Yorumları **/
		    .quote-mark {
      font-family: Georgia, serif;
      font-size: clamp(1.5rem, 3vw, 2rem);
      line-height: 1;
      color: #e61737;
      opacity: 0.8;
      user-select: none;
    }
    
    .testimonial-container {
      transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
      min-height: 280px;
    }
    
    .testimonial-container.transitioning {
      opacity: 0;
      transform: translateY(10px);
    }
    
    .testimonial-card {
      background-color: #1e2838;
      transition: all 0.3s ease;
      height: 100%;
      display: flex;
      flex-direction: column;
    }
    
    .testimonial-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 8px 24px rgba(230, 23, 55, 0.15);
    }
    
    .nav-button {
      transition: all 0.3s ease;
      user-select: none;
    }
    
    .nav-button:not(:disabled):hover {
      transform: scale(1.1);
      box-shadow: 0 4px 12px rgba(230, 23, 55, 0.3);
    }
    
    .nav-button:not(:disabled):active {
      transform: scale(0.95);
    }
    
    .nav-button:disabled {
      cursor: not-allowed;
      opacity: 0.3;
    }
    
    .testimonial-page {
      display: none;
    }
    
    .testimonial-page.active {
      display: grid;
    }
    
    @media (max-width: 640px) {
      .testimonial-container {
        min-height: 250px;
      }
    }
		/** Musteri Yorumları Bitis **/