.teskilat-section-premium {
     padding: 40px 0 80px;
     background: #fff;
     position: relative;
 }

 /* loader */
 #filter-loader {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(255, 255, 255, 0.7);
     display: none;
     align-items: center;
     justify-content: center;
     z-index: 9999;
     backdrop-filter: blur(2px);
 }

 .premium-spinner {
     width: 50px;
     height: 50px;
     border: 4px solid #f3f3f3;
     border-top: 4px solid #e33c1c;
     border-radius: 50%;
     animation: spin 1s linear infinite;
 }

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

     100% {
         transform: rotate(360deg);
     }
 }

 /* clear filter button */
 #clear-filter-btn {
     display: none;
     margin-bottom: 20px;
     width: 100%;
     background: #111;
     color: #fff;
     border: none;
     padding: 12px;
     border-radius: 8px;
     font-weight: 800;
     text-transform: uppercase;
     font-size: 11px;
     cursor: pointer;
     transition: 0.3s;
 }

 #clear-filter-btn:hover {
     background: #e33c1c;
 }

 /* list design */
 .teskilat-list-wrapper {
     max-height: 650px;
     overflow-y: auto;
     padding-right: 15px;
 }

 .teskilat-mini-card {
     background: #fdfdfd;
     border-radius: 12px;
     padding: 20px;
     margin-bottom: 15px;
     border: 1px solid #eee;
     transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
     cursor: pointer;
 }

 .teskilat-mini-card:hover,
 .teskilat-mini-card.active {
     background: #fff;
     border-color: #e33c1c;
     box-shadow: 0 15px 40px rgba(227, 60, 28, 0.12);
     transform: translateY(-5px);
 }

 .teskilat-mini-card h4 {
     font-size: 17px;
     font-weight: 900;
     color: #111;
     margin-bottom: 8px;
 }

 .teskilat-mini-card p {
     font-size: 13px;
     color: #666;
     margin: 0;
     line-height: 1.5;
 }

 .teskilat-mini-card .president-tag {
     display: inline-block;
     margin-top: 12px;
     font-size: 10px;
     background: rgba(227, 60, 28, 0.08);
     color: #e33c1c;
     padding: 5px 15px;
     border-radius: 50px;
     font-weight: 800;
 }

 /* premium map container */
 .premium-map-container {
     height: 650px;
     border-radius: 30px;
     background: #f0f4f8;
     position: relative;
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 30px 60px rgba(0, 0, 0, 0.08);
     border: 1px solid rgba(0, 0, 0, 0.05);
     overflow: hidden;
 }

 #svg-turkey {
     width: 95%;
     height: auto;
     transition: 0.3s;
 }

 #svg-turkey g path {
     fill: #dbe2e8 !important;
     stroke: #fff;
     stroke-width: 1.2px;
     transition: all 0.3s ease;
 }

 /* active provinces color */
 #svg-turkey g.active-province path {
     fill: #e33c1c !important;
     filter: drop-shadow(0 0 8px rgba(227, 60, 28, 0.5));
     cursor: pointer;
 }

 #svg-turkey g.active-province:hover path {
     fill: #a01d1d !important;
 }

 /* selected province */
 #svg-turkey g.selected-province path {
     fill: #111 !important;
     filter: none !important;
 }

 /* tooltip style */
 .map-tooltip {
     position: absolute;
     background: #111;
     color: #fff;
     padding: 10px 20px;
     border-radius: 10px;
     font-size: 12px;
     font-weight: 800;
     pointer-events: none;
     display: none;
     z-index: 1000;
     transform: translate(-50%, -100%);
     margin-top: -15px;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
 }

 /* list animations */
 .fade-in-list {
     animation: listFadeIn 0.5s ease forwards;
 }

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

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

 #ilceler-liste-alani {
     display: flex;
     flex-wrap: wrap;
 }

 #ilcelerAlani {
     display: flex;
     flex-wrap: wrap;
     gap: 20px;
     justify-content: flex-start;
 }

 .kart-item {
     width: calc(33.333% - 14px);
     /* 3 tane yan yana */
     text-align: center;
     box-sizing: border-box;
 }

 .kart-resim {
     width: 80px;
     height: 80px;
     object-fit: cover;
     margin-bottom: 10px;
     border-radius: 50%;
 }

 .kart-baslik {
     margin: 0;
     font-size: 14px;
     font-weight: bold;
 }

 .kart-gorev {
     font-size: 12px;
     color: #666;
     margin: 0;
 }

 @media (max-width: 768px) {
     .kart-item {
         width: calc(50% - 10px);
         /* tablette 2li */
     }
 }

 @media (max-width: 480px) {
     .kart-item {
         width: 100%;
         /* mobilde tekli */
     }
 }

 .col-sm-4 {
     width: 33.33%;
     padding-bottom: 15px;
 }