a {
     text-decoration: none;
     color: inherit;
   }

   body {
     font-family: 'Inter' !important;
     color: #333;
     background-color: #FFFFFF;
     font-size: 20px;
     line-height: 1.5;
   }

   /* Genel geçiş ayarı (buton, link, kartlar vb.) */
   button,
   a,
   .btn,
   .feature-card,
   .feature-icon img,
   .hero-img {
     transition: all 0.2s ease-in-out !important
       /* 200ms smooth */
   }

   /* Hover’da buton animasyonu */
   .btn:hover {
     transform: translateY(-3px) scale(1.03);
     box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
   }

   /* Kart hover efekti */
   .feature-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
   }


   .navbar {
     background: transparent;
     backdrop-filter: none;
     -webkit-backdrop-filter: none;
     box-shadow: none;
     padding: 20px 0;
     transition: all 0.3s ease;
     position: relative;
     top: 0;
     left: 0;
     right: 0;
     z-index: 1001;
     width: 100%;
   }
   
   /* News ticker varsayılan relative */
   .news-ticker-wrapper {
     position: relative;
   }
   
   .navbar.scrolled {
     background: rgba(255, 255, 255, 0.95);
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
     position: fixed;
     top: 0;
   }
   
   .navbar.scrolled .nav-link {
     color: #333 !important;
     text-shadow: none;
   }
   
   .navbar.scrolled .nav-link:hover {
     color: #ff4d4d !important;
   }
   
   .navbar.scrolled .nav-link::after {
     background: #ff4d4d;
   }
   
   .navbar.scrolled .nav-link.active {
     color: #ff4d4d !important;
   }
   
   .navbar.scrolled .navbar-brand img {
     filter: none;
   }

   /* Slider'ın üstüne menü gelmesi için */
   body {
     padding-top: 0;
   }

   .hero-slider {
     margin-top: 0;
   }

   .navbar-brand img {
     height: 40px;
     filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
     transition: all 0.3s ease;
   }
   
   .navbar-brand:hover img {
     transform: scale(1.05);
   }

   .nav-link {
     color: #FFFFFF !important;
     font-weight: 500;
     margin: 0 8px;
     transition: all 0.3s ease;
     font-size: 16px;
     text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
     text-decoration: none;
     position: relative;
     padding: 5px 0;
   }

   .nav-link::after {
     content: '';
     position: absolute;
     width: 0;
     height: 2px;
     background: #FFFFFF;
     bottom: 0;
     left: 0;
     transition: width 0.3s ease;
   }

   .nav-link:hover,
   .nav-link:focus,
   .nav-link:active,
   .nav-link.show {
     color: #FFFFFF !important;
     text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7);
   }

   .nav-link:hover::after,
   .nav-link:focus::after,
   .nav-link:active::after,
   .nav-link.show::after {
     width: 100%;
   }

   .nav-link.active {
     color: #FFFFFF !important;
     text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7);
   }

   .nav-link.active::after {
     width: 100%;
   }

   .nav-link.dropdown-toggle {
     color: #FFFFFF !important;
   }

   .nav-link.dropdown-toggle:hover,
   .nav-link.dropdown-toggle:focus,
   .nav-link.dropdown-toggle:active,
   .nav-link.dropdown-toggle.show {
     color: #FFFFFF !important;
   }

   /* Bootstrap override - tüm durumlar için beyaz (anasayfada) */
   .navbar .nav-link,
   .navbar .nav-link:hover,
   .navbar .nav-link:focus,
   .navbar .nav-link:active,
   .navbar .nav-link.show,
   .navbar .nav-link.active,
   .navbar .nav-link.dropdown-toggle,
   .navbar .nav-link.dropdown-toggle:hover,
   .navbar .nav-link.dropdown-toggle:focus,
   .navbar .nav-link.dropdown-toggle:active,
   .navbar .nav-link.dropdown-toggle.show {
     color: #FFFFFF !important;
   }
   
   /* İç sayfalarda menü yazıları siyah */
   body.inner-page .navbar .nav-link,
   body.inner-page .navbar .nav-link:hover,
   body.inner-page .navbar .nav-link:focus,
   body.inner-page .navbar .nav-link:active,
   body.inner-page .navbar .nav-link.show,
   body.inner-page .navbar .nav-link.active,
   body.inner-page .navbar .nav-link.dropdown-toggle,
   body.inner-page .navbar .nav-link.dropdown-toggle:hover,
   body.inner-page .navbar .nav-link.dropdown-toggle:focus,
   body.inner-page .navbar .nav-link.dropdown-toggle:active,
   body.inner-page .navbar .nav-link.dropdown-toggle.show {
     color: #1E293B !important;
     text-shadow: none !important;
   }
   
   body.inner-page .navbar .nav-link::after {
     background: #1E293B !important;
   }
   
   body.inner-page .navbar .nav-link:hover::after {
     background: #1E293B !important;
   }
   
   body.inner-page .navbar-brand img {
     filter: none !important;
   }

   /* İç sayfalarda haber ticker yazıları siyah */
   body.inner-page .news-ticker-wrapper .news-source,
   body.inner-page .news-ticker-wrapper .news-separator,
   body.inner-page .news-ticker-wrapper .news-item a,
   body.inner-page .news-ticker-wrapper .news-item span,
   body.inner-page .news-ticker-wrapper .separator {
     color: #1E293B !important;
   }
   
   body.inner-page .news-ticker-wrapper .news-item a:hover {
     color: #1E293B !important;
     text-decoration: underline !important;
   }
   
   body.inner-page .news-ticker-wrapper {
     background: #FFFFFF !important;
     border-bottom: 2px solid rgba(0, 0, 0, 0.1) !important;
   }
   
   /* News Ticker Label - Oval Şekil */
   .news-ticker-label {
     border-radius: 50px !important;
   }

   body.inner-page .news-ticker-label {
     background: rgba(37, 99, 235, 0.9) !important;
     border-radius: 50px !important;
   }

   /* Dropdown menüler için saydam stil */
   .navbar .dropdown-menu {
     background: rgba(255, 255, 255, 0.95);
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     border: 1px solid rgba(0, 0, 0, 0.1);
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
     margin-top: 10px;
   }

   .navbar .dropdown-item {
     color: #333;
     transition: all 0.3s ease;
     padding: 10px 20px;
   }

   .navbar .dropdown-item:hover {
     background: rgba(255, 77, 77, 0.1);
     color: #ff4d4d;
   }

   .user-avatar {
     width: 40px;
     height: 40px;
     border-radius: 50%;
     object-fit: cover;
   }

   .avatar-dropdown {
     position: absolute;
     top: 50px;
     right: 0;
     background: #fff;
     border-radius: 10px;
     border: 1px solid #E5E7EB;
     display: none;
     min-width: 200px;
     z-index: 9999;
     animation: fadeDown 0.2s ease-in-out;
   }

   .avatar-dropdown .dropdown-item {
     display: block;
     padding: 12px 15px;
     color: #374151;
     text-decoration: none;
     transition: background 0.2s ease;
   }

   .avatar-dropdown .dropdown-item:hover {
     background-color: #F3F4F6;
   }

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

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

   @media (max-width: 991.98px) {
     .navbar-nav {
       background: #ffffff;
       padding: 15px;
       border-radius: 12px;
       box-shadow: 0 5px 20px rgb(37 99 235 / 48%);
       margin-top: 24px;
     }

     .navbar-nav .nav-item {
       margin-bottom: 10px;
     }

     .navbar-nav .nav-link {
       display: block;
       padding: 12px 15px;
       border-radius: 8px;
       font-weight: 600;
       color: #1e293b !important;
       transition: all 0.2s ease;
       text-align: center;
     }

     .navbar-nav .nav-link:hover,
     .navbar-nav .nav-link.active {
       background-color: transparent;
       color: #FFFFFF !important;
     }
   }

   .hero-section {
     /* background: #E2E8F0; */
     color: white;
     padding: 200px 0;
     position: relative;
     min-height: 700px;
     display: flex;
     align-items: center;
   }
   
   .hero-section::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: rgba(0, 0, 0, 0.2);
     z-index: 1;
   }
   
   .hero-section .container {
     position: relative;
     z-index: 2;
   }

   .slider-h1 {
     color: #FFFFFF !important;
     text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
   }

   .slider-p {
     color: #FFFFFF !important;
     text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);
   }

   .btn-buy {
     background-color: #2563EB;
     color: #FFF;
     transition: all 0.2s ease;
   }


   .btn-buy:hover {
     background-color: #FFF;
     color: #2563EB;
     border: 1px solid #2563EB;
     transform: translateY(-3px) scale(1.03) !important;
     box-shadow: 0 8px 20px rgb(37 99 235 / 73%);
   }

   .btn-more-detail {
     background-color: #FFF;
     color: #2563EB;
     border: 1px solid #2563EB;
     transition: all 0.2s ease;
   }

   .btn-more-detail:hover {
     background-color: #2563EB;
     color: #FFF;
     transform: translateY(-3px) scale(1.03) !important;
     box-shadow: 0 8px 20px rgb(37 99 235 / 73%);
   }

   .btn-login {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: #fff;
     font-size: 24px;
     padding: 10px 24px;
     border: none;
     border-radius: 8px;
     transition: all 0.3s ease;
   }

   .btn-login:hover {
     background: linear-gradient(90deg, #0D8BFF 0%, #0065FF 50%, #4A4A4A 100%);
     transform: translateY(-2px);
     color: #fff;
     box-shadow: 0 6px 18px rgba(0, 102, 255, 0.35);
   }


   .hero-section .container {
     position: relative;
   }

   .hero-section .row {
     position: relative;
   }

   .hero-section img {
     position: absolute;
     right: 0;
     top: 50%;
     transform: translateY(-50%);
     max-width: 50%;
     height: auto;
     border: 1px dashed #2563EB;
     border-radius: 15px;
   }



   /* Feature Stats Section */
   .feature-stats-section {
     color: #fff;
     padding: 90px 0 70px;
     position: relative;
     overflow: hidden;
   }

   /* Dalga efekti */
   .feature-stats-section::before {
     content: '';
     position: absolute;
     bottom: -1px;
     left: 0;
     width: 100%;
     height: 120px;
     background-repeat: no-repeat;
     background-size: cover;
     z-index: 1;
   }

   .feature-stats-section .container {
     position: relative;
     z-index: 2;
   }

   .feature-stats-section h2 {
     font-size: 64px;
     font-weight: 800;
     margin-bottom: 5px;
     text-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
   }

   .feature-stats-section p {
     margin: 0;
     font-size: 1.1rem;
     opacity: 0.95;
     font-weight: 500;
   }

   .feature-stats-section .col-md-3 {
     padding: 20px 15px;
     position: relative;
   }


   /* Responsive */
   @media (max-width: 768px) {
     .feature-stats-section .col-md-3::after {
       display: none;
     }

     .feature-stats-section h2 {
       font-size: 2.2rem;
     }

     .feature-stats-section p {
       font-size: 1rem;
     }
   }



   .protection-features {
     background-color: #fff;
   }

   .features-title {
     font-size: 42px;
     font-weight: 700;
     color: #1e293b;
   }

   .features-subtitle {
     font-size: 18px;
     color: #64748b;
     max-width: 600px;
     margin: 0 auto;
   }

   .feature-card {
     background: #f9fafb;
     border-radius: 12px;
     padding: 30px 20px;
     height: 100%;
     transition: all 0.2s ease;
     box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
   }

    .feature-card:hover {
     background: linear-gradient(140deg, #3bb2ff 0%, #118eea 40%, #0460b8 100%);
     transform: translateY(-15px) !important;
     color: #FFFFFF;
   }
   /* Icon */
   .feature-icon {
     font-size: 2.5rem;
     color: #2563eb;
   }

 /* Kartın genel hover durumu */
   .feature-card:hover {
     background: linear-gradient(140deg, #3bb2ff 0%, #118eea 40%, #0460b8 100%);
     transform: translateY(-15px) !important;
     /* color: #fff; burada tek başına yetmeyebilir çünkü alttaki classlar eziyor */
   }

   /* Icon Ayarları */
   .feature-icon {
     font-size: 2.5rem;
     color: #2563eb;
     transition: 0.3s ease; /* Geçiş yumuşak olsun */
   }

   /* Karta gelince İcon rengi de değişsin istersen (Opsiyonel - İstersen bu kısmı silebilirsin) */
   .feature-card:hover .feature-icon {
        /* İkonun rengini değiştirmek istersen buraya kod yazabilirsin, img olduğu için filter gerekebilir */
        /* opacity: 0.9; gibi */
   }

   /* Başlık Ayarları */
   .feature-title {
     font-size: 1.25rem;
     font-weight: 600;
     margin-bottom: 10px;
     color: #0f172a;
     transition: 0.3s ease; /* Renk geçişi yumuşak olsun */
   }

   /* DÜZELTME BURADA: Kartın üzerine gelince (.feature-card:hover) başlığı (.feature-title) beyaz yap */
   .feature-card:hover .feature-title {
     color: #FFFFFF;
   }

   /* Açıklama Ayarları */
   .feature-desc {
     font-size: 0.95rem;
     color: #475569;
     line-height: 1.5;
     transition: 0.3s ease; /* Renk geçişi yumuşak olsun */
   }

   /* DÜZELTME BURADA: Kartın üzerine gelince (.feature-card:hover) açıklamayı (.feature-desc) beyaz yap */
   .feature-card:hover .feature-desc {
     color: #FFFFFF;
   }

   .home-product {
     background-color: #F8FAFC;
   }

   .home-product-card {
     transition: transform 0.2s ease, box-shadow 0.2s ease;
     border: 1px solid rgba(0, 0, 0, 0.05);
   }

   .home-product-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1) !important;
   }

   .home-product-image {
     height: 200px;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
     background-color: #f1f5f9;
   }

   .home-product-image img {
     width: 100%;
     height: 100%;
     object-fit: contain;
     object-position: center;
   }

   .home-product-features li {
     display: flex;
     align-items: center;
   }

   .home-product-icon {
     color: #2563EB;
   }

   /* Responsive düzenlemeler */
   @media (max-width: 992px) {
     .home-product .col-lg-4 {
       margin-bottom: 20px;
     }
   }

   @media (max-width: 768px) {
     .home-product-card {
       margin-bottom: 20px;
     }

     .home-product h2 {
       font-size: 2rem;
     }

     .home-product-image {
       height: 180px;
     }
   }

   @media (max-width: 576px) {
     .home-product-image {
       height: 160px;
     }
   }


   .cta-section {
     padding: 180px 20px;
     position: relative;
     color: white;
   }


   .cta-overlay {
     max-width: 800px;
     margin: 0 auto;
     text-align: center;
   }

   .cta-title {
     font-size: 42px;
     font-weight: 700;
     margin-bottom: 15px;
   }

   .cta-subtitle {
     font-size: 22px;
     margin-bottom: 30px;
     color: #E5E7EB;
   }

   .cta-features {
     display: flex;
     justify-content: center;
     flex-wrap: wrap;
     gap: 20px;
     font-size: 1rem;
     margin-bottom: 30px;
   }

   .cta-features i {
     color: #FFFFFF;
     margin-right: 6px;
   }

   .features-container {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 1rem;
     margin-bottom: 2rem;
     position: relative;
     z-index: 1;
   }

   .btn-bottom-banner {
     background-color: #2563EB;
     color: #FFFFFF;
     padding: 16px 80px 16px 80px;
   }

   .btn-bottom-banner:hover {
     border: 2px solid #2563EB;
     color: #2563EB;
     background-color: none;
   }

   .site-footer {
     position: relative;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: #fff;
     padding: 80px 0 40px;
     overflow: hidden;
   }

   /* Üstte hafif mavi parlama */
   .site-footer::before {
     content: "";
     position: absolute;
     top: -30%;
     left: -20%;
     width: 150%;
     height: 80%;
     background: radial-gradient(circle at 25% 30%,
         rgba(59, 178, 255, 0.25),
         rgba(0, 0, 0, 0) 70%);
     opacity: 0.45;
     pointer-events: none;
     transform: rotate(-10deg);
   }

   /* Alttan gelen koyu mavi gölge dalga */
   .site-footer::after {
     content: "";
     position: absolute;
     bottom: -35%;
     right: -25%;
     width: 160%;
     height: 85%;
     background: radial-gradient(circle at 80% 70%,
         rgba(0, 0, 0, 0.35),
         rgba(0, 0, 0, 0) 70%);
     opacity: 0.4;
     pointer-events: none;
     transform: rotate(12deg);
   }

   /* Ekstra yumuşak mavi diffuse katmanı */
   .site-footer .footer-wave {
     content: "";
     position: absolute;
     top: 25%;
     left: 50%;
     width: 160%;
     height: 130%;
     background: radial-gradient(circle at 50% 50%,
         rgba(28, 130, 230, 0.18),
         rgba(0, 0, 0, 0) 80%);
     transform: translateX(-50%);
     opacity: 0.32;
     z-index: 0;
   }

   /* Footer içeriği */
   .site-footer .container,
   .site-footer hr,
   .site-footer .copyright,
   .site-footer h6,
   .site-footer a,
   .site-footer ul li {
     position: relative;
     z-index: 5;
     /* İçerik dalgaların üstünde kalacak */
   }

   /* Footer sütun düzen sabitleme */
   .site-footer .row>div {
     position: relative;
     z-index: 5;
     padding-left: 15px;
     padding-right: 15px;
   }

   /* Linklerdeki bootstrap dropdown etkisini kaldır */
   .site-footer a {
     display: block;
     padding: 3px 0;
   }

   /* Kolon üst başlık spacing’leri */
   .site-footer h6 {
     margin-bottom: 18px;
     font-size: 22px;
     font-weight: 600;
   }

   /* Logo taşmasını engelle */
   .site-footer img.logo-animate {
     max-width: 150px;
     height: auto;
   }

   /* Mobilde sıkışmayı engelle */
   @media (max-width: 576px) {
     .site-footer .row>div {
       margin-bottom: 35px;
     }
   }

   .footer-social a {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     width: 40px;
     height: 40px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.15);
     margin-right: 10px;
     color: #fff;
     font-size: 18px;
     transition: 0.3s ease;
   }

   .footer-social a:hover {
     background: rgba(255, 255, 255, 0.35);
   }



   .site-footer-hr hr {
     border-color: rgba(255, 255, 255, 0.1);
     margin: 20px 0;
   }

   .site-footer h6 {
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 15px;
     color: #ffffff;
   }

   .site-footer ul {
     padding: 0;
     margin: 0;
     list-style: none;
   }

   .site-footer ul li {
     margin-bottom: 8px;
   }

   .site-footer ul li a {
     color: #FFFFFF;
     text-decoration: none;
     transition: color 0.2s ease;
     font-size: 18px;
   }

   .site-footer ul li a:hover {
     color: rgba(255, 255, 255, 0.8);
   }

   .site-footer hr {
     border-color: rgba(255, 255, 255, 0.1);
     margin: 20px 0;
   }

   .site-footer .copyright {
     color: rgba(255, 255, 255, 0.6);
     font-size: 18px;
   }



   .features-container {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 1.5rem;
     margin-bottom: 2rem;
   }


   .ul-line-height {
     line-height: 44px;
   }

   .stat-card {
     padding: 20px 0px 10px 0px;
     text-align: center;
     transition: transform 0.2s ease;
     height: 100%;
   }

   .stat-card:hover {
     transform: translateY(-5px);
   }


   .stat-number {
     font-size: 24px;
     font-weight: 700;
     color: #2563EB;
     margin-bottom: 5px;
   }

   .stat-text {
     font-size: 12px;
     color: #6c757d;
     font-weight: 500;
   }

   .stats-row {
     margin-bottom: 30px;
   }

   .login-bg {
     background-color: #F8FAFC;
   }

   .auth-container {
     background-color: white;
     border-radius: 12px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     width: 100%;
     max-width: 580px;
     overflow: hidden;
     padding: 30px;
   }

   .auth-header {
     display: flex;
     border-bottom: 1px solid #eaeaea;
     background-color: #f5f5f5;
     border-radius: 12px;
     overflow: hidden;
     padding: 4px;
   }

   .auth-tab {
     flex: 1;
     text-align: center;
     padding: 12px;
     cursor: pointer;
     font-weight: 600;
     color: #6c757d;
     border-radius: 8px;
     transition: all 0.2s ease;
   }

   .auth-tab.active {
     background-color: #ffffff;
     /* aktif olan beyaz */
     color: #000000;
     box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
   }

   .auth-body {
     padding: 30px;
   }

   .auth-form {
     display: none;
   }

   .auth-form.active {
     display: block;
     animation: fadeIn 0.5s;
   }

   @keyframes fadeIn {
     from {
       opacity: 0;
       transform: translateY(10px);
     }

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

   .welcome-text {
     text-align: center;
     margin-bottom: 25px;
     color: #6c757d;
   }

   .welcome-text h3 {
     color: #333;
     margin-bottom: 8px;
     font-weight: 600;
   }



   .form-check-input:checked {
     background-color: #3b5eda;
     border-color: #3b5eda;
   }

   .form-check-label {
     color: #6c757d;
   }

   .btn-primary-product {
     background-color: #3b5eda;
     padding: 10px 26px 10px 26px;
     border-radius: 8px;
     transition: all 0.2s;
     color: #FFF;
   }

   .btn-primary-product:hover {
     background-color: #2a4bc1;
     transform: translateY(-2px);
     color: #FFF;
   }

   .divider {
     display: flex;
     align-items: center;
     margin: 20px 0;
     color: #6c757d;
   }

   .divider::before,
   .divider::after {
     content: "";
     flex: 1;
     height: 1px;
     background-color: #eaeaea;
   }

   .divider::before {
     margin-right: 10px;
   }

   .divider::after {
     margin-left: 10px;
   }

   .divider-two {
     display: flex;
     align-items: center;
     margin: 20px 0;
     color: #6c757d;
   }

   .divider-two::before,
   .divider-two::after {
     content: "";
     flex: 1;
     height: 1px;
     background-color: #eaeaea;
   }

   .divider-three {
     display: flex;
     align-items: center;
     color: #6c757d;
   }

   .divider-three::before,
   .divider-three::after {
     content: "";
     flex: 1;
     height: 1px;
     background-color: #eaeaea;
   }


   .forgot-password {
     margin-top: 10px;
     text-align: center;
   }

   .forgot-password a {
     color: #3b5eda;
     text-decoration: none;
     font-size: 14px;
   }

   .social-login {
     display: flex;
     justify-content: center;
     gap: 16px;
     margin-top: 20px;
     flex-wrap: wrap;
     /* küçük ekranda taşarsa alta geçsin */
   }

   .social-btn {
     display: flex;
     align-items: center;
     justify-content: center;
     background: #fff;
     border: 2px solid #E2E8F0;
     border-radius: 8px;
     padding: 12px 40px;
     transition: 0.2s;
   }

   .social-btn img {
     max-height: 52px;
   }

   .social-btn:hover {
     background: #f2f2f2;
     transform: translateY(-2px);
   }

   @media (max-width: 576px) {
     .auth-body {
       padding: 20px;
     }

     .auth-tab {
       padding: 12px;
       font-size: 14px;
     }
   }

   .login-form-group {
     margin-bottom: 16px;
   }

   .login-form-label {
     display: block;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 6px;
     color: #444;
   }

   .input-wrapper {
     position: relative;
     display: flex;
     align-items: center;
   }

   .input-icon {
     position: absolute;
     left: 12px;
     color: #888;
     font-size: 16px;
   }

   .login-form-control {
     width: 100%;
     padding: 12px 12px 12px 36px;
     border-radius: 10px;
     border: 1px solid #ddd;
     transition: 0.2s;
     outline: none;
   }

   .login-form-control:focus {
     border-color: #3b5eda;
     box-shadow: 0 0 0 3px rgba(59, 94, 218, 0.1);
   }

   .toggle-password {
     position: absolute;
     right: 12px;
     cursor: pointer;
     color: #888;
     font-size: 16px;
   }

   .name-surname-wrapper {
     display: flex;
     gap: 16px;
   }

   .name-surname-wrapper .half-width {
     flex: 1;
   }

   .products-page-bg {
     background-color: #F8FAFC;
   }

   .banner-title {
     font-size: 42px;
     font-weight: 600;
     color: #1E293B;
   }

   .banner-subtitle {
     font-size: 18px;
     color: #64748B;
     max-width: 600px;
     margin: 0 auto;
     font-weight: 400;
   }

   .product-catergory {
     color: #2563EB;
     font-size: 16px;
     font-weight: 600;
     line-height: 40px;
   }

   .product-footer {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-top: 15px;
     gap: 10px;
   }

   .product-price {
     font-size: 26px;
     font-weight: bold;
     color: #2563EB;
   }

   .product-actions {
     display: flex;
     align-items: center;
     gap: 10px;
     /* Kalp ile buton arasında boşluk */
   }

   .wishlist-icon {
     cursor: pointer;
     transition: filter 0.2s ease;
   }


   .search-filter-bar {
     background: #fff;
     border: 1px solid #e2e8f0;
     border-radius: 12px;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
   }

   .search-input-wrapper {
     position: relative;
   }

   .search-icon {
     position: absolute;
     top: 50%;
     left: 12px;
     transform: translateY(-50%);
     color: #94a3b8;
     font-size: 16px;
   }

   .search-input {
     padding-left: 36px;
     border-radius: 8px;
     border: 1px solid #e2e8f0;
     height: 40px;
   }

/* FAQ green layout */
.faq-green-section {
    background: #f7fafc;
    border-radius: 24px;
    padding: 48px 38px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.06);
}

.faq-green-label {
    display: inline-block;
    font-weight: 700;
    color: #1FA2FF;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.faq-green-title {
    font-size: 36px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 12px;
}

.faq-green-text {
    color: #475569;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 18px;
}

.faq-green-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #0f172a;
    font-weight: 700;
    padding: 12px 18px;
    border-radius: 14px;
    text-decoration: none;
    box-shadow: 0 10px 25px rgba(31, 162, 255, 0.25);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.faq-green-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(31, 162, 255, 0.3);
    color: #0f172a;
}

.faq-green-list {
    width: 100%;
}

.faq-green-item {
    background: #ffffff;
    border-radius: 18px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
    margin-bottom: 12px;
    overflow: hidden;
}

.faq-green-toggle {
    width: 100%;
    border: none;
    background: transparent;
    padding: 18px 20px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    text-align: left;
    position: relative;
    cursor: pointer;
    transition: background 0.2s ease;
}

.faq-green-toggle:hover {
    background: #f8fafc;
}

.faq-green-badge {
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #0f172a;
    font-weight: 800;
    border-radius: 16px;
    padding: 10px 14px;
    font-size: 16px;
    min-width: 54px;
    text-align: center;
    box-shadow: 0 6px 15px rgba(31, 162, 255, 0.25);
}

.faq-green-question {
    flex: 1;
    font-weight: 700;
    color: #0f172a;
    font-size: 18px;
    line-height: 1.4;
}

.faq-green-icon {
    color: #94a3b8;
    transition: transform 0.2s ease, color 0.2s ease;
    margin-left: 8px;
}

.faq-green-toggle.open .faq-green-icon {
    color: #1FA2FF;
}

.faq-green-toggle.open .faq-green-icon i {
    transform: rotate(180deg);
}

.faq-green-answer {
    padding: 0 20px 18px 90px;
    color: #475569;
    font-size: 15px;
    line-height: 1.6;
}

@media (max-width: 992px) {
    .faq-green-section {
        padding: 32px 22px;
    }

    .faq-green-title {
        font-size: 30px;
    }

    .faq-green-answer {
        padding-left: 72px;
    }
}

@media (max-width: 576px) {
    .faq-green-toggle {
        align-items: center;
    }

    .faq-green-badge {
        padding: 8px 10px;
        min-width: 46px;
    }

    .faq-green-question {
        font-size: 16px;
    }
}

/* Tipps page */
/* Ratgeber/Tipps Page - Modern Professional Design */
.ratgeber-page {
    background: #F8FAFC;
    min-height: 100vh;
}

.ratgeber-main-title {
    font-size: 48px;
    font-weight: 700;
    color: #1E293B;
    margin-bottom: 40px;
    line-height: 1.2;
}

.ratgeber-article-card {
    background: #FFFFFF;
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}

.ratgeber-article-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.ratgeber-article-image {
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    background: #F1F5F9;
}

.ratgeber-article-image img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
}

.ratgeber-article-image:hover img {
    transform: scale(1.05);
}

.ratgeber-article-image a {
    display: block;
    text-decoration: none;
}

.ratgeber-article-title {
    font-size: 28px;
    font-weight: 700;
    color: #1E293B;
    margin-bottom: 16px;
    line-height: 1.3;
}

.ratgeber-article-title a {
    color: #1E293B;
    text-decoration: none;
    transition: color 0.2s ease;
}

.ratgeber-article-title a:hover {
    color: #1FA2FF;
}

.ratgeber-article-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    color: #64748B;
    padding-bottom: 16px;
    border-bottom: 1px solid #E5E7EB;
}

.ratgeber-source {
    font-weight: 600;
    color: #1E293B;
}

.ratgeber-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ratgeber-meta-item i {
    font-size: 14px;
    color: #94A3B8;
}

.ratgeber-article-excerpt {
    font-size: 16px;
    line-height: 1.6;
    color: #475569;
    margin: 20px 0;
}

.ratgeber-read-more {
    display: inline-block;
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #FFFFFF;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 6px;
    text-decoration: none;
    transition: background 0.3s ease, transform 0.2s ease;
    margin-top: 8px;
}

.ratgeber-read-more:hover {
    background: rgb(22, 184, 98);
    color: #FFFFFF;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(29, 224, 119, 0.3);
}

/* Sidebar */
.ratgeber-sidebar {
    position: sticky;
    top: 100px;
}

.ratgeber-sidebar-widget {
    background: #FFFFFF;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ratgeber-sidebar-title {
    font-size: 20px;
    font-weight: 700;
    color: #1E293B;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid #E5E7EB;
}

.ratgeber-search-wrapper {
    position: relative;
}

.ratgeber-search-wrapper i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #94A3B8;
}

.ratgeber-search-wrapper input {
    padding-left: 36px;
    border: 1px solid #E5E7EB;
    border-radius: 6px;
    height: 44px;
}

.ratgeber-search-wrapper input:focus {
    border-color: rgb(29, 224, 119);
    box-shadow: 0 0 0 3px rgba(29, 224, 119, 0.1);
    outline: none;
}

.ratgeber-categories {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ratgeber-category-item {
    display: block;
    padding: 10px 16px;
    color: #64748B;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.ratgeber-category-item:hover {
    background: #F1F5F9;
    color: #1E293B;
}

.ratgeber-category-item.active {
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #FFFFFF;
    font-weight: 600;
}

.ratgeber-recent-posts {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ratgeber-recent-post-item {
    padding-bottom: 16px;
    border-bottom: 1px solid #E5E7EB;
}

.ratgeber-recent-post-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.ratgeber-recent-post-item a {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #1E293B;
    text-decoration: none;
    margin-bottom: 6px;
    line-height: 1.4;
    transition: color 0.2s ease;
}

.ratgeber-recent-post-item a:hover {
    color: #1FA2FF;
}

.ratgeber-recent-date {
    font-size: 13px;
    color: #94A3B8;
}

/* Blog Detail Page */
.ratgeber-detail-page {
    background: #F8FAFC;
    min-height: 100vh;
}

.ratgeber-detail-article {
    background: #FFFFFF;
    border-radius: 8px;
    padding: 40px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ratgeber-detail-title {
    font-size: 36px;
    font-weight: 700;
    color: #1E293B;
    line-height: 1.3;
    margin-bottom: 24px;
}

.ratgeber-detail-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    color: #64748B;
    padding-bottom: 20px;
    margin-bottom: 24px;
    border-bottom: 1px solid #E5E7EB;
}

.ratgeber-detail-image {
    margin-bottom: 32px;
}

.ratgeber-detail-image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.ratgeber-detail-content {
    font-size: 16px;
    line-height: 1.75;
    color: #475569;
}

.ratgeber-detail-content p {
    margin-bottom: 20px;
}

.ratgeber-detail-content h2,
.ratgeber-detail-content h3,
.ratgeber-detail-content h4 {
    font-weight: 700;
    color: #1E293B;
    margin-top: 32px;
    margin-bottom: 16px;
}

.ratgeber-detail-content h2 {
    font-size: 28px;
}

.ratgeber-detail-content h3 {
    font-size: 24px;
}

.ratgeber-detail-content h4 {
    font-size: 20px;
}

.ratgeber-detail-content ul,
.ratgeber-detail-content ol {
    margin: 20px 0;
    padding-left: 24px;
}

.ratgeber-detail-content li {
    margin-bottom: 8px;
}

.ratgeber-detail-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 24px 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.ratgeber-detail-content a {
    color: #1FA2FF;
    text-decoration: none;
    font-weight: 600;
}

.ratgeber-detail-content a:hover {
    text-decoration: underline;
}

@media (max-width: 992px) {
    .ratgeber-main-title {
        font-size: 36px;
    }
    
    .ratgeber-article-title {
        font-size: 24px;
    }
    
    .ratgeber-detail-title {
        font-size: 28px;
    }
    
    .ratgeber-detail-article {
        padding: 24px;
    }
    
    .ratgeber-sidebar {
        position: static;
        margin-top: 40px;
    }
}

@media (max-width: 768px) {
    .ratgeber-main-title {
        font-size: 32px;
        margin-bottom: 30px;
    }
    
    .ratgeber-article-card {
        padding: 20px;
    }
    
    .ratgeber-article-title {
        font-size: 22px;
    }
    
    .ratgeber-article-meta {
        font-size: 12px;
        gap: 12px;
    }
    
    .ratgeber-detail-title {
        font-size: 24px;
    }
    
    .ratgeber-detail-article {
        padding: 20px;
    }
}

/* Old styles - keeping for backward compatibility but will be overridden */
.tips-page {
    background: #f8fafc;
}

.tips-hero {
    border-radius: 18px;
    overflow: hidden;
    background: #0f172a;
    color: #e2e8f0;
}

.tips-hero-media {
    position: relative;
    height: 100%;
    min-height: 320px;
    background: #111827;
}

.tips-hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.tips-hero-label {
    position: absolute;
    top: 16px;
    left: 16px;
    background: rgba(15, 23, 42, 0.8);
    color: #1FA2FF;
    padding: 8px 12px;
    border-radius: 12px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.tips-hero-body {
    padding: 32px 28px;
}

.tips-hero-kicker {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    color: #1FA2FF;
    margin-bottom: 6px;
}

.tips-hero-title {
    font-size: 42px;
    font-weight: 800;
    color: #fff;
    margin-bottom: 6px;
}

.tips-hero-sub {
    font-size: 16px;
    color: #cbd5e1;
    margin-bottom: 18px;
}

.tips-search .search-input {
    height: 48px;
}

.tips-btn {
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #FFFFFF;
    font-weight: 700;
    border: none;
    padding: 12px 18px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(31, 162, 255, 0.25);
}

.tips-filters .tips-filter-chip {
    display: inline-flex;
    align-items: center;
    padding: 10px 14px;
    border-radius: 12px;
    background: #0f172a;
    color: #e2e8f0;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid rgba(226, 232, 240, 0.1);
}

.tips-filter-chip.active {
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #FFFFFF;
    border-color: #1FA2FF;
}

.tips-featured {
    border-radius: 16px;
    overflow: hidden;
}

.tips-featured-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 280px;
}

.tips-featured-body {
    padding: 26px 24px;
}

.tips-chip {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(31, 162, 255, 0.14);
    color: #0065FF;
    font-weight: 700;
    font-size: 13px;
}

.tips-date {
    color: #94a3b8;
    font-weight: 600;
    font-size: 14px;
}

.tips-featured-title {
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 10px;
}

.tips-featured-text {
    color: #475569;
    font-size: 15px;
    line-height: 1.6;
}

.tips-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #0f172a;
    font-weight: 700;
    text-decoration: none;
    margin-top: 8px;
}

.tips-card {
    border-radius: 14px;
    overflow: hidden;
}

.tips-card-img {
    position: relative;
    height: 220px;
    background: #e2e8f0;
}

.tips-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tips-card-body {
    padding: 18px 18px 20px;
}

.tips-card-title {
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
}

.tips-card-text {
    color: #475569;
    font-size: 15px;
    line-height: 1.6;
}

.tips-card-meta {
    font-size: 13px;
    color: #94a3b8;
    font-weight: 600;
}

@media (max-width: 992px) {
    .tips-hero-title {
        font-size: 32px;
    }
    .tips-featured-title {
        font-size: 22px;
    }
    .tips-featured-body {
        padding: 18px;
    }
}

@media (max-width: 576px) {
    .tips-hero-body {
        padding: 24px 20px;
    }
    .tips-card-img {
        height: 200px;
    }
}

/* Modern glassy cards for tips */
.glassy-card {
    background: rgba(255, 255, 255, 0.92);
    border-radius: 18px;
    border: 1px solid rgba(226, 232, 240, 0.7);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

.gradient-overlay img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gradient-overlay::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.75), rgba(34, 197, 94, 0.35));
    pointer-events: none;
}

.gradient-overlay-sm::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.35), rgba(34, 197, 94, 0.25));
    pointer-events: none;
}

.tips-hero-media,
.tips-featured-img,
.tips-card-img {
    position: relative;
}

.tips-hero-badge {
    position: absolute;
    top: 18px;
    left: 18px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #1FA2FF;
    font-weight: 800;
    padding: 10px 14px;
    border-radius: 14px;
    backdrop-filter: blur(8px);
    letter-spacing: 0.5px;
    z-index: 1;
}

.tips-hero {
    background: linear-gradient(135deg, #0f172a 0%, #0b1222 45%, #111827 100%);
    color: #e2e8f0;
}

.tips-page {
    background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
}

.tips-hero-title {
    font-size: 44px;
}

.tips-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tips-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.12);
}

.tips-card-img img,
.tips-featured-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tips-chip {
    z-index: 1;
}

/* Blog detail */
.blog-detail-hero {
    position: relative;
    background: linear-gradient(180deg, #0f172a 0%, #0b1222 70%, #0f172a 100%);
    padding-bottom: 60px;
}

.blog-detail-hero-media {
    position: relative;
    max-height: 520px;
    overflow: hidden;
}

.blog-detail-hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.blog-detail-hero-content {
    margin-top: -120px;
    position: relative;
}

.blog-detail-title {
    color: #0f172a;
    font-size: 36px;
    font-weight: 800;
    margin: 8px 0 0;
}

.blog-detail-body {
    background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
}

.blog-detail-content p {
    color: #1f2937;
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 16px;
}

.blog-detail-content h2,
.blog-detail-content h3,
.blog-detail-content h4 {
    margin-top: 24px;
    margin-bottom: 12px;
    font-weight: 800;
}

.blog-detail-content ul {
    padding-left: 20px;
    margin-bottom: 16px;
    color: #1f2937;
}

.blog-detail-content img {
    max-width: 100%;
    border-radius: 14px;
    margin: 16px 0;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
}

@media (max-width: 768px) {
    .blog-detail-hero-content {
        margin-top: -80px;
    }
    .blog-detail-title {
        font-size: 28px;
    }
}

   .search-input:focus {
     border-color: #2563EB;
     box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
     outline: none;
   }

   .filter-btn {
     background: #fff;
     border: 1px solid #e2e8f0;
     border-radius: 8px;
     padding: 8px 12px;
     font-size: 14px;
     color: #334155;
     transition: all 0.2s ease;
     font-weight: 600;
     text-align: justify;
   }

   .filter-btn:hover {
     background: #f1f5f9;
     border-color: #cbd5e1;
   }


   .custom-dropdown {
     display: none;
     position: absolute;
     top: 110%;
     left: 0;
     width: 100%;
     background: white;
     border: 1px solid #e2e8f0;
     border-radius: 8px;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
     z-index: 10;
     overflow: hidden;
   }

   .custom-dropdown.show {
     display: block;
     animation: fadeInDown 0.2s ease-in-out;
   }

   .custom-dropdown a {
     display: block;
     padding: 10px 12px;
     font-size: 14px;
     color: #334155;
     text-decoration: none;
     transition: background 0.2s ease;
   }

   .custom-dropdown a:hover {
     background: #f1f5f9;
   }

   /* Açılırken hafif animasyon */
   @keyframes fadeInDown {
     from {
       opacity: 0;
       transform: translateY(-5px);
     }

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


   .product-image img {
     max-height: 320px;
     max-width: 100%;
     object-fit: contain;
     border-radius: 12px;
   }

   .thumbs img {
     width: 60px;
     height: 60px;
     border-radius: 8px;
     border: 2px solid transparent;
     cursor: pointer;
     transition: 0.2s ease;
   }

   .thumbs img.active {
     border-color: #2563EB;
   }

   .price {
     font-size: 42px;
     font-weight: bold;
     color: #2563EB;
   }

   .old-price {
     text-decoration: line-through;
     color: #999;
     margin-left: 10px;
     margin-top: 16px;
     font-size: 24px;
   }

   .discount-badge {
     background-color: #F97316;
     color: white;
     padding: 4px 8px;
     border-radius: 6px;
     font-size: 0.9rem;
   }

   .feature-list li {
     margin-bottom: 8px;
   }

   .feature-list li::before {
     content: "";
     display: inline-block;
     width: 14px;
     height: 14px;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     border-radius: 50%;
     margin-right: 10px;
     vertical-align: middle;
   }

   .tab-content {
     padding: 20px;
     background: #fff;
     border-top: none;
   }

   .info-badges span {
     margin-right: 10px;
     padding: 5px 12px;
     border-radius: 6px;
     font-size: 0.9rem;
     display: inline-block;
   }

   .badge-green {
     background: rgba(31, 162, 255, 0.1);
     color: #1FA2FF;
   }

   .nav-tabs .nav-link.active {
     position: relative;
     font-weight: 600;
   }

   .nav-tabs .nav-link.active::after {
     content: "";
     position: absolute;
     bottom: 0;
     left: 0;
     height: 3px;
     width: 100%;
     background-color: #2563EB;
     /* Bootstrap primary rengi */
     border-radius: 3px 3px 0 0;
   }

   .product-span-bg {
     background-color: #F97316;
     color: #FFFFFF !important;
     padding: 4px 8px;
     border-radius: 20px;
     font-size: 14px;
   }

   .product-detail-text {
     color: #64748B;
     font-size: 18px;
   }

   .btn-heart {
     border: 2px solid #2563EB;
   }

   .btn-heart:hover {
     border: 1px solid #2563EB;
     background-color: #f2f2f2;
   }

   .quantity-control {
     max-width: 140px;
   }

   .quantity-control .btn {
     background-color: #F9FAFB;
     border: 1px solid #E5E7EB;
     font-weight: bold;
     font-size: 18px;
     width: 40px;
     height: 40px;
     line-height: 1;
     display: flex;
     align-items: center;
     justify-content: center;
   }

   .quantity-control input {
     border: 1px solid #E5E7EB;
     font-weight: 600;
     font-size: 16px;
   }

   .product-detail-btn {
     padding: 16px 10px 16px 10px;
   }


   .btn-buy-now {
     background-color: #FFF;
     color: #2563EB;
     border: 2px solid #2563EB;
   }

   .btn-buy-now:hover {
     background-color: #2563EB;
     color: #FFF;
   }


   .btn-add-basket {
     background-color: #2563EB;
     color: #FFF;
   }

   .btn-add-basket:hover {
     background-color: #FFF;
     color: #2563EB;
     border: 2px solid #2563EB;
   }

   .info-badges-bottom {
     display: flex;
     flex-wrap: wrap;

   }

   .info-item-bottom {
     display: flex;
     align-items: center;
     gap: 8px;
   }

   .info-icon-bottom {
     width: 24px;
     height: 24px;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     border-radius: 4px;
     display: inline-block;
   }

   .info-text-bottom {
     font-size: 16px;
     font-weight: 500;
     color: #64748B;
   }

   .nav-item a {
     color: #64748B !important;
   }

   #comments .card {
     border-radius: 12px;
     border: 1px solid #E5E7EB;
   }

   #comments .card-body {
     padding: 16px 20px;
   }

   #comments h6 {
     color: #111827;
   }

   #comments .text-warning {
     font-size: 1rem;
     letter-spacing: 1px;
   }

   .basket-page-bg {
     background-color: #F8FAFC;
   }

   .basket-page-card {
     background: #FFFFFF;
     border-radius: 16px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
     padding: 24px;
     margin-bottom: 24px;
   }

   .basket-page-title {
     font-weight: 600;
     font-size: 24px;
     color: #1E293B;
   }

   /* Ürün listesi */
   .basket-page-product {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 16px 0;
     border-bottom: 1px solid #E2E8F0;
   }

   .basket-page-product:last-child {
     border-bottom: none;
   }

   .basket-page-product-info {
     display: flex;
     align-items: center;
     gap: 16px;
   }

   .basket-page-product-img {
     width: 100px;
     height: 100px;
     border-radius: 12px;
     object-fit: contain;
     background-color: #F1F5F9;
   }

   .basket-page-product-name {
     font-weight: 700;
     margin-bottom: 2px;
     font-size: 18px;
   }

   .basket-page-product-sub {
     font-size: 14px;
     color: #64748B;
   }

   .basket-page-price {
     font-weight: 700;
     font-size: 22px;
     color: #1E293B;
   }

   /* Adet kontrol */
   .basket-page-quantity {
     display: flex;
     align-items: center;
     gap: 8px;
   }

   .basket-page-quantity button {
     background: #F1F5F9;
     border: none;
     border-radius: 6px;
     width: 28px;
     height: 28px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: bold;
     color: #1E293B;
   }

   /* Sipariş Özeti */
   .basket-page-summary {
     font-size: 16px;
     color: #475569;
     line-height: 36px;
   }

   .basket-page-summary-row {
     display: flex;
     justify-content: space-between;
     margin-bottom: 8px;
   }

   .basket-page-total {
     font-size: 24px;
     font-weight: 700;
     color: #2563EB;
   }

   /* Butonlar */
   .basket-page-btn {
     display: block;
     text-decoration: none;
     text-align: center;
     border-radius: 10px;
     padding: 12px;
     font-weight: 600;
     width: 100%;
     margin-top: 10px;
   }

   .basket-page-btn-primary {
     background-color: #2563EB;
     color: #fff;
     border: none;
   }

   .basket-page-btn-primary:hover {
     background-color: #1E40AF;
   }

   .basket-page-btn-outline {
     border: 2px solid #2563EB;
     background: transparent;
     color: #2563EB;
   }

   .basket-page-btn-outline:hover {
     background: #2563EB;
     color: #fff;
   }



   .basket-page-product-one-price {
     font-size: 20px;
     color: #2563EB;
     font-weight: 700;
   }

   .basket-page-clear {
     font-size: 16px;
     font-weight: 500;
     color: #EF4444;
     transition: color 0.2s ease;
     text-decoration: underline;
   }

   .basket-line-height {
     line-height: 30px;
   }

   .basket-page-total-text {
     font-size: 18px;
   }

   .text-green {
     color: #1FA2FF
   }



   /* Önerilen Ürünler */
   .basket-page-suggested-product {
     background: #FFFFFF;
     border: 1px solid #E2E8F0;
     border-radius: 12px;
     padding: 12px 16px;
     transition: 0.2s ease;
   }

   .basket-page-suggested-product:hover {
     background: #F8FAFC;
     border-color: #CBD5E1;
   }

   .basket-page-suggested-img {
     width: 80px;
     height: 80px;
     border-radius: 8px;
     background-color: #F1F5F9;
     object-fit: contain;
   }

   .basket-page-suggested-name {
     font-size: 14px;
     font-weight: 600;
     color: #1E293B;
   }

   .basket-page-suggested-price {
     font-size: 14px;
     font-weight: 700;
     color: #2563EB;
   }

   .basket-page-suggested-add {
     width: 28px;
     height: 28px;
     background-color: #2563EB;
     border: none;
     border-radius: 50%;
     color: white;
     font-size: 18px;
     font-weight: bold;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: background 0.2s ease;
     margin-bottom: 34px;
   }

   .basket-page-suggested-add:hover {
     background-color: #1E40AF;
   }

   .form-check-label a {
     color: #2563EB;
   }

   .payment-page-bg {
     background-color: #F8FAFC;
   }

   .payment-page-card,
   .payment-page-summary-card {
     background: #fff;
     border-radius: 16px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
   }

   .payment-page-card {
     padding: 24px;
     margin-bottom: 24px;
   }

   .payment-page-summary-card {
     padding: 16px;
   }

   .payment-page-title {
     font-size: 20px;
     font-weight: 700;
     color: #1E293B;
     margin-bottom: 20px;
     display: flex;
     align-items: center;
     gap: 8px;
   }

   /* Form Alanları */
   .payment-page-card .form-label {
     font-weight: 600;
     font-size: 14px;
     margin-bottom: 4px;
     display: block;
   }

   .payment-page-card .form-control {
     border: 1.5px solid #E2E8F0;
     border-radius: 10px;
     padding: 12px 14px;
     font-size: 15px;
     transition: 0.2s ease-in-out;
     font-weight: 600;
   }

   .payment-page-card .form-control:focus {
     border-color: #2563EB;
     box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
   }

   /* Sipariş Özeti Ürün */
   .payment-page-summary-product {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 12px;
   }

   .payment-page-summary-product img {
     width: 60px;
     height: 60px;
     border-radius: 8px;
     object-fit: contain;
     background-color: #F1F5F9;
   }

   .payment-page-summary-product-info {
     flex: 1;
     margin-left: 10px;
   }

   /* Ödeme Yöntemi Kartları */
   .payment-page-methods {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
     gap: 12px;
     margin-bottom: 20px;
   }

   .payment-page-method-btn {
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     padding: 24px;
     border: 2px solid #E2E8F0;
     border-radius: 12px;
     cursor: pointer;
     font-weight: 600;
     background-color: #fff;
     color: #334155;
     transition: all 0.2s ease-in-out;
   }

   .payment-page-method-btn i {
     font-size: 30px;
     margin-bottom: 6px;
   }

   .payment-page-method-btn.active {
     border-color: #2563EB;
     background-color: #EFF6FF;
     color: #2563EB;
     box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
   }

   .payment-page-method-btn:hover {
     border-color: #2563EB;
   }

   /* Kart Numarası İkonu */
   .payment-page-card-number {
     position: relative;
   }

   .payment-page-card-number i {
     position: absolute;
     top: 50%;
     right: 30px;
     transform: translateY(20%);
     color: #94A3B8;
   }

   .payment-page-card-number input {
     padding-left: 42px;
   }

   /* Ödeme Butonu */
   .payment-page-submit-btn {
     background-color: #2563EB;
     color: white;
     font-weight: 600;
     border-radius: 12px;
     width: 100%;
     padding: 14px;
     border: none;
     font-size: 16px;
     transition: background 0.2s ease-in-out;
     margin-top: 12px;
   }

   .payment-page-submit-btn:hover {
     background-color: #1E40AF;
   }

   /* Genel Yardımcı Sınıflar */
   .payment-page-icon-bg {
     background-color: #2563EB;
     color: #FFFFFF;
     border-radius: 8px;
     width: 36px !important;
     height: 36px !important;
     display: flex !important;
     align-items: center;
     justify-content: center;
     font-size: 16px;
     box-shadow: 0 2px 6px rgba(37, 99, 235, 0.3);
   }

   .line-height-40 {
     line-height: 40px;
   }



   .payment-page-bg {
     background-color: #F8FAFC;
     min-height: 100vh;
     padding: 40px 0;
   }

   .payment-page-success-card {
     background: #fff;
     border-radius: 16px;
     padding: 40px 24px;
     text-align: center;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
     margin-bottom: 32px;
   }

   .payment-page-success-icon {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: white;
     width: 120px;
     height: 120px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
     font-size: 54px;
     margin: 0 auto 16px auto;
     box-shadow: 0 4px 10px rgba(31, 162, 255, 0.3);
   }

   .payment-page-success-title {
     font-size: 46px;
     font-weight: 700;
     color: #1E293B;
     margin-bottom: 8px;
     line-height: 50px;
   }

   .payment-page-success-text {
     font-size: 20px;
     color: #64748B;
     margin-bottom: 20px;
     line-height: 32px;
   }

   .payment-page-order-code {
     background: #f8fafc;
     padding: 12px 28px;
     border-radius: 12px;
     font-weight: 600;
     display: inline-block;
     font-size: 18px;
     color: #334155;
     border: 2px solid #e2e8f0;
   }

   .payment-page-card {
     background: #fff;
     border-radius: 16px;
     padding: 20px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
     margin-bottom: 20px;
   }





   .copy-toast {
     position: fixed;
     bottom: 20px;
     right: 20px;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: white;
     padding: 10px 16px;
     border-radius: 8px;
     font-weight: 600;
     opacity: 0;
     transform: translateY(20px);
     transition: all 0.2s ease-in-out;
     z-index: 9999;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
   }

   .copy-toast.show {
     opacity: 1;
     transform: translateY(0);
   }



   .payment-page-summary-product {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 12px;
     margin-bottom: 26px;
     transition: box-shadow 0.2s ease-in-out;
     border-bottom: 1px solid #E2E8F0;
   }

   .payment-page-summary-product img {
     width: 70px;
     height: 70px;
     border-radius: 8px;
     background: #F1F5F9;
     object-fit: contain;
   }

   .payment-page-summary-info {
     flex: 1;
     margin-left: 12px;
     display: flex;
     flex-direction: column;
   }

   .payment-page-summary-info strong {
     font-size: 16px;
     color: #1E293B;
   }

   .payment-page-summary-info small {
     font-size: 14px;
     color: #64748B;
   }


   .payment-page-status {
     background: #F59E0B;
     color: white;
     font-size: 12px;
     font-weight: 600;
     padding: 4px 10px 4px 8px;
     border-radius: 12px;
     margin-top: 6px;
     display: inline-flex;
     align-items: center;
     gap: 6px;
     width: 100px;
   }

   .payment-page-status::before {
     content: "";
     width: 8px;
     height: 8px;
     background: white;
     border-radius: 50%;
     display: inline-block;
   }

   .payment-page-summary-price {
     font-weight: 700;
     font-size: 20px;
     color: #1E293B;
     min-width: 60px;
     text-align: right;
   }


   .delivery-timeline {
     margin: 0;
     padding-left: 0;
     position: relative;
   }

   .timeline-step {
     display: flex;
     align-items: flex-start;
     position: relative;
     padding-bottom: 24px;
   }

   .timeline-step:last-child {
     padding-bottom: 0;
   }

   .timeline-icon {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: #000000;
     margin-right: 12px;
     background: #E2E8F0;
     position: relative;
     z-index: 2;
     font-size: 24px;
   }



   .timeline-step:last-child::before {
     display: none;
   }

   .timeline-step.active .timeline-icon {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     border-color: #1FA2FF;
     color: #fff;
     box-shadow: 0 2px 6px rgba(31, 162, 255, 0.3);
   }

   .timeline-content {
     display: flex;
     flex-direction: column;
   }

   .timeline-content strong {
     font-size: 18px;
     color: #1E293B;
   }

   .timeline-content span {
     font-size: 14px;
     color: #64748B;
   }

   .timeline-content small {
     font-size: 12px;
     color: #2563EB;
     font-weight: 600;
     margin-top: 2px;
   }

   .total-price-span {
     font-size: 24px;
     font-weight: 700;
   }

   .total-price-text {
     font-size: 24px;
     color: #2563EB;
   }


   .payment-page-info-list {
     display: flex;
     flex-direction: column;
     gap: 12px;
     margin-top: 10px;
   }

   .payment-page-info-item {
     display: flex;
     justify-content: space-between;
     margin-bottom: 6px;
     font-size: 16px;
   }

   .payment-page-info-item:last-child {
     border-bottom: none;
   }

   .payment-page-info-item .label {
     color: #64748B;
     font-weight: 600;
   }

   .payment-page-info-item .value {
     color: #1E293B;
     text-align: right;
   }

   .payment-page-info-item .value small {
     color: #64748B;
     font-size: 13px;
   }

   .payment-page-info-line {
     border-bottom: 1px solid #E2E8F0;
     padding-bottom: 8px;
   }


   .support-card {
     background: #fff;
     border-radius: 16px;
     padding: 28px 20px;
     text-align: center;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
     transition: transform 0.2s ease, box-shadow 0.2s ease;
   }

   .support-card:hover {
     transform: translateY(-4px);
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
   }

   .support-icon {
     background: #2563EB;
     color: #FFFFFF;
     width: 60px;
     height: 60px;
     border-radius: 16px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 26px;
     margin: 0 auto 14px;
   }

   .support-title {
     font-size: 18px;
     font-weight: 700;
     color: #1E293B;
     margin-bottom: 8px;
   }

   .support-text {
     font-size: 15px;
     color: #64748B;
     margin-bottom: 10px;
     line-height: 1.5;
   }

   .support-link {
     color: #2563EB;
     font-weight: 700;
     font-size: 16px;
     display: inline-block;
     margin-bottom: 4px;
   }

   .support-subtext {
     display: block;
     font-size: 13px;
     color: #94A3B8;
   }

   .dashboard-bg {
     background-color: #F8FAFC;
   }

   .dashboard-welcome {
     border-radius: 16px;
     padding: 28px;
     color: white;
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 24px;
     box-shadow: 0 4px 10px rgba(37, 99, 235, 0.15);
     height: 200px;
   }

   .dashboard-welcome h3 {
     font-size: 28px;
     font-weight: 700;
   }

   .dashboard-welcome p {
     margin: 0;
     font-size: 16px;
     opacity: 0.9;
   }

   .dashboard-status {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 6px;
     background: transparent;
     box-shadow: none;
     padding: 0;
   }

   .status-circle {
     background: linear-gradient(90deg, #10b981 0%, #059669 50%, #047857 100%);
     width: 80px;
     height: 80px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
   }

   .status-dot {
     background: white;
     width: 36px;
     height: 36px;
     border-radius: 50%;
   }

   .dashboard-status strong {
     font-size: 16px;
     font-weight: 700;
     color: white;
     letter-spacing: 1px;
     margin-top: 4px;
   }

   .dashboard-status small {
     font-size: 13px;
     color: white;
     opacity: 0.9;
   }

   .stats-card {
     background: white;
     border-radius: 16px;
     padding: 20px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
     position: relative;
     transition: transform 0.2s ease, box-shadow 0.2s ease;
   }

   .stats-card:hover {
     transform: translateY(-4px);
     box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
   }

   .stats-card .icon {
     width: 48px;
     height: 48px;
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 20px;
     margin-bottom: 14px;
     color: white;
   }

   .stats-card.red .icon {
     background: #EF4444;
   }

   .stats-card.blue .icon {
     background: #2563EB;
   }

   .stats-card.green .icon {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
   }

   .stats-card.orange .icon {
     background: #F97316;
   }

   .stats-card h4 {
     font-size: 28px;
     font-weight: 700;
     margin: 0;
     color: #0F172A;
   }

   .stats-card small {
     display: block;
     margin-top: 4px;
     font-size: 14px;
     color: #64748B;
   }

   .stats-badge {
     position: absolute;
     top: 16px;
     right: 16px;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: #FFFFFF;
     font-size: 12px;
     font-weight: 600;
     padding: 4px 8px;
     border-radius: 12px;
   }


   .quick-actions-wrapper {
     background: white;
     border-radius: 16px;
     padding: 24px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
     margin-bottom: 24px;
   }

   .dashboard-actions-title {
     font-weight: 600;
     font-size: 22px;
     margin-bottom: 20px;
     color: #1E293B;
   }

   .quick-actions {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
     gap: 16px;
   }

   .quick-action-btn {
     border: 1px solid #E2E8F0;
     border-radius: 16px;
     padding: 20px 12px;
     text-align: center;
     background: #F8FAFC;
     cursor: pointer;
     transition: all 0.2s ease;
   }

   .quick-action-btn:hover {
     background: #F1F5F9;
     transform: translateY(-2px);
   }

   .quick-action-btn i {
     background: #2563EB;
     color: white;
     font-size: 18px;
     border-radius: 8px;
     width: 50px;
     height: 50px;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 10px auto;
   }

   .quick-action-btn h6 {
     font-size: 15px;
     font-weight: 600;
     margin-bottom: 4px;
     color: #0F172A;
   }

   .quick-action-btn small {
     display: block;
     font-size: 13px;
     color: #64748B;
   }

   .activity-card {
     background: white;
     border-radius: 16px;
     padding: 20px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
   }

   .activity-card h6 {
     font-weight: 600;
     font-size: 18px;
     margin-bottom: 16px;
     color: #0F172A;
   }

   .activity-item {
     display: flex;
     align-items: flex-start;
     gap: 12px;
     padding: 14px 0;
     border-bottom: 1px solid #E2E8F0;
   }

   .activity-item:last-child {
     border-bottom: none;
   }

   .activity-icon {
     width: 40px;
     height: 40px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     font-size: 16px;
     color: white;
   }

   .activity-icon.red {
     background: #EF4444;
   }

   .activity-icon.blue {
     background: #3B82F6;
   }

   .activity-icon.orange {
     background: #F59E0B;
   }

   .activity-icon.purple {
     background: #8B5CF6;
   }

   .activity-content strong {
     font-size: 15px;
     font-weight: 600;
     display: block;
     color: #1E293B;
   }

   .activity-content p {
     font-size: 14px;
     color: #475569;
     margin: 2px 0;
   }

   .activity-content small {
     font-size: 12px;
     color: #94A3B8;
   }

   .side-card {
     background: white;
     border-radius: 16px;
     padding: 20px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
     margin-bottom: 16px;
   }

   .side-card h6 {
     font-weight: 700;
     font-size: 16px;
     margin-bottom: 12px;
   }

   .account-info {
     display: flex;
     align-items: center;
     gap: 12px;
     margin-bottom: 12px;
   }

   .account-info img {
     width: 50px;
     height: 50px;
     border-radius: 50%;
     object-fit: cover;
   }

   .account-info div strong {
     display: block;
     font-size: 16px;
     color: #0F172A;
   }

   .account-info div small {
     display: flex;
     align-items: center;
     gap: 6px;
     font-size: 13px;
     color: #1FA2FF;
     font-weight: 600;
   }

   .account-plan {
     background: #F8FAFC;
     border-radius: 10px;
     padding: 12px;
     font-size: 14px;
     color: #334155;
     margin-bottom: 12px;
     font-weight: 600;
   }

   .security-alert {
     background: #F1F5F9;
     border-radius: 10px;
     padding: 10px;
     font-size: 14px;
     margin-bottom: 8px;
     color: #64748B;
   }

   .security-alert strong {
     color: #64748B;
     font-weight: 700;
   }

   .manage-plan-btn {
     border: 2px solid #2563EB !important;
     color: #2563EB !important;
     background-color: #FFFFFF !important;
   }

   .manage-plan-btn:hover {
     border: 2px solid #133b90ff !important;
   }

   .account-settings-btn {
     color: #FFFFFF !important;
     background-color: #2563EB !important;
   }

   .account-settings-btn:hover {
     background-color: #133b90ff !important;
   }


   .support-card {
     background: white;
     border-radius: 16px;
     padding: 24px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
     text-align: center;
   }

   .support-inner-box {
     background: #F8FAFC;
     border-radius: 12px;
     padding: 20px;
     margin-bottom: 16px;
   }

   .support-inner-box .support-icon {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     width: 56px;
     height: 56px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
     margin: 0 auto 12px;
     color: white;
     font-size: 24px;
   }

   .support-inner-box p {
     font-size: 15px;
     font-weight: 600;
     color: #0F172A;
     margin-bottom: 6px;
   }

   .support-inner-box a {
     font-size: 18px;
     font-weight: 700;
     color: #2563EB;
     text-decoration: none;
   }

   .support-inner-box small {
     font-size: 13px;
     color: #94A3B8;
   }

   .support-card button {
     border-radius: 8px;
     font-weight: 600;
   }

   .community-form-page-bg {
     background-color: #F8FAFC;
   }

   .search-button {
     background-color: #2563EB !important;
     color: #FFFFFF !important;
   }

   .community-form-page-title {
     font-size: 28px;
     font-weight: 700;
     color: #1E293B;
   }

   .community-form-page-subtitle {
     font-size: 16px;
     color: #64748B;
     max-width: 600px;
     margin: 0 auto;
   }

   .community-form-page-search-bar {
     background: white;
     border-radius: 16px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
     padding: 20px;
   }

   .community-form-page-search-input {
     position: relative;
   }

   .community-form-page-search-input input {
     padding-left: 35px;
     border-radius: 12px;
   }

   .community-form-page-search-input i {
     position: absolute;
     top: 50%;
     left: 10px;
     transform: translateY(-50%);
     color: #94A3B8;
   }

   .community-form-page-filter-btn {
     background: #F1F5F9;
     border: none;
     border-radius: 12px;
     padding: 10px;
     font-weight: 500;
     color: #334155;
     width: 100%;
   }

   .community-form-page-new-topic-btn {
     background: #2563EB;
     color: white;
     border-radius: 12px;
     padding: 10px 20px;
     font-weight: 600;
     border: none;
   }

   .community-form-page-category-card {
     background: white;
     border-radius: 16px;
     padding: 20px 24px;
     margin-bottom: 16px;
     box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
     transition: 0.2s ease-in-out;
   }

   .community-form-page-category-card:hover {
     transform: translateY(-2px);
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
   }

   .community-form-page-category-icon {
     display: flex;
     align-items: center;
     justify-content: center;
     width: 48px;
     height: 48px;
     border-radius: 12px;
     margin-right: 16px;
     font-size: 20px;
     flex-shrink: 0;
   }

   .circle::before {
     content: "";
     display: inline-block;
     width: 8px;
     height: 8px;
     background-color: #64748B;
     border-radius: 50%;
     vertical-align: middle;
     margin-bottom: 2px;
   }

   @media (max-width: 768px) {
     .community-form-page-category-card {
       padding: 16px;
     }

     .community-form-page-category-card .row {
       flex-direction: column;
     }

     .community-form-page-category-card .col-md-8 {
       flex-direction: column !important;
       text-align: center;
       margin-bottom: 12px;
     }

     .community-form-page-category-icon {
       margin: 0 auto 12px auto;
       width: 56px;
       height: 56px;
       font-size: 22px;
     }

     .community-form-page-category-card .col-md-4 {
       text-align: center !important;
     }

     .community-form-page-category-card a {
       display: block;
       font-size: 15px;
       margin-bottom: 4px;
     }
   }

   @media (max-width: 480px) {
     .community-form-page-category-card h5 {
       font-size: 16px;
     }

     .community-form-page-category-card p {
       font-size: 13px;
     }

     .community-form-page-category-card .text-muted.small {
       font-size: 12px;
     }
   }

   .community-form-page-latest-posts {
     background: #fff;
     border-radius: 16px;
     padding: 20px;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
   }



   .latest-post {
     padding: 16px 0;
     border-bottom: 1px solid #E2E8F0;
   }

   .latest-post:last-child {
     border-bottom: none;
   }

   .latest-post-avatar {
     width: 40px;
     height: 40px;
     border-radius: 50%;
     margin-right: 12px;
   }

   .latest-post-content {
     flex: 1;
   }

   .latest-post-top {
     font-size: 14px;
     margin-bottom: 4px;
   }

   .latest-post-author {
     font-weight: 600;
     color: #1E293B;
   }

   .latest-post-tag {
     background: #2563EB;
     color: #FFFFFF;
     font-size: 12px;
     padding: 4px 8px;
     border-radius: 10px;
     margin-left: 6px;
   }

   .latest-post-tag.tag-green {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: #FFFFFF;
   }

   .latest-post-time {
     font-size: 12px;
     color: #64748B;
     margin-left: 6px;
   }

   .latest-post-title {
     display: block;
     font-weight: 500;
     font-size: 15px;
     color: #1E293B;
     margin-bottom: 4px;
   }


   .latest-post-text {
     font-size: 14px;
     color: #475569;
     margin-bottom: 6px;
   }

   .latest-post-meta {
     font-size: 12px;
     color: #64748B;
     display: flex;
     gap: 12px;
   }

   .support-page-bg {
     background-color: #F8FAFC;
   }

   .support-card {
     border-radius: 24px;
     padding: 80px 20px;
     color: white;
     position: relative;
     overflow: hidden;
     text-align: center;
     /* box-shadow: 0 8px 24px rgba(220, 38, 38, 0.3); */
   }

   .support-icon {
     width: 80px;
     height: 80px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.25);
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 24px;
     font-size: 26px;
   }


   .support-dot {
     background: #FFFFFF;
     width: 36px;
     height: 36px;
     border-radius: 50%;
   }

   .support-title {
     font-size: 40px;
     font-weight: 800;
     margin-bottom: 12px;
     color: #FFFFFF;
   }

   .support-subtitle {
     font-size: 20px;
     margin-bottom: 20px;
     opacity: 0.95;
     font-weight: 500;
   }

   .support-number {
     font-size: 48px;
     font-weight: 600;
     margin-bottom: 16px;
     letter-spacing: 3px;
   }

   .support-footer {
     font-size: 16px;
     opacity: 0.85;
   }

   /* Mobil uyum */
   @media (max-width: 768px) {
     .support-card {
       padding: 60px 15px;
     }

     .support-icon {
       width: 48px;
       height: 48px;
       font-size: 20px;
       margin-bottom: 16px;
     }

     .support-title {
       font-size: 28px;
     }

     .support-subtitle {
       font-size: 16px;
     }

     .support-number {
       font-size: 32px;
       letter-spacing: 2px;
     }

     .support-footer {
       font-size: 14px;
     }
   }

   .support-options {
     margin-top: 50px;
   }

   .support-option-card {
     background: #FFFFFF;
     border-radius: 16px;
     padding: 32px 24px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
     text-align: center;
     transition: all 0.2s ease;
     height: 100%;
   }

   .support-option-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 6px 28px rgba(0, 0, 0, 0.1);
   }

   .support-option-icon {
     width: 56px;
     height: 56px;
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     color: white;
     font-size: 24px;
     margin: 0 auto 16px auto;
   }

   .support-option-title {
     font-size: 20px;
     font-weight: 700;
     margin-bottom: 8px;
   }

   .support-option-desc {
     font-size: 14px;
     color: #555;
     margin-bottom: 16px;
     min-height: 40px;
   }

   .support-option-list {
     text-align: left;
     list-style: none;
     padding: 0;
     margin: 0 0 20px 0;
   }

   .support-option-list li {
     font-size: 14px;
     margin-bottom: 8px;
     display: flex;
     align-items: center;
   }



   .support-option-btn {
     display: block;
     width: 100%;
     padding: 10px 0;
     border-radius: 8px;
     color: white;
     font-weight: 600;
     text-decoration: none;
   }


   .support-option-btn-blue {
     background-color: #2563EB;
     color: #FFF;
     transition: all 0.2s ease;
   }

   .support-option-btn-blue:hover {
     background-color: #FFF;
     color: #2563EB;
     border: 1px solid #2563EB;
     transform: translateY(-3px) scale(1.03) !important;
     box-shadow: 0 8px 20px rgb(37 99 235 / 73%);
   }

   .support-option-btn-green {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     transition: all 0.2s ease;
   }


   .support-option-btn-green:hover {
     background-color: #FFF;
     color: #1FA2FF;
     border: 1px solid #1FA2FF;
     transform: translateY(-3px) scale(1.03) !important;
     box-shadow: 0 8px 20px rgba(31, 162, 255, 0.5);
   }

   .support-option-btn-orange {
     background-color: #F97316;
     transition: all 0.2s ease;
   }


   .support-option-btn-orange:hover {
     background-color: #FFF;
     color: #F97316;
     border: 1px solid #F97316;
     transform: translateY(-3px) scale(1.03) !important;
     box-shadow: 0 8px 20px #f9741682;
   }



   .support-option-list li::before {
     content: "";
     display: inline-block;
     width: 14px;
     height: 14px;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     border-radius: 50%;
     margin-right: 10px;
     vertical-align: middle;
   }

   .support-faq-section {
     margin-top: 60px;
     background: #FFFFFF;
     border-radius: 16px;
     padding: 32px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
   }

   .support-faq-title {
     font-size: 20px;
     font-weight: 700;
     margin-bottom: 24px;
     display: flex;
     align-items: center;
     gap: 8px;
   }

   .support-faq-title i {
     background-color: #2563EB;
     color: white;
     border-radius: 50%;
     font-size: 14px;
     padding: 6px;
   }

   .support-faq-item {
     border: 1px solid #E5E7EB;
     border-radius: 10px;
     margin-bottom: 12px;
     overflow: hidden;
     background: #F9FAFB;
     transition: all 0.2s ease;
   }

   .support-faq-header {
     padding: 14px 18px;
     cursor: pointer;
     display: flex;
     justify-content: space-between;
     align-items: center;
     font-weight: 500;
     font-size: 15px;
     color: #1F2937;
   }

   .support-faq-header:hover {
     background: #F3F4F6;
   }

   .support-faq-icon {
     font-size: 14px;
     color: #000000;
     transition: transform 0.2s ease;
     background-color: #E2E8F0;
     padding: 8px;
     border-radius: 12px;
   }

   .support-faq-item.show .support-faq-icon {
     transform: rotate(45deg);
   }

   .support-faq-body {
     background: #F8FAFC;
     border-left: 4px solid #2563EB;
     border-radius: 0 0 10px 10px;
     padding: 16px 20px;
     font-size: 15px;
     color: #334155;
     line-height: 1.6;
     animation: faqFade 0.2s ease-in-out;
   }

   @keyframes faqFade {
     from {
       opacity: 0;
       transform: translateY(-5px);
     }

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

   .accordion-button::after {
     content: none;
   }

   .support-info-section {
     margin-top: 60px;
   }

   .support-info-card {
     background: #FFFFFF;
     border-radius: 16px;
     padding: 20px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
     height: auto;
   }

   .support-ticket {
     display: flex;
     justify-content: space-between;
     align-items: center;
     background: #F9FAFB;
     border-radius: 10px;
     padding: 10px 14px;
     margin-bottom: 10px;
     font-size: 16px;
     font-weight: 500;
   }

   .ticket-status {
     font-size: 12px;
     font-weight: 700;
     padding: 4px 10px;
     border-radius: 8px;
     text-transform: uppercase;
   }

   .status-open {
     background-color: #EF4444;
     color: #FFFFFF;
   }

   .status-pending {
     background-color: #F59E0B;
     color: #FFFFFF;
   }

   .status-closed {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: #FFFFFF;
   }

   .all-tickets-btn {
     display: inline-block;
     text-align: center;
     margin-top: 10px;
     border: 2px solid #2563EB;
     border-radius: 10px;
     padding: 8px 0;
     font-weight: 600;
     color: #2563EB;
     text-decoration: none;
     transition: 0.2s;
   }

   .all-tickets-btn:hover {
     background-color: #2563EB;
     color: white;
   }

   .contact-item {
     display: flex;
     align-items: center;
     gap: 12px;
     padding: 12px;
     background: #F9FAFB;
     border-radius: 12px;
     margin-bottom: 12px;
     transition: 0.2s;
   }

   .contact-item i {
     background-color: #2563EB;
     color: white;
     width: 36px;
     height: 36px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
   }

   .contact-item:hover {
     background: #EFF6FF;
   }

   .stats-box {
     text-align: center;
     background: #F9FAFB;
     padding: 16px;
     border-radius: 12px;
     font-weight: 600;
     color: #64748B;
   }

   .stats-box span {
     font-size: 20px;
     display: block;
     color: #2563EB;
   }

   .about-page-bg {
     background-color: #F8FAFC;
   }

   .about-page-hero {

     color: white;
     position: relative;
     text-align: center;
     padding: 140px 20px 120px;
   }

   .about-page-hero-content {
     position: relative;
     z-index: 1;
     max-width: 900px;
     margin: 0 auto;
   }

   .about-page-hero-title {
     font-size: 36px;
     font-weight: 800;
     margin-bottom: 16px;
   }

   .about-page-hero-subtitle {
     font-size: 18px;
     font-weight: 400;
     margin-bottom: 40px;
     opacity: 0.9;
     line-height: 1.6;
   }

   .about-page-hero-stats {
     display: flex;
     justify-content: center;
     flex-wrap: wrap;
     gap: 60px;
   }

   .about-page-stat-box {
     min-width: 120px;
   }

   .about-page-stat-number {
     font-size: 32px;
     font-weight: 700;
     margin-bottom: 8px;
   }

   .about-page-stat-text {
     font-size: 15px;
     opacity: 0.85;
   }

   @media (max-width: 768px) {
     .about-page-about-hero {
       padding: 80px 20px;
     }

     .about-page-about-hero-title {
       font-size: 26px;
     }

     .about-page-about-hero-stats {
       gap: 30px;
     }

     .about-page-stat-number {
       font-size: 24px;
     }
   }

   .about-page-paragraph {
     font-size: 16px;
     line-height: 1.7;
     color: #1E293B;
     margin-bottom: 14px;
     max-width: 90%;
   }

   .about-page-image {
     width: 240px;
     height: 240px;
     object-fit: cover;
     transition: transform 0.2s ease;
   }

   .about-page-image:hover {
     transform: scale(1.05);
   }


   .about-page-title {
     font-size: 28px;
     font-weight: 700;
   }

   .about-page-subtitle {
     font-size: 16px;
     color: #64748B;
   }




   @media (max-width: 992px) {
     .about-page-container {
       flex-direction: column;
       text-align: center;
     }

     .about-page-right {
       margin-top: 20px;
     }
   }

   .values-section {
     background-color: #F8FAFC;
     padding: 60px 0;
   }

   .value-card {
     background: #FFFFFF;
     border-radius: 16px;
     padding: 30px 20px;
     box-shadow: 0 5px 20px rgba(0, 0, 0, 0.04);
     text-align: center;
     transition: transform 0.2s ease, box-shadow 0.2s ease;
   }

   .value-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
   }

   .value-icon {
     font-size: 28px;
     width: 56px;
     height: 56px;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 16px;
     border-radius: 16px;
     color: white;
   }

   .value-title {
     font-size: 18px;
     font-weight: 700;
     margin-bottom: 10px;
     color: #1E293B;
   }

   .value-text {
     font-size: 14px;
     color: #64748B;
     line-height: 1.6;
     max-width: 260px;
     margin: 0 auto;
   }

   .icon-green {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
   }

   .icon-blue {
     background-color: #2563EB;
   }

   .icon-orange {
     background-color: #F97316;
   }

   .team-section {
     background-color: #F8FAFC;
     padding: 60px 0;
   }

   .team-section h2 {
     font-size: 28px;
     font-weight: 700;
     margin-bottom: 10px;
   }

   .team-section p.section-subtitle {
     font-size: 16px;
     color: #64748B;
     margin-bottom: 40px;
   }

   .team-card {
     background: #FFFFFF;
     border-radius: 16px;
     padding: 30px 20px;
     text-align: center;
     box-shadow: 0 5px 20px rgba(0, 0, 0, 0.04);
     transition: transform 0.2s ease, box-shadow 0.2s ease;
     height: 100%;
   }

   .team-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
   }

   .team-img {
     width: 72px;
     height: 72px;
     object-fit: cover;
     border-radius: 50%;
     margin-bottom: 15px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
   }

   .team-name {
     font-size: 18px;
     font-weight: 700;
     color: #1E293B;
     margin-bottom: 4px;
   }

   .team-role {
     font-size: 14px;
     font-weight: 600;
     color: #2563EB;
     margin-bottom: 12px;
   }

   .team-bio {
     font-size: 14px;
     color: #64748B;
     margin-bottom: 16px;
     line-height: 1.5;
   }

   .team-social a {
     color: #000000;
     font-size: 16px;
     margin: 0 6px;
     transition: color 0.2s ease;
     background-color: #E2E8F0;
     padding: 6px;
     border-radius: 16px;
   }

   .team-social a:hover {
     color: #2563EB;
   }

   .contact-page-bg {
     background-color: #F8FAFC;
   }

   .contact-page-form-card,
   .contact-page-info-card {
     background: #fff;
     border-radius: 16px;
     padding: 30px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
     height: 100%;
   }

   /* Form Alanı */


   .contact-page-form label {
     font-size: 14px;
     font-weight: 600;
     margin-bottom: 6px;
     display: block;
     color: #334155;
   }

   .contact-page-form input,
   .contact-page-form textarea,
   .contact-page-form select {
     width: 100%;
     padding: 10px 14px;
     border: 1px solid #E2E8F0;
     border-radius: 10px;
     font-size: 14px;
     margin-bottom: 16px;
     transition: border-color 0.2s ease;
   }

   .contact-page-form input:focus,
   .contact-page-form textarea:focus,
   .contact-page-form select:focus {
     outline: none;
     border-color: #2563EB;
     box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
   }

   .contact-page-submit-btn {
     background-color: #2563EB;
     color: white;
     border: none;
     padding: 16px 20px;
     border-radius: 10px;
     width: 100%;
     font-weight: 600;
     transition: background 0.2s ease;
   }

   .contact-page-submit-btn:hover {
     background-color: #1E40AF;
   }

   /* İletişim Bilgileri Alanı */
   .contact-page-title {
     font-size: 20px;
     font-weight: 700;
     color: #1E293B;
   }

   .contact-page-subtitle {
     font-size: 14px;
     color: #64748B;
   }

   .contact-page-info-box {
     background: #F8FAFC;
     border-radius: 12px;
     padding: 15px 20px;
     display: flex;
     align-items: flex-start;
     gap: 12px;
     margin-bottom: 16px;
     transition: background 0.2s ease;
   }

   .contact-page-info-box:hover {
     background: #EEF2FF;
   }

   .contact-page-info-icon {
     background: #2563EB;
     color: #FFFFFF;
     font-size: 20px;
     border-radius: 12px;
     padding: 10px;
     display: flex;
     align-items: center;
     justify-content: center;
     min-width: 42px;
     min-height: 42px;
   }

   .contact-page-info-text {
     flex: 1;
   }

   .contact-page-info-text h6 {
     font-size: 16px;
     font-weight: 700;
     margin-bottom: 4px;
   }

   .contact-page-info-text p {
     font-size: 14px;
     color: #64748B;
     margin: 0;
   }

   .contact-page-location-card {
     background: #fff;
     border-radius: 16px;
     padding: 30px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
     margin-top: 40px;
   }


   .contact-page-location-subtitle {
     font-weight: 600;
     color: #0F172A;
     margin-bottom: 10px;
   }

   .contact-page-location-text {
     font-size: 14px;
     color: #334155;
     margin-bottom: 6px;
   }

   .contact-page-location-list i {
     color: #1FA2FF;
     margin-right: 6px;
   }


   .contact-page-icon-bottom {
     width: 16px;
     height: 16px;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     border-radius: 4px;
     display: inline-block;
   }

   .contact-page-map-wrapper {
     border: 2px dashed #CBD5E1;
     border-radius: 12px;
     overflow: hidden;
     height: 100%;
     min-height: 250px;
   }

   .contact-page-map-wrapper iframe {
     width: 100%;
     height: 100%;
     min-height: 250px;
     display: block;
   }

   @media (max-width: 768px) {
     .contact-page-map-wrapper {
       min-height: 200px;
     }
   }

   .kvkk-page-bg {
     background-color: #F8FAFC;
   }

   .kvkk-page-card {
     background: #ffffff;
     border-radius: 16px;
     padding: 40px 30px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
   }

   .kvkk-page-title {
     font-size: 42px;
     font-weight: 600;
     color: #1E293B;
     margin-bottom: 15px;
   }

   .kvkk-page-text {
     font-size: 18px;
     color: #64748B;
     margin-bottom: 20px;
     max-width: 680px;
   }

   .kvkk-page-badge {
     display: inline-block;
     background-color: #3B82F6;
     color: #fff;
     font-size: 14px;
     font-weight: 600;
     padding: 12px 20px;
     border-radius: 20px;
   }

   @media (max-width: 768px) {
     .kvkk-page-card {
       padding: 30px 20px;
     }

     .kvkk-page-title {
       font-size: 22px;
     }

     .kvkk-page-text {
       font-size: 15px;
     }
   }

   .kvkk-page-content-card {
     background: #fff;
     border-radius: 16px;
     padding: 30px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
   }

   .kvkk-page-content-header {
     gap: 10px;
   }

   .kvkk-page-step {
     background-color: #2563EB;
     color: white;
     font-weight: 700;
     border-radius: 8px;
     padding: 4px 10px;
     font-size: 14px;
   }

   .kvkk-page-section-title {
     font-size: 28px;
     font-weight: 600;
     color: #1E293B;
   }

   .kvkk-page-section-subtitle {
     font-size: 14px;
     color: #64748B;
     margin-bottom: 15px;
   }

   .kvkk-page-section-text {
     font-size: 15px;
     color: #475569;
     margin-bottom: 12px;
   }

   .kvkk-page-info-box {
     background-color: #3B82F6;
     color: #fff;
     border-radius: 12px;
     padding: 15px 20px;
   }

   .kvkk-page-info-title {
     font-weight: 700;
     margin-bottom: 5px;
   }

   .kvkk-page-contact-card {
     background: #F8FAFC;
     border-radius: 16px;
     padding: 30px 20px;
     border: 1px solid #E2E8F0;
   }

   .kvkk-page-contact-title {
     font-size: 24px;
     font-weight: 600;
     color: #1E293B;
     margin-bottom: 8px;
   }

   .kvkk-page-contact-text {
     font-size: 16px;
     color: #64748B;
   }

   .kvkk-page-contact-buttons {
     gap: 12px;
   }

   .kvkk-page-contact-btn {
     background-color: #2563EB;
     color: white;
     font-weight: 600;
     padding: 12px 22px;
     border-radius: 8px;
     text-decoration: none;
     transition: background 0.2s ease;
   }

   .kvkk-page-contact-btn:hover {
     background-color: #1E40AF;
   }

   .kvkk-page-data-types {
     margin-top: 20px;
   }

   .kvkk-page-data-title {
     font-size: 20px;
     font-weight: 600;
     color: #1E293B;
     margin-top: 20px;
   }

   .kvkk-page-data-list {
     list-style: disc;
     padding-left: 20px;
     margin-top: 8px;
   }

   .kvkk-page-data-list li {
     font-size: 15px;
     color: #475569;
     margin-bottom: 6px;
   }

   .kvkk-page-data-list span {
     color: #2563EB;
     font-weight: 700;
     font-size: 16px;
   }

   .kvkk-page-warning-box {
     background-color: #FEF3C7;
     border: 2px solid #F59E0B;
     border-radius: 8px;
     padding: 12px 16px;
   }

   .kvkk-page-warning-box-title {
     font-size: 16px;
     color: #F59E0B;
   }

   .kvkk-page-warning-box-subtitle {
     font-size: 14px;
     color: #92400E;
   }

   .kvkk-page-info-icon-bottom {
     width: 14px;
     height: 14px;
     background-color: #F59E0B;
     border-radius: 4px;
     display: inline-block;
   }

   .kvkk-page-badge-green {
     display: inline-block;
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: #fff;
     font-size: 14px;
     font-weight: 600;
     padding: 12px 20px;
     border-radius: 20px;
   }

   .kvkk-page-contact-title-blue {
     font-size: 24px;
     font-weight: 600;
     color: #2563EB;
     margin-bottom: 8px;
     text-align: start;
   }

   .kvkk-page-category-box {
     background: #F8FAFC;
     border: 1px solid #E2E8F0;
     border-radius: 12px;
     padding: 20px 18px;
     height: 100%;
     transition: all 0.2s ease-in-out;
   }

   .kvkk-page-category-box:hover {
     background: #F1F5F9;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
   }

   .kvkk-page-category-box .kvkk-page-data-title {
     font-size: 16px;
     font-weight: 600;
     color: #2563EB;
     margin-bottom: 10px;
   }


   .kvkk-page-category-box .kvkk-page-data-list {
     list-style-type: disc;
     padding-left: 20px;
     margin: 0;
   }

   .kvkk-page-category-box .kvkk-page-data-list li {
     font-size: 15px;
     color: #334155;
     margin-bottom: 6px;
   }

   @media (max-width: 768px) {
     .kvkk-page-category-box {
       padding: 16px;
     }

     .kvkk-page-category-box .kvkk-page-data-title {
       font-size: 15px;
     }

     .kvkk-page-category-box .kvkk-page-data-list li {
       font-size: 14px;
     }
   }

   .blogs-filter-btn {
     border: 1px solid #E2E8F0;
     background: #F8FAFC;
     color: #334155;
     padding: 12px 14px;
     border-radius: 20px;
     font-size: 14px;
     transition: all 0.2s ease-in-out;
   }

   .blogs-filter-btn:hover {
     background: #E2E8F0;
   }

   .blogs-filter-btn.active {
     background: #2563EB;
     color: #fff;
     border-color: #2563EB;
   }

   @media (max-width: 768px) {
     .blogs-filter-btn {
       font-size: 13px;
       padding: 6px 12px;
     }
   }

   .alerts-section {
     background: #FFFFFF;
     border-radius: 12px;
     padding: 20px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
   }

   .alert-card {
     background: #F1F5F9;
     border-radius: 10px;
     padding: 16px;
     transition: all 0.2s ease-in-out;
   }

   .alert-card:hover {
     background: #E2E8F0;
   }

   .alert-badge {
     display: inline-block;
     background: #EF4444;
     color: #fff;
     font-size: 12px;
     font-weight: 600;
     padding: 4px 10px;
     border-radius: 12px;
     margin-bottom: 8px;
   }

   .alert-card-title {
     font-size: 18px;
     font-weight: 600;
     color: #0F172A;
     margin-bottom: 6px;
   }

   .alert-card-text {
     font-size: 16px;
     color: #475569;
     margin-bottom: 0;
   }

   .blog-card {
     background: #F8FAFC;
     border-radius: 12px;
     padding: 20px;
     transition: 0.2s ease-in-out;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
   }

   .blog-card:hover {
     background: #F1F5F9;
   }

   .blog-category {
     display: inline-block;
     background: #2563EB;
     color: #FFFFFF;
     font-size: 12px;
     font-weight: 600;
     padding: 3px 10px;
     border-radius: 12px;
     margin-bottom: 6px;
   }

   .blog-date {
     display: block;
     font-size: 12px;
     color: #64748B;
     margin-bottom: 8px;
   }

   .blog-card-title {
     font-size: 16px;
     font-weight: 600;
     color: #0F172A;
     margin-bottom: 6px;
   }

   .blog-card-text {
     font-size: 14px;
     color: #475569;
     margin-bottom: 10px;
   }

   .blog-read-more {
     font-size: 14px;
     font-weight: 500;
     color: #2563EB;
   }

   .magazine-card {
     background: #fff;
     border: 1px solid #E2E8F0;
     border-radius: 12px;
     padding: 20px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
   }

   .magazine-title {
     font-size: 14px;
     font-weight: 600;
     color: #475569;
     margin-bottom: 4px;
   }

   .magazine-date {
     font-size: 12px;
     color: #94A3B8;
     margin-bottom: 8px;
     display: block;
   }

   .magazine-heading {
     font-size: 18px;
     font-weight: 700;
     color: #0F172A;
     margin-bottom: 6px;
   }

   .magazine-text {
     font-size: 14px;
     color: #475569;
     margin-bottom: 12px;
   }

   .magazine-btn {
     display: inline-block;
     background: #2563EB !important;
     color: #FFFFFF !important;
     font-weight: 600;
     padding: 8px 14px;
     border-radius: 8px;
     text-decoration: none;
     font-size: 14px;
   }

   .magazine-subcard {
     background-color: #F8FAFC;
     border-radius: 12px;
     padding: 15px;
     text-align: center;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
   }

   .last-blogs-card {
     background: #fff;
     border: 1px solid #E2E8F0;
     border-radius: 12px;
     padding: 20px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
   }

   .document-upload-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
   }

   .document-upload-title {
     font-size: 18px;
     font-weight: 700;
     color: #0F172A;
   }

   .document-upload-subtitle {
     font-size: 14px;
     color: #64748B;
   }

   .upload-box {
     border: 2px dashed #CBD5E1;
     background: #F8FAFC;
     border-radius: 12px;
     padding: 100px 20px;
     text-align: center;
     transition: all 0.2s ease-in-out;
   }

   .upload-box:hover {
     border-color: #3B82F6;
     background: #F1F5F9;
   }

   .upload-icon {
     background: #3B82F6;
     color: white;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 20px;
   }

   .upload-text {
     font-size: 20px;
     font-weight: 600;
     color: #0F172A;
   }

   .upload-or-text {
     font-size: 14px;
     color: #94A3B8;
   }

   .upload-btn {
     background: #2563EB;
     color: white;
     padding: 6px 16px;
     border-radius: 8px;
     font-weight: 600;
     cursor: pointer;
     font-size: 14px;
     display: inline-block;
   }

   .upload-btn:hover {
     background: #1D4ED8;
   }

   .analysis-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
   }

   .analysis-title {
     font-size: 22px;
     font-weight: 700;
     color: #0F172A;
   }

   .analysis-subtitle {
     font-size: 14px;
     color: #64748B;
   }

   .analysis-card .form-control,
   .analysis-card .form-select {
     border-radius: 8px;
     border: 1px solid #CBD5E1;
     padding: 10px 12px;
     font-size: 14px;
   }

   .analysis-card .form-control:focus,
   .analysis-card .form-select:focus {
     border-color: #3B82F6;
     box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
   }

   .analysis-submit-btn {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
     color: white;
     font-weight: 600;
     padding: 10px;
     border-radius: 8px;
     transition: background 0.2s ease-in-out;
   }

   .analysis-submit-btn:hover {
     background: #059669;
   }

   .security-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
   }

   .security-title {
     font-size: 20px;
     font-weight: 700;
     color: #0F172A;
   }

   .security-text {
     font-size: 14px;
     color: #64748B;
     line-height: 1.5;
   }

   .tip-item {
     background: #F8FAFC;
     padding: 10px 12px;
     border-radius: 8px;
   }

   .tip-item strong {
     font-size: 16px;
     color: #0F172A;
   }

   .analysis-time {
     font-size: 12px;
     color: #64748B;
     white-space: nowrap;
     margin-left: 8px;
   }

   .badge {
     display: inline-block;
     padding: 4px 12px;
     font-size: 11px;
     font-weight: 600;
     border-radius: 12px;
     color: white;
   }

   .status-danger {
     background-color: #EF4444;
   }

   .status-warning {
     background-color: #F59E0B;
   }

   .status-success {
     background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
   }

   .phone-query-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
   }

   .phone-input {
     max-width: 400px;
     border-radius: 8px;
     font-size: 18px;
     padding: 14px 10px;
     border: 2px solid #E2E8F0;
     background-color: #F8FAFC;
     text-align: center;
   }

   .phone-btn {
     border-radius: 8px;
     font-weight: 600;
     padding: 14px 20px;
     background-color: #2563EB !important;
     color: white !important;
   }

   .phone-btn:hover {
     background-color: #1E40AF;
   }

   .recent-searches-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
   }


   .recent-search-item {
     background: #f9fafb;
     border-radius: 8px;
   }

   .status-dot {
     display: inline-block;
     width: 18px;
     height: 18px;
     border-radius: 50%;
   }

   .report-number-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
   }

   .report-form {
     border-radius: 12px;
     background: #f9fafb;
   }

   .report-form .form-control,
   .report-form .form-select {
     border-radius: 8px;
   }

   .report-form button {
     border-radius: 8px;
     font-weight: 500;
   }

   .stats-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
   }

   .stats-card h5 {
     font-weight: 600;
   }

   .stats-card .border-bottom:last-child {
     border-bottom: none !important;
   }

   .dangerous-numbers-card {
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
   }

   .dangerous-number-item {
     background: #f9fafb;
     border: 1px solid #eee;
     transition: background 0.2s ease;
   }

   .dangerous-number-item:hover {
     background: #f1f3f5;
   }

   .btn-heart.active img {
     filter: grayscale(0%) brightness(1.2) saturate(1.5);
   }

   .user-menu {
     display: inline-block;
     position: relative;
     cursor: pointer;
   }

   .user-avatar,
   .user-avatar-placeholder {
     width: 40px;
     height: 40px;
     border-radius: 50%;
     background: #e9ecef;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: bold;
     color: #495057;
     text-transform: uppercase;
     transition: background 0.2s;
   }

   .user-avatar-placeholder:hover {
     background: #dee2e6;
   }

   .avatar-dropdown {
     display: none;
     position: absolute;
     right: 0;
     top: 110%;
     min-width: 180px;
     background: #fff;
     border: 1px solid #ddd;
     border-radius: 8px;
     padding: 0.5rem 0;
     z-index: 1000;
   }

   .user-menu:hover .avatar-dropdown {
     display: block;
   }

   .payment-page-method-btn {
     border: 2px solid #ddd;
     border-radius: 10px;
     padding: 15px;
     cursor: pointer;
     transition: all 0.2s ease;
     margin-bottom: 10px;
   }

   .payment-page-method-btn.active {
     border-color: #007bff;
     background-color: #f0f8ff;
     box-shadow: 0 0 10px rgba(0, 123, 255, 0.3);
   }

   /* Inputları görünmez yap (tıklamayı div'e taşıyoruz) */
   .payment-page-method-btn input[type="radio"] {
     display: none;
   }

   .dashboard-sidebar {
     background: #fff;
     border-radius: 1rem;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
     overflow: hidden;
   }

   .dashboard-sidebar a {
     display: flex;
     align-items: center;
     padding: 14px 16px;
     font-weight: 500;
     color: #333;
     border-left: 4px solid transparent;
     transition: all 0.2s ease;
   }

   .dashboard-sidebar a:hover {
     background: #f8f9fa;
     border-left-color: #0d6efd;
   }

   .dashboard-sidebar a.active {
     background: #e9f2ff;
     border-left-color: #0d6efd;
     font-weight: 600;
     color: #0d6efd;
   }

   .dashboard-card {
     background: #fff;
     border-radius: 1rem;
     box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
     padding: 2rem;
   }

   .dashboard-header {
     font-size: 1.4rem;
     font-weight: 600;
     margin-bottom: 1.5rem;
     display: flex;
     align-items: center;
     gap: 10px;
   }

   /* Sol Menü Tasarımı */
   .dashboard-sidebar {
     background: #fff;
     border-radius: 1rem;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
     overflow: hidden;
   }

   .dashboard-sidebar a {
     display: flex;
     align-items: center;
     padding: 14px 16px;
     font-weight: 500;
     color: #333;
     border-left: 4px solid transparent;
     transition: all 0.2s ease;
   }

   .dashboard-sidebar a:hover {
     background: #f8f9fa;
     border-left-color: #0d6efd;
   }

   .dashboard-sidebar a.active {
     background: #e9f2ff;
     border-left-color: #0d6efd;
     font-weight: 600;
     color: #0d6efd;
   }

   /* Sağ İçerik Kart */
   .dashboard-card {
     background: #fff;
     border-radius: 1rem;
     box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
     padding: 2rem;
   }

   /* Başlık */
   .dashboard-header {
     font-size: 1.5rem;
     font-weight: 600;
     margin-bottom: 1.5rem;
     display: flex;
     align-items: center;
     gap: 10px;
   }

   /* Form Inputlar */
   .form-floating label {
     color: #6c757d;
   }

   .dashboard-sidebar {
     background: #fff;
     border-radius: 1rem;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
     overflow: hidden;
   }

   .dashboard-sidebar a {
     display: flex;
     align-items: center;
     padding: 14px 16px;
     font-weight: 500;
     color: #333;
     border-left: 4px solid transparent;
     transition: all 0.2s ease;
   }

   .dashboard-sidebar a:hover {
     background: #f8f9fa;
     border-left-color: #0d6efd;
   }

   .dashboard-sidebar a.active {
     background: #e9f2ff;
     border-left-color: #0d6efd;
     font-weight: 600;
     color: #0d6efd;
   }

   .orders-card {
     background: #fff;
     border-radius: 1rem;
     box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
     padding: 2rem;
   }

   .orders-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 1.5rem;
   }

   .orders-header h4 {
     font-size: 1.4rem;
     font-weight: 600;
   }

   .table thead {
     background: #f8f9fa;
   }

   .table th {
     font-weight: 600;
   }

   .badge {
     font-size: 0.85rem;
     padding: 6px 10px;
     border-radius: 6px;
   }

   /* Modal Tasarımı */
   .custom-modal .modal-content {
     border-radius: 20px;
     border: none;
     box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.15);
     background: #ffffff;
   }

   .custom-modal .modal-header {
     border-bottom: none;
     background: linear-gradient(135deg, #3b82f6, #1e40af);
     color: white;
     border-radius: 20px 20px 0 0;
     padding: 1rem 1.5rem;
   }

   .custom-modal .modal-title {
     font-weight: bold;
     font-size: 1.2rem;
   }

   .custom-modal .modal-body {
     padding: 1.5rem;
   }

   /* Kart Tasarımı */
   .number-card {
     background: #f9fafb;
     border-radius: 15px;
     padding: 1rem;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
     transition: 0.2s ease-in-out;
   }

   .number-card:hover {
     transform: translateY(-3px);
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   }

   .number-card h5 {
     font-weight: bold;
     color: #111827;
   }

   .number-card .badge {
     font-size: 0.8rem;
     padding: 6px 10px;
     border-radius: 50px;
   }

   /* Yükleniyor Animasyonu */
   .loading-spinner {
     color: #2563eb;
     font-size: 2rem;
     animation: spin 1s linear infinite;
   }

   @keyframes spin {
     from {
       transform: rotate(0deg);
     }

     to {
       transform: rotate(360deg);
     }
   }

   /* Temel slider stacking + animasyon (senin CSS'inle birlikte çalışır) */
   .hero-slider {
     position: relative;
     overflow: hidden;
     width: 100%;
     transition: height 300ms ease;
     margin-top: -80px;
     z-index: 1;
   }

   .hero-slider .slide {
     position: absolute;
     inset: 0;
     box-sizing: border-box;
     opacity: 0;
     visibility: hidden;
     pointer-events: none;
     transform: translateY(8px);
     transition: opacity .6s ease, transform .6s ease, visibility 0ms linear .6s;
     z-index: 1;
   }

   .hero-slider .slide.active {
     opacity: 1;
     visibility: visible;
     pointer-events: auto;
     transform: translateY(0);
     z-index: 2;
     transition-delay: 0ms;
   }


   /* Kontroller küçük stil */
   .hero-slider-controls {
     display: flex;
     gap: 10px;
     justify-content: center;
     margin-top: 12px;
   }

   .hero-slider-controls .btn {
     min-width: 44px;
     min-height: 44px;
     border-radius: 8px;
   }

   /* Slider container */
   .hero-slider {
     position: relative;
     overflow: hidden;
   }

   /* Butonların genel görünümü */
   .slider-btn {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     z-index: 10;
     background: rgba(255, 255, 255, 0.8);
     color: #2563EB;
     border: none;
     width: 50px;
     height: 50px;
     border-radius: 50%;
     font-size: 24px;
     font-weight: bold;
     cursor: pointer;
     transition: all 0.2s ease;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   }

   .slider-btn:hover {
     background: #2563EB;
     color: #fff;
   }

   /* Sol buton */
   .slider-btn.prev {
     left: 20px;
   }

   /* Sağ buton */
   .slider-btn.next {
     right: 20px;
   }

   /* Mobil uyum */
   @media (max-width: 768px) {
     .slider-btn {
       width: 40px;
       height: 40px;
       font-size: 20px;
     }

     .slider-btn.prev {
       left: 10px;
     }

     .slider-btn.next {
       right: 10px;
     }
   }


   /* Başlangıçta gizle */
   .scroll-animate {
     opacity: 0;
     transition: opacity 0.8s ease-out, transform 0.8s ease-out;
   }

   /* Göründüğünde */
   .scroll-animate.visible {
     opacity: 1;
   }

   /* Hafif parallax */
   .parallax {
     will-change: transform;
     transition: transform 0.2s linear;
   }


   /* Soldan giriş */
   .scroll-animate.slide-in-left {
     transform: translateX(-50px);
   }

   .scroll-animate.slide-in-left.visible {
     transform: translateX(0);
   }

   /* Sağdan giriş */
   .scroll-animate.slide-in-right {
     transform: translateX(-50px);
   }

   .scroll-animate.slide-in-right.visible {
     transform: translateX(0);
   }

   .font-size-20 {
     font-size: 20px;
   }

   /* Features section için yüzen ikon konteynırı */
   #floating-objs-features {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     pointer-events: none;
     z-index: 0;
   }

   /* Ortak ikon stilleri */
   .floating-item-features {
     position: absolute;
     opacity: 0.2;
     width: 120px;
     animation: float 6s ease-in-out infinite;
   }

   /* Konumlandırmalar */
   .floating-left {
     top: 15%;
     left: 5%;
   }

   .floating-right {
     top: 10%;
     right: 5%;
   }

   .floating-bottom-left {
     top: 80%;
     left: 5%;
   }

   .floating-bottom-right {
     top: 80%;
     right: 5%;
   }

   /* Animasyon keyframes */
   @keyframes float {
     0% {
       transform: translateY(0px);
     }

     50% {
       transform: translateY(-20px);
     }

     100% {
       transform: translateY(0px);
     }
   }

   /* Hero slider için yüzen ikon stilleri */
   #floating-objs-hero {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     pointer-events: none;
     z-index: 0;
   }

   .floating-item-hero {
     position: absolute;
     opacity: 0.2;
     width: 120px;
   }

   /* Sol alt ikon */
   .floating-left {
     bottom: 10%;
     left: 5%;
     animation: floatY 6s ease-in-out infinite;
   }

   .floating-slider {
     top: 10%;
     left: 25%;
     animation: floatY 6s ease-in-out infinite;
   }

   /* Yukarı-aşağı animasyon */
   @keyframes floatY {
     0% {
       transform: translateY(0px);
     }

     50% {
       transform: translateY(-20px);
     }

     100% {
       transform: translateY(0px);
     }
   }

   /* Sağa-sola animasyon */
   @keyframes floatX {
     0% {
       transform: translateX(0px);
     }

     50% {
       transform: translateX(20px);
     }

     100% {
       transform: translateX(0px);
     }
   }

   /* İçerik ikonların önünde gözüksün */
   .hero-section .container {
     position: relative;
     z-index: 1;
   }



   .btn-special {
     background-color: #2563EB;
     color: #FFF;
     transition: all 0.2s ease;
   }


   .btn-special:hover {
     background-color: #FFF;
     color: #2563EB;
     border: 1px solid #2563EB;
     transform: translateY(-3px) scale(1.03) !important;
     box-shadow: 0 8px 20px rgb(37 99 235 / 73%);
   }

   /* Başlangıç: görüntülenmeden önce gizli ve hafif aşağıda */
   .fade-parallax {
     opacity: 0;
     transform: translateY(20px);
     transition: opacity 200ms ease-out, transform 400ms cubic-bezier(.2, .8, .2, 1);
     will-change: transform, opacity;
     /* performans önerisi */
   }

   /* Göründüğünde: opacity tam, konum normale dönsün */
   .fade-parallax.in-view {
     opacity: 1;
     transform: translateY(0);
   }

   /* WhatsApp Floating Button */
   .whatsapp-float {
     position: fixed;
     left: 20px;
     bottom: 40px;
     background-color: #25d366;
     color: #fff;
     font-size: 30px;
     padding: 10px;
     border-radius: 18px;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
     z-index: 999;
     transition: transform 0.3s ease, background 0.3s ease !important;
   }

   .whatsapp-float:hover {
     background-color: #20b954;
     transform: scale(1.1);
   }

   .logo-animate {
     display: inline-block;
     animation: logoFloat 4s ease-in-out infinite;
     transform-origin: center center;
     /* Ortadan sallansın */
   }

   @keyframes logoFloat {
     0% {
       transform: translateX(0) rotate(0deg) scale(1);
     }

     25% {
       transform: translateX(6px) rotate(2deg) scale(1.05);
     }

     50% {
       transform: translateX(0) rotate(0deg) scale(1);
     }

     75% {
       transform: translateX(-6px) rotate(-2deg) scale(1.05);
     }

     100% {
       transform: translateX(0) rotate(0deg) scale(1);
     }
   }

   .why-us-img {
     width: 50%;
     height: auto;
   }

   .footer-social a {
     display: inline-block;
     margin: 6px 4px;
     font-size: 16px;
     color: #fff;
     background: #333;
     padding: 10px;
     border-radius: 15px;
     transition: all 0.3s ease;
   }

   .footer-social a:hover {
     background: #2563EB;
     color: #fff;
   }

   .timeline {
     position: relative;
     margin: 0 auto;
     padding: 20px 0;
     max-width: 900px;
   }

   .timeline::before {
     content: "";
     position: absolute;
     top: 0;
     bottom: 0;
     left: 50%;
     width: 3px;
     background: linear-gradient(to bottom, #0d6efd, #6f42c1);
     transform: translateX(-50%);
     border-radius: 3px;
   }

   .timeline-item {
     position: relative;
     width: 50%;
     padding: 20px 40px;
   }

   .timeline-item:nth-child(odd) {
     left: 0;
     text-align: right;
   }

   .timeline-item:nth-child(even) {
     left: 50%;
     text-align: left;
   }

   .timeline-dot {
     position: absolute;
     top: 30px;
     left: 50%;
     width: 18px;
     height: 18px;
     background: #fff;
     border: 4px solid #0d6efd;
     border-radius: 50%;
     transform: translateX(-50%);
     box-shadow: 0 0 15px rgba(13, 110, 253, 0.5);
     z-index: 1;
   }

   .timeline-content {
     background: #fff;
     padding: 20px;
     border-radius: 12px;
     box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
     display: inline-block;
     min-width: 220px;
     max-width: 320px;
     animation: fadeInUp 0.8s ease-out both;
   }

   .timeline-content h4 {
     margin: 0 0 10px;
     color: #0d6efd;
     font-weight: 600;
   }

   .timeline-content p {
     margin: 0;
     color: #444;
     font-size: 0.95rem;
     line-height: 1.5;
   }

   /* Animasyon */
   @keyframes fadeInUp {
     from {
       opacity: 0;
       transform: translateY(40px);
     }

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

   /* Mobil uyumluluk */
   @media (max-width: 767px) {
     .timeline::before {
       left: 15px;
     }

     .timeline-item {
       width: 100%;
       padding-left: 50px;
       padding-right: 20px;
       margin-bottom: 40px;
       text-align: left !important;
     }

     .timeline-item:nth-child(odd),
     .timeline-item:nth-child(even) {
       left: 0;
     }

     .timeline-dot {
       left: 15px;
       transform: none;
     }

     .timeline-content {
       max-width: 100%;
     }
   }




   .feature-icon {
     font-size: 2rem;
     color: #0d6efd;
     margin-bottom: 10px;
     animation: pulse 2s infinite;
   }

   @keyframes pulse {

     0%,
     100% {
       transform: scale(1);
     }

     50% {
       transform: scale(1.2);
     }
   }

   .app-screenshots img {
     transition: transform 0.3s;
     width: auto;
     height: 400px;
   }

   .app-screenshots img:hover {
     transform: scale(1.05);
   }

   .video-card {
     position: relative;
     overflow: hidden;
     border-radius: 1rem;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .video-card img {
     transition: transform 0.4s ease;
   }

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

   .video-card .overlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.4));
     opacity: 0;
     transition: opacity 0.3s ease;
     border-radius: 1rem;
   }

   .video-card:hover .overlay {
     opacity: 1;
   }

   .play-btn {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     border: none;
     background: linear-gradient(135deg, #2563eb, #3b82f6);
     color: #fff;
     font-size: 2rem;
     border-radius: 50%;
     width: 70px;
     height: 70px;
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 8px 20px rgba(37, 99, 235, 0.5);
     transition: all 0.3s ease;
   }

   .play-btn:hover {
     transform: translate(-50%, -50%) scale(1.1);
     background: linear-gradient(135deg, #1d4ed8, #2563eb);
   }

   /* Mobile optimizasyon */
   @media (max-width: 576px) {
     .play-btn {
       width: 55px;
       height: 55px;
       font-size: 1.5rem;
     }
   }

   .app-banner {
     border-radius: 20px;
     padding: 60px 20px;
   }

   .phone-mockup {
     max-width: 300px;
     animation: float 3s ease-in-out infinite;
   }

   /* Mobil için (768px altı örnek) */
   @media (max-width: 768px) {
     .phone-mockup {
       max-width: 200px;
       /* daha küçük yap */
       animation: floatMobile 4s ease-in-out infinite;
       /* farklı animasyon */
     }
   }


   @keyframes float {
     0% {
       transform: translateY(0);
     }

     50% {
       transform: translateY(-10px);
     }

     100% {
       transform: translateY(0);
     }
   }

   .banner-title {
     font-size: 2rem;
     line-height: 1.4;
   }

   .banner-desc {
     font-size: 1.1rem;
     color: #333;
   }

   .comparison-table {
     width: 100%;
     border-collapse: collapse;
     text-align: center;
   }

   .comparison-table th,
   .comparison-table td {
     padding: 15px;
     border: 1px solid #eee;
     vertical-align: middle;
   }

   .comparison-table th {
     background: #fff;
     font-size: 14px;
     font-weight: 600;
     color: #333;
   }

   .comparison-table td:first-child {
     text-align: left;
     width: 250px;
     font-size: 14px;
     font-weight: 500;
     color: #333;
   }

   .comparison-table td:first-child span {
     display: block;
     font-size: 12px;
     font-weight: normal;
     color: #666;
   }

   .fa-circle-check {
     color: #0d6efd;
     font-size: 46px;
   }

   .fa-circle-xmark {
     color: #dc3545;
     font-size: 46px;
   }

   .testimonial-card {
     transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .testimonial-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
   }

   .testimonial-text {
     font-size: 15px;
     line-height: 1.6;
     color: #555;
   }

   .smartwatch-page-cta-btn {
     display: inline-block;
     background: #2563EB;
     color: #fff;
     font-weight: bold;
     padding: 12px 30px;
     border-radius: 50px;
     font-size: 18px;
     text-decoration: none;
     transition: all 0.3s ease;
   }

   .smartwatch-page-cta-btn:hover {
     background: #1f57cf;
     transform: scale(1.05);
     color: #fff;
   }

   .video-wrapper {
     border: 5px solid #fff;
     /* Beyaz çerçeve */
     border-radius: 12px;
     /* Köşe yuvarlama */
     overflow: hidden;
     /* Taşmayı gizle */
     background: #000;
     /* Siyah arka plan */
   }

   .callbroker-page-hero-section {
     min-height: 80vh;
     color: #000;
     padding: 60px 0;
   }

   .callbroker-page-hero-section h1 {
     font-size: 2.2rem;
     line-height: 1.2;
   }

   .callbroker-page-hero-section p {
     font-size: 1rem;
   }

   /* Mobil için ayarlamalar */
   @media (max-width: 768px) {
     .callbroker-page-hero-section {
       text-align: center;
       padding: 40px 20px;
     }

     .callbroker-page-hero-section h1 {
       font-size: 1.8rem;
     }

     .callbroker-page-hero-section p {
       font-size: 0.95rem;
     }

     .callbroker-page-hero-section img {
       max-width: 85%;
       margin-top: 20px;
     }
   }

   .callbroker-page-features-section {
     background: #2563EB;
     padding-top: 2rem;
     padding-bottom: 2rem;
   }



   .app-hero-section {
     position: relative;
     min-height: 100vh;
     background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.25) 0%, transparent 50%),
       linear-gradient(135deg, #e5edff 0%, #4a7efc 45%, #012b91 100%);
     overflow: hidden;
     color: #001b36;
   }

   .app-hero-text h1 {
     max-width: 100%;
     font-size: 76px;
     line-height: 90px;
   }

   .app-hero-text p {
     color: #1b3850;
   }

   .app-btn-dark {
     background-color: #001b36 !important;
     border: none;
   }

   .app-btn-dark:hover {
     background-color: #022a56 !important;
   }

   .app-phone-img {
     max-width: 400px;
     position: relative;
     z-index: 2;
   }

   .report-banner {
     background: linear-gradient(135deg, #012b91 0%, #4a7efc 45%, #e5edff 100%);
     border-radius: 32px;
     padding: 40px 70px 0px 70px;
     max-width: 1240px;
     width: 100%;
     color: #fff;
     overflow: hidden;
     position: relative;
   }

   .report-content {
     max-width: 550px;
     z-index: 2;
   }

   .report-content h2 {
     font-family: "Aeonik", sans-serif;
     font-size: 44px;
     font-weight: 600;
     line-height: 1.2;
   }

   .btn-read {
     display: inline-block;
     border: 1px solid #fff;
     border-radius: 50px;
     padding: 10px 28px;
     color: #fff;
     font-weight: 500;
     text-decoration: none;
     transition: all 0.3s ease;
   }

   .btn-read:hover {
     background-color: #fff;
     color: #012b91;
   }

   /* Sağ taraftaki görsel */
   .report-image {
     flex: 1;
     display: flex;
     justify-content: flex-end;
     align-items: center;
     position: relative;
   }

   .report-img {
     max-width: 480px;
     width: 100%;
     height: auto;
     border-radius: 24px;
     object-fit: contain;
     transform: translateY(0);
     transition: transform 0.5s ease;
   }

   .report-img:hover {
     transform: translateY(-5px);
   }

   /* Responsive */
   @media (max-width: 992px) {
     .report-banner {
       flex-direction: column;
       text-align: center;
       padding: 40px 30px;
     }

     .report-content {
       max-width: 100%;
       margin-bottom: 30px;
     }

     .report-image {
       justify-content: center;
     }

     .report-img {
       max-width: 320px;
     }
   }

   /* Genel alan */
   .report-highlight {
     padding: 100px 0;
     background-color: #f8fafc;
   }

   .heading-81 {
     color: #010838;
     font-family: Aeonik, sans-serif;
     font-size: 64px;
     font-weight: 400;
     line-height: 1.2;
   }

   .report-img {
     max-width: 320px;
     transition: transform 0.3s ease;
   }

   .report-img:hover {
     transform: scale(1.03);
   }

   /* Sağdaki içerik */
   .report-info {
     color: #001b36;
   }

   .feature-block {
     display: flex;
     align-items: flex-start;
     gap: 15px;
     margin-bottom: 40px;
   }

   .icon-box {
     background-color: #eef2ff;
     color: #001b36;
     border-radius: 12px;
     padding: 10px 12px;
     font-size: 20px;
     display: flex;
     align-items: center;
     justify-content: center;
     min-width: 44px;
     height: 44px;
   }

   .app-feature-title {
     font-size: 22px;
     font-weight: 600;
     margin-bottom: 6px;
     color: #010838;
   }

   .app-feature-desc {
     color: #3a5266;
     font-size: 16px;
     line-height: 1.6;
   }

   /* Buton */
   .btn-view {
     display: inline-block;
     background-color: #010838;
     color: #012b91;
     border-radius: 40px;
     padding: 12px 36px;
     font-weight: 500;
     text-decoration: none;
     transition: all 0.3s ease;
   }

   .btn-view:hover {
     background-color: #012b91;
     color: #010838;
   }

   /* Responsive */
   @media (max-width: 992px) {
     .heading-81 {
       font-size: 42px;
       line-height: 1.3;
     }

     .report-highlight {
       padding: 60px 0;
     }

     .feature-block {
       flex-direction: column;
       text-align: center;
       align-items: center;
     }

     .report-info {
       text-align: center;
     }

     .btn-view {
       margin-top: 20px;
     }
   }




   .reviews-section {
     background-color: #f8fafc;
     padding: 100px 0;
     overflow: hidden;
   }

   .heading-81 {
     color: #010838;
     font-family: Aeonik, sans-serif;
     font-size: 64px;
     font-weight: 400;
     line-height: 1.2;
   }

   .reviews-container {
     position: relative;
   }

   .reviews-wrapper {
     overflow-x: auto;
     scroll-behavior: smooth;
     gap: 20px;
     padding-bottom: 20px;
     cursor: grab;
     scroll-snap-type: x mandatory;
   }

   .reviews-wrapper:active {
     cursor: grabbing;
   }

   .reviews-wrapper::-webkit-scrollbar {
     display: none;
   }

   .review-card {
     background: #fff;
     border-radius: 24px;
     min-width: 300px;
     max-width: 320px;
     flex: 0 0 auto;
     padding: 30px 25px;
     text-align: left;
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
     scroll-snap-align: start;
     transition: transform 0.4s ease, box-shadow 0.4s ease;
   }

   .review-card:hover {
     transform: translateY(-6px) rotateZ(-0.5deg) scale(1.03);
     box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
   }

   .quote {
     font-size: 60px;
     color: #012b91;
     line-height: 0.8;
     margin-bottom: 10px;
     font-weight: 700;
   }

   .review-text {
     font-size: 16px;
     color: #010838;
     line-height: 1.5;
   }

   .review-author {
     font-weight: 500;
     color: #010838;
     margin-top: 15px;
   }

   .review-stars {
     font-size: 18px;
   }

   /* Scroll gölgeleri */
   .scroll-shadow {
     position: absolute;
     top: 0;
     bottom: 0;
     width: 100px;
     pointer-events: none;
     z-index: 10;
     transition: opacity 0.3s ease;
   }

   .scroll-shadow.left {
     left: 0;
     background: linear-gradient(to right, #f8fafc 60%, transparent);
   }

   .scroll-shadow.right {
     right: 0;
     background: linear-gradient(to left, #f8fafc 60%, transparent);
   }

   /* Responsive */
   @media (max-width: 992px) {
     .heading-81 {
       font-size: 42px;
       line-height: 1.3;
     }

     .review-card {
       min-width: 270px;
       margin-right: 15px;
     }
   }


   /* Genel alan */
   .stats-section {
     background: linear-gradient(135deg, #012b91 0%, #4a7efc 45%, #e5edff 100%);
     padding: 110px 0 140px;
   }

   /* Başlık */
   .stats-title {
     font-family: "Aeonik", "Poppins", sans-serif;
     line-height: 1.25;
     color: #f7f8fa;
     text-align: center;
     margin-top: 0;
     margin-bottom: 68px;
     font-size: 72px;
     font-weight: 500;
   }

   .stats-title span {
     color: #012b91;
   }

   /* İstatistik ikonları ve değerleri */
   .stats-icon {
     font-size: 30px;
     color: #012b91;
     margin-bottom: 12px;
     display: inline-block;
   }

   .stats-value {
     font-size: 36px;
     font-weight: 600;
     color: #012b91;
     margin-bottom: 6px;
     letter-spacing: -0.5px;
   }

   .stats-text {
     color: #ffffff;
     font-size: 18px;
     line-height: 1.5;
     margin: 0 auto;
     max-width: 170px;
   }

   /* Video */
   .app-video-wrapper {
     display: flex;
     justify-content: center;
     align-items: center;
     margin-top: 60px;
   }

   .app-video-wrapper iframe {
     border-radius: 18px;
     border: none;
     transform: scale(1);
     transition: transform 0.4s ease;
   }

   .app-video-wrapper iframe:hover {
     transform: scale(1.02);
   }

   /* Responsive */
   @media (max-width: 992px) {
     .stats-title {
       font-size: 36px;
       margin-bottom: 50px;
     }

     .stats-value {
       font-size: 26px;
     }

     .stats-icon {
       font-size: 26px;
     }

     .stats-section {
       padding: 80px 0 100px;
     }

     .app-video-wrapper {
       margin-top: 40px;
     }
   }



   /* Genel yapı */
   .trusted-section {
     background-color: #f8f9fc;
     padding: 100px 0;
   }

   /* Başlık */
   .trusted-title {
     font-family: "Aeonik", "Poppins", sans-serif;
     font-size: 28px;
     font-weight: 500;
     color: #010838;
     margin-bottom: 60px;
   }

   /* Görseller */
   .trusted-logos .trusted-img {
     max-height: 120px;
     opacity: 0.9;
     transition: all 0.3s ease;
     filter: grayscale(20%);
   }

   .trusted-logos .trusted-img:hover {
     opacity: 1;
     transform: scale(1.05);
     filter: grayscale(0%);
   }

   /* Responsive düzen */
   @media (max-width: 992px) {
     .trusted-title {
       font-size: 24px;
       margin-bottom: 40px;
     }

     .trusted-logos .trusted-img {
       max-height: 100px;
     }
   }

   @media (max-width: 576px) {
     .trusted-logos .col-6 {
       margin-bottom: 20px;
     }
   }


   /* === Genel alan === */
   .research-section {
     background-color: #f8f9fc;
     padding: 100px 0;
   }

   .research-title {
     font-family: "Aeonik", "Poppins", sans-serif;
     font-size: 54px;
     font-weight: 600;
     color: #010838;
     line-height: 1.2;
   }

   .research-desc {
     color: #3a5266;
     font-size: 18px;
     max-width: 650px;
     margin: 0 auto;
   }

   /* === Kart yapısı === */
   .research-card {
     background: #fff;
     border-radius: 18px;
     overflow: hidden;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
     transition: all 0.3s ease;
     cursor: pointer;
   }

   .research-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 10px 35px rgba(0, 0, 0, 0.1);
   }

   .research-img-wrapper {
     overflow: hidden;
     border-bottom: 1px solid #eef2f7;
   }

   .research-img {
     width: 100%;
     height: 240px;
     object-fit: cover;
     transition: transform 0.4s ease;
   }

   .research-card:hover .research-img {
     transform: scale(1.08);
   }

   /* === İçerik === */
   .badge-insight {
     display: inline-block;
     background-color: #eef2ff;
     color: #010838;
     font-weight: 600;
     font-size: 13px;
     border-radius: 8px;
     padding: 5px 12px;
     letter-spacing: 0.4px;
   }

   .research-card-title {
     font-size: 20px;
     font-weight: 600;
     color: #010838;
   }

   .research-card-desc {
     font-size: 15px;
     color: #3a5266;
     line-height: 1.6;
   }

   /* === Responsive === */
   @media (max-width: 992px) {
     .research-title {
       font-size: 38px;
     }

     .research-desc {
       font-size: 16px;
     }

     .research-img {
       height: 200px;
     }
   }


   /* === Genel Alan === */
   .brands-section {
     background-color: #f8f9fc;
     padding: 80px 0;
     overflow: hidden;
   }

   .brands-title {
     font-family: "Aeonik", "Poppins", sans-serif;
     font-size: 28px;
     font-weight: 500;
     color: #010838;
     margin-bottom: 40px;
   }

   /* === Slider === */
   .brands-slider-wrapper {
     position: relative;
     width: 100%;
     overflow: hidden;
   }

   .brands-slider {
     display: flex;
     white-space: nowrap;
     animation: scrollBrands 40s linear infinite;
   }

   /* Sonsuz Kayma Efekti */
   @keyframes scrollBrands {
     0% {
       transform: translateX(0);
     }

     100% {
       transform: translateX(-50%);
     }
   }

   /* === Marka Logoları === */
   .brand-item {
     flex: 0 0 auto;
     display: flex;
     align-items: center;
     justify-content: center;
   }

   .brand-logo {
     max-height: 60px;
     opacity: 0.9;
     filter: grayscale(100%);
     transition: all 0.3s ease;
   }

   .brand-logo:hover {
     opacity: 1;
     filter: grayscale(0%);
     transform: scale(1.05);
   }

   /* === Responsive === */
   @media (max-width: 992px) {
     .brand-logo {
       max-height: 45px;
     }
   }

   @media (max-width: 576px) {
     .brands-title {
       font-size: 22px;
       margin-bottom: 25px;
     }
   }


   .smartwatch-awards-section {
     background-color: #F8FAFC;
   }

   .smartwatch-award-img img {
     max-height: 220px;
     transition: transform 0.4s ease, filter 0.4s ease;
   }

   .smartwatch-award-img img:hover {
     transform: translateY(-6px);
     filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.1));
   }

   .smartwatch-award-title {
     font-family: "Poppins", "Aeonik", sans-serif;
     font-size: 36px;
     color: #0054c6;
     letter-spacing: 1px;
   }

   .smartwatch-award-subtext {
     font-size: 18px;
     color: #222;
     line-height: 1.6;
   }

   .smartwatch-award-note {
     font-size: 18px;
     color: #0054c6;
   }

   /* Responsive ayarlar */
   @media (max-width: 992px) {
     .smartwatch-award-title {
       font-size: 30px;
     }

     .smartwatch-award-subtext {
       font-size: 16px;
     }

     .smartwatch-award-note {
       font-size: 16px;
     }
   }

   @media (max-width: 576px) {
     .smartwatch-awards-section {
       padding: 60px 0;
     }

     .smartwatch-award-img img {
       max-height: 180px;
     }
   }

   .smartwatch-slider-section {
     background-color: #f9fafc;
     padding: 100px 0;
   }

   .smartwatch-slider-title {
     font-size: 42px;
     font-weight: 600;
     color: #010b36;
     margin-bottom: 40px;
   }

   .smartwatch-slide-content {
     max-width: 600px;
     margin: 0 auto;
     transition: transform 0.5s ease;
   }

   .smartwatch-slide-content:hover {
     transform: translateY(-5px);
   }

   .smartwatch-slide-image img {
     max-height: 500px;
     object-fit: contain;
     transition: transform 0.5s ease;
   }



   .smartwatch-slide-model {
     font-size: 20px;
     font-weight: 700;
     margin-top: 10px;
   }

   /* Navigasyon Butonları */
   .smartwatch-control {
     background-color: rgba(0, 0, 0, 0.1);
     width: 40px;
     height: 40px;
     border-radius: 50%;
     top: 50%;
     transform: translateY(-50%);
   }

   .smartwatch-control:hover {
     background-color: rgba(0, 0, 0, 0.3);
   }

   /* Alt Noktalar */
   .smartwatch-carousel-indicators {
     display: flex;
     justify-content: center;
     gap: 10px;
   }

   .smartwatch-carousel-indicators button {
     width: 12px;
     height: 12px;
     border-radius: 50%;
     border: none;
     background-color: #d1d5db;
     transition: all 0.3s ease;
   }

   .smartwatch-carousel-indicators button.active {
     background-color: #0073e6;
     transform: scale(1.2);
   }





   .smartwatch-products-section {
     background-color: #f9fafc;
   }

   .smartwatch-products-title {
     font-size: 36px;
     color: #0a0a0a;
     margin-bottom: 50px;
   }

   .smartwatch-product-card {
     transition: all 0.3s ease;
   }

   .smartwatch-product-card:hover {
     transform: translateY(-8px);
     box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
   }

   .smartwatch-product-image img {
     max-height: 140px;
     transition: transform 0.3s ease;
   }

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

   .smartwatch-product-name {
     font-size: 18px;
     color: #111;
   }

   .smartwatch-product-desc {
     font-size: 15px;
     color: #555;
     line-height: 1.6;
   }

   .smartwatch-product-buttons .btn {
     border-radius: 30px;
     font-weight: 600;
     font-size: 15px;
     padding: 12px 20px;
     transition: all 0.3s ease;
   }

   /* Turuncu Buton */
   .smartwatch-btn-orange {
     background-color: #ff9c00;
     color: #000;
     border: none;
   }

   .smartwatch-btn-orange:hover {
     background-color: #fcb045;
     color: #fff;
   }

   /* Mavi Buton */
   .smartwatch-btn-blue {
     background-color: #0099ff;
     color: #fff;
     border: none;
   }

   .smartwatch-btn-blue:hover {
     background-color: #007fe6;
   }

   /* Responsive Ayarlar */
   @media (max-width: 992px) {
     .smartwatch-products-title {
       font-size: 28px;
     }

     .smartwatch-product-desc {
       min-height: auto;
     }
   }

   @media (max-width: 576px) {
     .smartwatch-product-card {
       padding: 20px;
     }
   }







   .smartwatch-quote-section {
     background-color: #f3f4f6;
     /* açık gri arka plan */
     padding: 80px 0;
   }

   .smartwatch-quote {
     font-size: 18px;
     color: #333;
     max-width: 900px;
     margin: 0 auto;
     line-height: 1.8;
     letter-spacing: 0.3px;
   }

   .smartwatch-quote-line {
     margin-bottom: 1.2rem;
   }

   .smartwatch-quote-line:first-child {
     font-weight: 600;
     color: #1f2937;
     /* koyu gri tonu */
   }

   /* Alıntı işaretleri */
   .smartwatch-quote::before,
   .smartwatch-quote::after {
     content: "“";
     font-size: 50px;
     color: #d1d5db;
     display: block;
     line-height: 0;
   }

   .smartwatch-quote::after {
     content: "”";
     margin-top: -10px;
   }

   /* Responsive */
   @media (max-width: 768px) {
     .smartwatch-quote {
       font-size: 16px;
       padding: 0 15px;
     }

     .smartwatch-quote-section {
       padding: 60px 0;
     }
   }


   .smartwatch-image-section {
     background-color: #fff;
     padding: 80px 0;
   }

   .smartwatch-image-wrapper {
     max-width: 850px;
     /* görselin genişliği sınırlı */
     margin: 0 auto;
     overflow: hidden;
     border-radius: 16px;
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
     transition: transform 0.4s ease, box-shadow 0.4s ease;
   }

   .smartwatch-image-wrapper:hover {
     transform: translateY(-6px);
     box-shadow: 0 15px 30px rgba(0, 0, 0, 0.12);
   }

   .smartwatch-image {
     width: 100%;
     height: auto;
     object-fit: cover;
     display: block;
     border-radius: 16px;
   }

   /* Responsive */
   @media (max-width: 768px) {
     .smartwatch-image-section {
       padding: 60px 0;
     }

     .smartwatch-image-wrapper {
       max-width: 95%;
       border-radius: 12px;
     }
   }

   .smartwatch-certificates-section {
     background-color: #fff;
   }

   .smartwatch-certificate-item {
     text-align: center;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .smartwatch-cert-img {
     max-height: 240px;
     object-fit: contain;
     transition: transform 0.3s ease;
   }

   .smartwatch-certificate-item:hover .smartwatch-cert-img {
     transform: scale(1.05);
   }

   .smartwatch-cert-text {
     color: #111;
     font-size: 15.5px;
     line-height: 1.6;
     margin-top: 15px;
     font-family: "Poppins", "Aeonik", sans-serif;
   }

   /* Hover efekti */
   .smartwatch-certificate-item:hover {
     transform: translateY(-6px);
   }

   /* Responsive */
   @media (max-width: 992px) {
     .smartwatch-cert-img {
       max-height: 80px;
     }

     .smartwatch-cert-text {
       font-size: 14px;
     }
   }

   @media (max-width: 576px) {
     .smartwatch-certificates-section {
       padding: 60px 0;
     }
   }

   .callbroker-video-wrapper video {
     border-radius: 12px;
   }

   .callbroker-video-wrapper {
     overflow: hidden;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .callbroker-video-wrapper:hover {
     transform: translateY(-4px);
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
   }


   .callcontrol-section {
     background-color: #f8f8f8;
     padding: 80px 0;
   }

   .callcontrol-title {
     font-size: 2.2rem;
     color: #222;
     line-height: 1.3;
   }

   .callcontrol-title span {
     color: #00a77f;
     /* yeşil ton */
   }

   .callcontrol-text {
     font-size: 1.1rem;
     color: #555;
     line-height: 1.7;
     max-width: 500px;
   }

   .callcontrol-subtext {
     font-size: 1rem;
     color: #666;
   }

   .callcontrol-phone-img {
     max-width: 90%;
     transform: rotate(-5deg);
     filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.1));
   }

   /* App store button görsel boyutu */
   .callcontrol-store-btn {
     height: 50px;
     transition: transform 0.3s ease;
   }

   .callcontrol-store-btn:hover {
     transform: scale(1.05);
   }

   /* CTA Buton */
   .callcontrol-cta-btn {
     display: inline-block;
     border: 2px solid #00a0e0;
     color: #00a0e0;
     font-weight: 600;
     font-size: 1rem;
     padding: 12px 28px;
     border-radius: 6px;
     text-decoration: none;
     transition: all 0.3s ease;
   }

   .callcontrol-cta-btn:hover {
     background-color: #00a0e0;
     color: #fff;
   }

   /* Responsive */
   @media (max-width: 768px) {
     .callcontrol-title {
       font-size: 1.8rem;
       text-align: center;
     }

     .callcontrol-text,
     .callcontrol-subtext {
       text-align: center;
     }

     .callcontrol-cta-btn {
       display: block;
       width: fit-content;
       margin: 0 auto;
     }

     .callcontrol-phone-img {
       max-width: 75%;
       margin-bottom: 20px;
     }
   }

   /* Genel Alan */
   .callcontrol-community-section {
     background-color: #ffffff;
     padding: 80px 0;
   }

   /* Başlık */
   .callcontrol-community-title {
     font-size: 2.2rem;
     color: #222;
     line-height: 1.3;
   }

   .callcontrol-community-title span {
     color: #00a77f;
   }

   /* Açıklama Metni */
   .callcontrol-community-text {
     font-size: 1.1rem;
     color: #555;
     line-height: 1.7;
     max-width: 550px;
   }

   .callcontrol-community-subtext {
     font-size: 1rem;
     color: #666;
     margin-top: 10px;
   }

   /* Tek Fotoğraf */
   .callcontrol-single-photo {
     width: 100%;
     max-width: 320px;
     height: auto;
     border-radius: 8px;
     box-shadow: 0 4px 18px rgba(0, 0, 0, 0.15);
     object-fit: cover;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .callcontrol-single-photo:hover {
     transform: scale(1.03);
     box-shadow: 0 8px 22px rgba(0, 0, 0, 0.2);
   }

   /* Responsive */
   @media (max-width: 768px) {
     .callcontrol-community-title {
       font-size: 1.8rem;
       text-align: center;
     }

     .callcontrol-community-text,
     .callcontrol-community-subtext {
       text-align: center;
       margin: 0 auto;
     }

     .callcontrol-single-photo {
       max-width: 250px;
       margin-bottom: 25px;
     }
   }

   /* Genel Alan */
   .callcontrol-features-section {
     background-color: #dbe8ec;
     padding: 80px 0;
   }

   /* Kart Alanı */
   .callcontrol-feature-box {
     background: #fff;
     border-radius: 10px;
     overflow: hidden;
     box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
     transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .callcontrol-feature-box:hover {
     transform: translateY(-5px);
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
   }

   /* Görsel */
   .callcontrol-feature-img {
     width: 100%;
     height: 260px;
     object-fit: cover;
   }

   /* İçerik Alanı */
   .callcontrol-feature-content {
     padding: 25px;
   }

   /* İkon ve Başlık */
   .callcontrol-feature-icon {
     font-size: 36px;
     color: #00a77f;
     margin-right: 12px;
   }

   .callcontrol-feature-title {
     font-size: 1.5rem;
     font-weight: 700;
     color: #222;
     margin: 0;
   }

   .callcontrol-feature-text {
     color: #555;
     font-size: 1rem;
     line-height: 1.7;
     margin-top: 10px;
   }

   /* Responsive */
   @media (max-width: 768px) {
     .callcontrol-feature-title {
       font-size: 1.3rem;
       text-align: center;
     }

     .callcontrol-feature-text {
       text-align: center;
     }

     .callcontrol-feature-content {
       text-align: center;
     }

     .callcontrol-feature-icon {
       display: block;
       margin: 0 auto 10px;
     }
   }

   /* Genel Alan */
   .callcontrol-services-section {
     background-color: #f9fbfc;
     padding: 80px 0;
     text-align: center;
   }

   /* Kart Alanı */
   .callcontrol-service-box {
     padding: 40px 25px;
     transition: all 0.3s ease;
     border-radius: 8px;
   }

   .callcontrol-service-box:hover {
     background-color: #eef6f8;
     box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
     transform: translateY(-5px);
   }

   /* İkon */
   .callcontrol-service-icon {
     font-size: 50px;
     color: #2e5067;
     margin-bottom: 20px;
   }

   /* Başlık */
   .callcontrol-service-title {
     font-size: 1.4rem;
     font-weight: 700;
     color: #222;
     margin-bottom: 10px;
   }

   /* Açıklama */
   .callcontrol-service-text {
     font-size: 1rem;
     color: #555;
     line-height: 1.6;
     max-width: 350px;
     margin: 0 auto;
   }

   /* Responsive */
   @media (max-width: 768px) {
     .callcontrol-service-icon {
       font-size: 40px;
     }

     .callcontrol-service-title {
       font-size: 1.2rem;
     }

     .callcontrol-service-text {
       font-size: 0.95rem;
     }
   }

   /* Genel Alan */
   .callcontrol-landline-section {
     background-color: #ffffff;
     padding: 80px 0;
   }

   /* Başlık */
   .callcontrol-landline-title {
     font-size: 2rem;
     font-weight: 700;
     color: #222;
     line-height: 1.3;
   }

   /* Açıklama */
   .callcontrol-landline-text {
     font-size: 1rem;
     color: #555;
     line-height: 1.8;
     margin-top: 15px;
     max-width: 600px;
   }

   /* İkonlu Liste */
   .callcontrol-landline-list {
     list-style: none;
     padding: 0;
     margin: 30px 0;
   }

   .callcontrol-landline-list li {
     display: flex;
     align-items: flex-start;
     margin-bottom: 20px;
   }

   .callcontrol-landline-icon {
     font-size: 30px;
     color: #00a77f;
     margin-right: 15px;
     flex-shrink: 0;
     width: 35px;
     text-align: center;
   }

   .callcontrol-landline-list h5 {
     font-weight: 700;
     color: #222;
     margin-bottom: 5px;
     font-size: 1.1rem;
   }

   .callcontrol-landline-list p {
     color: #555;
     font-size: 0.95rem;
     margin: 0;
   }

   /* Linkler */
   .callcontrol-landline-link {
     color: #00a0e0;
     font-weight: 600;
     text-decoration: none;
     transition: color 0.3s ease;
   }

   .callcontrol-landline-link:hover {
     color: #007ab6;
     text-decoration: underline;
   }

   /* Görsel */
   .callcontrol-landline-img {
     width: 100%;
     max-width: 500px;
     border-radius: 10px;
     object-fit: cover;
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
   }

   /* Responsive */
   @media (max-width: 768px) {
     .callcontrol-landline-title {
       font-size: 1.6rem;
       text-align: center;
     }

     .callcontrol-landline-text {
       text-align: center;
       margin: 0 auto 20px;
     }

     .callcontrol-landline-list {
       text-align: left;
     }

     .callcontrol-landline-img {
       margin-bottom: 30px;
     }
   }

   /* Genel Alan */
   .callcontrol-network-section {
     background-color: #dbe8ec;
     padding: 80px 0;
   }

   .callcontrol-network-box {
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     background: transparent;
     padding: 10px 20px;
   }

   /* İkon */
   .callcontrol-network-icon {
     font-size: 38px;
     color: #00a77f;
     margin-bottom: 15px;
   }

   /* Başlık */
   .callcontrol-network-title {
     font-size: 1.8rem;
     font-weight: 700;
     color: #222;
     margin-bottom: 10px;
     line-height: 1.3;
   }

   /* Açıklama */
   .callcontrol-network-text {
     color: #555;
     font-size: 1rem;
     line-height: 1.7;
     margin-bottom: 15px;
     max-width: 520px;
   }

   /* Link */
   .callcontrol-network-link {
     color: #00a0e0;
     font-weight: 600;
     text-decoration: none;
     transition: color 0.3s ease;
   }

   .callcontrol-network-link:hover {
     color: #007ab6;
     text-decoration: underline;
   }

   /* Responsive */
   @media (max-width: 768px) {
     .callcontrol-network-title {
       font-size: 1.5rem;
       text-align: center;
     }

     .callcontrol-network-text {
       text-align: center;
       margin: 0 auto 10px;
     }

     .callcontrol-network-link {
       display: block;
       text-align: center;
     }

     .callcontrol-network-icon {
       display: block;
       margin: 0 auto 15px;
     }

     .callcontrol-network-box {
       align-items: center;
     }
   }

   /* Genel Alan */
   .callcontrol-logos-section {
     background-color: #ffffff;
     padding: 60px 0;
     overflow: hidden;
     position: relative;
   }

   .callcontrol-logos-title {
     text-align: center;
     font-size: 1.1rem;
     color: #888;
     margin-bottom: 40px;
   }

   /* Slider Alanı */
   .callcontrol-logos-slider {
     display: flex;
     gap: 60px;
     width: max-content;
     animation: callcontrol-scroll 25s linear infinite;
   }

   .callcontrol-logos-wrapper {
     display: flex;
     justify-content: center;
     align-items: center;
     overflow: hidden;
     width: 100%;
   }

   /* Logo Görselleri */
   .callcontrol-logo-item img {
     height: 50px;
     width: auto;
     object-fit: contain;
     transition: transform 0.3s ease, opacity 0.3s ease;
     opacity: 0.9;
   }

   .callcontrol-logo-item img:hover {
     transform: scale(1.05);
     opacity: 1;
   }

   /* Sonsuz Kayma Animasyonu */
   @keyframes callcontrol-scroll {
     0% {
       transform: translateX(0);
     }

     100% {
       transform: translateX(-50%);
     }
   }

   /* Responsive */
   @media (max-width: 768px) {
     .callcontrol-logos-slider {
       gap: 40px;
       animation-duration: 35s;
     }

     .callcontrol-logo-item img {
       height: 40px;
     }
   }

   .callcontrol-banner1-title {
     font-size: 2.2rem;
     font-weight: 700;
     line-height: 1.3;
     color: #000000;
   }

   .callcontrol-banner1-text {
     font-size: 1.1rem;
     line-height: 1.8;
     max-width: 750px;
     margin: 0 auto;
     color: #000000;
   }

   .callcontrol-banner1-video video,
   .callcontrol-banner1-video iframe {
     width: 100%;
     height: auto;
     border-radius: 10px;
   }

   /* Mobil uyum */
   @media (max-width: 768px) {
     .callcontrol-banner1-title {
       font-size: 1.8rem;
     }

     .callcontrol-banner1-text {
       font-size: 1rem;
       padding: 0 15px;
     }
   }

   .floating-login {
     top: 4%;
     left: 80%;
     animation: floatY 6s ease-in-out infinite;
   }

   .cta-section {
     position: relative;
     padding: 100px 20px;
     text-align: center;
     overflow: hidden;
     border-radius: 0;
     background: linear-gradient(140deg, #3bb2ff 0%, #118eea 40%, #0460b8 100%);
   }

   /* Üstten büyük parlak diagonal dalga */
   .cta-section::before {
     content: "";
     position: absolute;
     top: -35%;
     left: -25%;
     width: 170%;
     height: 80%;
     background: radial-gradient(circle at 15% 30%,
         rgba(255, 255, 255, 0.35),
         rgba(255, 255, 255, 0) 70%);
     transform: rotate(-18deg);
     opacity: 0.55;
   }

   /* Alttan gelen koyu diagonal dalga */
   .cta-section::after {
     content: "";
     position: absolute;
     bottom: -40%;
     right: -30%;
     width: 180%;
     height: 90%;
     background: radial-gradient(circle at 80% 70%,
         rgba(0, 0, 0, 0.22),
         rgba(0, 0, 0, 0) 75%);
     transform: rotate(15deg);
     opacity: 0.45;
   }

   /* Orta bölge yumuşak mavi diffuse katman */
   .cta-section .cta-diffuse {
     content: "";
     position: absolute;
     top: 15%;
     left: 50%;
     width: 170%;
     height: 130%;
     background: radial-gradient(circle at 50% 50%,
         rgba(59, 178, 255, 0.20),
         rgba(0, 0, 0, 0) 80%);
     transform: translateX(-50%);
     opacity: 0.35;
     pointer-events: none;
     z-index: 0;
   }

   /* CTA içeriği üstte kalması için */
   .cta-overlay {
     position: relative;
     z-index: 5;
   }

   .support-card {
     position: relative;
     padding: 60px 20px;
     text-align: center;
     border-radius: 20px;
     overflow: hidden;
     background: linear-gradient(160deg, #118eea 0%, #0460b8 70%);
   }

   /* ÜSTTE PARLAYAN DİAGONAL DALGA */
   .support-card::before {
     content: "";
     position: absolute;
     top: -35%;
     left: -10%;
     width: 150%;
     height: 80%;
     background: radial-gradient(circle at 20% 30%,
         rgba(255, 255, 255, 0.35),
         rgba(255, 255, 255, 0) 70%);
     transform: rotate(12deg);
     opacity: 0.55;
   }

   /* ALTTAN GELEN KOYU GÖLGE DALGA */
   .support-card::after {
     content: "";
     position: absolute;
     bottom: -40%;
     right: -20%;
     width: 140%;
     height: 90%;
     background: radial-gradient(circle at 80% 70%,
         rgba(0, 0, 0, 0.22),
         rgba(0, 0, 0, 0) 75%);
     transform: rotate(-10deg);
     opacity: 0.45;
   }

   /* ORTADA HAFİF MAVI DIFFUSE ALAN */
   .support-card .wave-overlay {
     content: "";
     position: absolute;
     top: 20%;
     left: 50%;
     width: 160%;
     height: 130%;
     background: radial-gradient(circle at 50% 50%,
         rgba(59, 178, 255, 0.22),
         rgba(0, 0, 0, 0) 80%);
     transform: translateX(-50%);
     opacity: 0.35;
     z-index: 0;
   }

   .feature-stats-section {
     position: relative;
     padding: 80px 0;
     background: linear-gradient(135deg, #3bb2ff 0%, #118eea 40%, #0460b8 100%);
     overflow: hidden;
   }

   /* Dalga katmanları */
   .feature-stats-section::before,
   .feature-stats-section::after {
     content: "";
     position: absolute;
     left: 0;
     width: 140%;
     height: 140%;
     pointer-events: none;
   }

   /* Üst dalga – açık mavi */
   .feature-stats-section::before {
     top: -20%;
     background: radial-gradient(circle at 20% 30%,
         rgba(255, 255, 255, 0.25),
         rgba(0, 0, 0, 0) 70%);
     opacity: 0.4;
     transform: rotate(-8deg);
   }

   /* Alt dalga – koyu gölge efekti */
   .feature-stats-section::after {
     bottom: -25%;
     background: radial-gradient(circle at 75% 70%,
         rgba(0, 0, 0, 0.18),
         rgba(0, 0, 0, 0) 80%);
     opacity: 0.35;
     transform: rotate(6deg);
   }

   /* Video Stats Container */
   .video-stats-container {
     background: linear-gradient(135deg, #1F2937 0%, #374151 100%);
     border-radius: 15px;
     padding: 30px 20px;
     margin: 30px 0;
     box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
   }

   /* Video Stats Styles */
   .stats-box-video {
     padding: 25px 20px;
     background: rgba(31, 41, 55, 0.6);
     border-radius: 15px;
     border: 1px solid rgba(29, 224, 119, 0.2);
     transition: all 0.3s ease;
     position: relative;
     overflow: hidden;
   }

   .stats-box-video::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: linear-gradient(135deg, rgba(29, 224, 119, 0.1) 0%, rgba(29, 224, 119, 0.05) 100%);
     opacity: 0;
     transition: opacity 0.3s ease;
   }

   .stats-box-video:hover {
     transform: translateY(-8px);
     border-color: rgba(29, 224, 119, 0.4);
     box-shadow: 0 15px 35px rgba(29, 224, 119, 0.2);
   }

   .stats-box-video:hover::before {
     opacity: 1;
   }

   .stats-icon-wrapper {
     margin-bottom: 15px;
     display: block !important;
     width: 100%;
     text-align: center;
     height: 50px;
     line-height: 50px;
   }

   .stats-icon-wrapper span {
     display: inline-block !important;
   }

   .stats-icon-wrapper i,
   .stats-icon-wrapper .fa-solid,
   .stats-icon-wrapper .fa {
     font-family: "Font Awesome 6 Free", "Font Awesome 6 Pro", "FontAwesome" !important;
     font-weight: 900 !important;
     font-style: normal !important;
     display: inline-block !important;
     font-size: inherit !important;
     color: inherit !important;
     line-height: 1 !important;
   }

   .stats-icon-wrapper .fa-money-bill-wave::before {
     content: "\f53a" !important;
   }

   .stats-icon-wrapper .fa-square-xmark::before {
     content: "\f2d3" !important;
   }

   .stats-icon-wrapper .fa-phone-volume::before {
     content: "\f4a0" !important;
   }

   .stats-icon-wrapper .fa-shield-check::before {
     content: "\f3ed" !important;
   }

   .stats-icon-video {
     font-size: 42px !important;
     color: rgb(29, 224, 119) !important;
     display: inline-block !important;
     filter: drop-shadow(0 4px 12px rgba(29, 224, 119, 0.4));
     transition: all 0.3s ease;
     opacity: 1 !important;
     visibility: visible !important;
     line-height: 1 !important;
     font-family: "Font Awesome 6 Free", "Font Awesome 6 Pro", "FontAwesome", "Font Awesome 5 Free", "Font Awesome 5 Pro" !important;
     font-weight: 900 !important;
     -webkit-font-smoothing: antialiased !important;
     -moz-osx-font-smoothing: grayscale !important;
     speak: none;
     font-style: normal !important;
     font-variant: normal !important;
     text-transform: none !important;
     text-rendering: auto !important;
     -webkit-font-feature-settings: normal !important;
     font-feature-settings: normal !important;
   }

   .stats-icon-video::before {
     display: inline-block !important;
     font-family: "Font Awesome 6 Free" !important;
     font-weight: 900 !important;
   }


   .stats-box-video:hover .stats-icon-video {
     transform: scale(1.15);
     filter: drop-shadow(0 8px 16px rgba(29, 224, 119, 0.6));
   }



   .stats-value-video {
     font-size: 36px;
     font-weight: 700;
     color: #FFFFFF;
     margin: 15px 0;
     letter-spacing: -1px;
     text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
     position: relative;
     z-index: 1;
   }

   .stats-text-video {
     font-size: 14px;
     color: #1FA2FF;
     font-weight: 600;
     margin: 0;
     line-height: 1.4;
     position: relative;
     z-index: 1;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 6px;
   }

   .stats-text-video i {
     font-size: 16px !important;
     color: rgb(29, 224, 119) !important;
     flex-shrink: 0;
     display: inline-block !important;
     opacity: 1 !important;
     visibility: visible !important;
     font-family: "Font Awesome 6 Free", "Font Awesome 6 Pro", "FontAwesome" !important;
     font-weight: 900 !important;
     font-style: normal !important;
     line-height: 1 !important;
   }

   .stats-text-video .fa-shield-halved::before {
     content: "\f3ed" !important;
   }

   .main-video-wrapper {
     margin-bottom: 40px;
   }

   @media (max-width: 768px) {
     .video-stats-container {
       padding: 20px 15px;
       margin: 20px 0;
       border-radius: 12px;
     }

     .stats-box-video {
       padding: 20px 15px;
     }

     .stats-value-video {
       font-size: 28px;
       margin: 10px 0;
     }

     .stats-icon-video {
       font-size: 32px !important;
     }

     .stats-icon-wrapper {
       margin-bottom: 10px;
       height: 40px;
       line-height: 40px;
     }

     .stats-text-video {
       font-size: 12px;
     }
   }

/* Testimonials Section - Modern Design with Slider */
.testimonials-section {
    background: #F8FAFC;
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

.testimonials-bg-pattern {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(circle at 20% 30%, rgba(29, 224, 119, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(29, 224, 119, 0.05) 0%, transparent 50%);
    pointer-events: none;
    z-index: 0;
}

.testimonials-slider-wrapper {
    position: relative;
    z-index: 1;
    padding: 0 0 50px 0;
}

.testimonialsSwiper {
    padding-bottom: 50px;
}

.testimonials-pagination {
    position: relative;
    margin-top: 30px;
    bottom: auto !important;
}

.testimonials-pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #CBD5E1;
    opacity: 1;
    margin: 0 4px;
    transition: all 0.3s ease;
}

.testimonials-pagination .swiper-pagination-bullet-active {
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    width: 24px;
    border-radius: 5px;
}

.testimonials-cta-btn {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #FFFFFF;
    font-weight: 600;
    padding: 14px 32px;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(31, 162, 255, 0.3);
}

.testimonials-cta-btn:hover {
    background: linear-gradient(90deg, #2563eb 0%, #1e40af 50%, #1e3a8a 100%);
    color: #FFFFFF;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

.testimonials-label {
    display: inline-block;
    color: #1FA2FF;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
    position: relative;
    padding-bottom: 8px;
}

.testimonials-label::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    border-radius: 2px;
}

.testimonials-title {
    font-size: 42px;
    font-weight: 700;
    color: #1E293B;
    margin-bottom: 50px;
    line-height: 1.2;
}

.testimonials-title .text-success {
    color: rgb(29, 224, 119) !important;
}

.testimonial-card {
    background: #FFFFFF;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.testimonial-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    transform: translateY(-4px);
}

.testimonial-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.testimonial-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #E5E7EB;
    flex-shrink: 0;
}

.testimonial-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.testimonial-avatar-placeholder {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(90deg, #1FA2FF 0%, #0D8BFF 50%, #0065FF 100%);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 700;
    border: 3px solid #E5E7EB;
    flex-shrink: 0;
}

.testimonial-info {
    flex: 1;
}

.testimonial-name {
    font-size: 18px;
    font-weight: 700;
    color: #1E293B;
    margin-bottom: 4px;
}

.testimonial-location {
    font-size: 14px;
    color: #64748B;
    margin: 0;
}

.testimonial-rating {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
}

.testimonial-rating i {
    font-size: 18px;
    color: #E5E7EB;
    transition: color 0.2s ease;
}

.testimonial-rating i.active {
    color: #FFC107;
}

.testimonial-text {
    font-size: 16px;
    line-height: 1.6;
    color: #475569;
    margin: 0;
    flex: 1;
}

@media (max-width: 992px) {
    .testimonials-title {
        font-size: 32px;
    }
    
    .testimonial-card {
        padding: 24px;
    }
}

@media (max-width: 768px) {
    .testimonials-section {
        padding: 60px 0;
    }
    
    .testimonials-title {
        font-size: 28px;
        margin-bottom: 40px;
    }
    
    .testimonial-card {
        padding: 20px;
    }
    
    .testimonial-avatar,
    .testimonial-avatar-placeholder {
        width: 56px;
        height: 56px;
    }
    
    .testimonial-name {
        font-size: 16px;
    }
    
    .testimonial-text {
        font-size: 15px;
    }
}