:root {
  /* — Colors — */
  --color-primary:       #9b276c;   /* Ana vurgu rengi */
  --color-secondary:     #febc58;   /* İkinci vurgu / orijinal fiyat rengi */
  --color-border:        #d7dbda;   /* Genel kenarlık rengi */
  --color-border-light:  #ecf0f4;   /* Açık tonlu alt sınır rengi */
  --color-bg:            #fff;      /* Sayfa arka planı */
  --color-white:         #fff;      /* Saf beyaz */
  --color-accent:        #134d90;   /* Hover ve hata uyarı rengi */

  /* — Dimensions — */
  --site-max-width:      1905px;    /* Ana container maksimum genişlik */
  --slider-aspect-height:       1509; /* Slider en-boy oranı */
  --slider-aspect-width:        396;  /* Slider en-boy oranı */
  --header-padding:      0;         /* Üstten boşluk (header offset) */
  --logo-height:         80px;      /* Desktop logo yüksekliği */
  --logo-height-sm:      70px;      /* Mobil logo yüksekliği */

  /* — Fonts — */
  --font-family-base:      'Poppins', sans-serif; /* Genel metin fontu */
  --font-family-heading:   'Poppins', sans-serif; /* Başlıklar için font */
  --font-family-menu:      'Poppins', sans-serif; /* Menü/nav fontu */
  --font-size-base:        14px;               /* Paragraf metni */
  --font-size-small:       12px;               /* Küçük metinler */
  --font-size-medium:      16px;               /* Orta boy metin */
  --font-size-large:       17px;               /* Büyük metin */
  --font-size-menu:        15px;               /* Menü link metni */
  --font-size-menu2:       15px;               /* Menü metni */
  --font-menu-right-lengt: .5rem;              /* Menu sag uzaklık */
  --font-menu-left-lengt:  .5rem;              /* Menu sol uzaklık */
  --font-size-h1:          32px;               /* H1 başlığı */
  --font-size-h2:          24px;               /* H2 başlığı */
  --font-size-h3:          18px;               /* H3 başlığı */
  --font-size-button:      14px;               /* Buton içi metin */
  --line-height-base:      1.8;                /* Genel satır yüksekliği */
  --line-height-heading:   1.2;                /* Başlık satır yüksekliği */
  --font-weight-normal:    400;                /* Normal font ağırlığı */
  --font-weight-bold:      700;                /* Kalın font ağırlığı */
}

/* — Base typography — */
body {
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  padding-top: var(--header-padding);
  background: var(--color-bg);
}

h1 {
  font-family: var(--font-family-heading);
  font-size: var(--font-size-h1);
  line-height: var(--line-height-heading);
  font-weight: var(--font-weight-bold);
}

h2 {
  font-family: var(--font-family-heading);
  font-size: var(--font-size-h2);
  line-height: var(--line-height-heading);
  font-weight: var(--font-weight-bold);
}

h3 {
  font-family: var(--font-family-heading);
  font-size: var(--font-size-h3);
  line-height: var(--line-height-heading);
  font-weight: var(--font-weight-bold);
}

/* — Menu / Navigation — */
.nav-link {
  font-family: var(--font-family-menu);
  font-size: var(--font-size-menu);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-base);
  color: var(--color-secondary);
  text-decoration: none;
}
.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: var(--font-menu-right-lengt);
    padding-left: var(--font-menu-left-lengt);
}
.nav-link:hover {
  color: var(--color-primary);
}
.navbar-nav .nav-link {
  font-size: var(--font-size-menu2) !important;
}
#categories {
  top: calc(100% + 0px)!important;
}
/* — creafair added — */
.iletisimRight div:nth-child(4) {
 /* display: none; */
}
.eduPackage .eduItem .eduItemInner {
  text-align: center;
}
.accordion li {
  border-bottom: 0 solid var(--color-border-light);
}

/* — Filter Accordion — */
.filterAccordion .btn-red2 {
  padding: 10px 12px;
  font-size: var(--font-size-button);
}
.filterAccordion input {
  width: 190px;
  height: 45px;
  line-height: 45px;
  background: transparent;
  border: 1px solid var(--color-border);
  font-size: var(--font-size-small);
  color: var(--color-secondary);
  border-radius: 5px;
  float: left;
  margin-left: 0 !important;
  padding-left: 15px !important;
  margin-right: 10px;
}

/* — Accordion Links — */
.accordion li .link {
  padding: 3px 0 !important;
  font-size: var(--font-size-small);
}
.accordion li .link div {
  width: unset !important;
}

/* — Book Content & Pricing — */
.bookContent .searchItem .image {
  text-align: center;
  vertical-align: middle;
}
.bookContent .original-price {
  font-size: var(--font-size-medium) !important;
}
.bookContent .accordion .searchItem .searchInfo .salesInfo .priceArea .discount-price,
.detailHeaderRight .discount-price {
  font-size: var(--font-size-large) !important;
}
.bookContent .priceArea {
  display: -webkit-inline-box !important;
  padding-right: 30px !important;
}
.bookContent .bookInfo {
  font-size: var(--font-size-small) !important;
  width: 60%;
}
.bookContent .accordion .searchItem .searchInfo .salesInfo .priceArea .price,
.detailHeaderRight .price {
  margin-right: 10px !important;
}

/* — Responsive Panel Container — */
@media only screen and (max-width: 768px) {
  #categories .panelContainer {
    display: inline-flex;
    margin-left: 2px;
  }
}

/* — Course Content — */
.courseContent .courseItem .courseItemInner .textContent .benefits,
.courseContent .courseItem .courseItemInner .textContent .rating {
  display: none;
}
.courseContent .courseItem .courseItemInner .textContent .price {
  align-items: center;
}
.courseItemInner .photo {text-align:center;}
.eduPackage .eduItem .eduItemInner .textInfo div img,
.courseBenefits .courseBenefitsBox .icon img,
.sepetDetay .benefitsItem img {
    -webkit-filter: hue-rotate(230deg);
    filter: hue-rotate(230deg);
}

.courseBenefits .courseBenefitsBox .icon img {
    width: 38px;
}
/* — Social Icons — */
.social {
  display: none;
}

/* — Search Info Overrides — */
.accordion .searchItem .searchInfo .name .title {
  max-width: 100%;
}
.accordion .searchItem .searchInfo .salesInfo .lessonInfo {
  display: none;
}
.accordion .searchItem .searchInfo .salesInfo .priceArea .discount-price,
.detailHeaderRight .discount-price {
  font-size: var(--font-size-large) !important;
}
.kursDetailPrice .discount-price,
.kursDetailPrice .original-price {
  font-size: var(--font-size-large) !important;
  font-weight: var(--font-weight-bold);
  line-height: 24px;
}
.accordion .searchItem .searchInfo .salesInfo .priceArea {
  display: contents;
}
.accordion .searchItem .searchInfo .salesInfo {
  display: flex;
}

/* — Cart Details — */
.sepetDetay .benefits {
  width: 45%;
}
.egtImg {
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background-size: cover;
  float: left;
}
.egitmenBilgi {
  width: 55%;
  float: inherit;
  margin-top: 5px;
}
.egitmenBilgi span {
  line-height: unset;
}
.sepetDetay .benefitsItem {
  float: left;
  font-size: var(--font-size-small);
  margin-right: 10px;
}

/* — Basket List Images — */
.sepetListe .kursImg {
  height: 220px;
}
@media only screen and (max-width: 1100px) {
  .sepetListe .kursImg {
    height: 290px;
  }
  .courseContent .courseItem .courseItemInner .textContent .price .priceArea .original-price,
  .courseContent .courseItem .courseItemInner .textContent .price .priceArea .discount-price {
    font-size: 19px !important;
  }
  .kursDetailPrice .discount-price,
  .kursDetailPrice .original-price {
    font-size: 18px !important;
  }
}

/* — Strikethrough Original Price — */
.accordion .searchItem .searchInfo .salesInfo .priceArea .original-price,
.detailHeaderRight .original-price {
  text-decoration: line-through;
  color: var(--color-secondary);
  font-size: var(--font-size-large);
}
.thinRedHeader {
    background: var(--color-primary);
}

/* — Basket Totals — */
.sepetPuan {
  margin-top: 65px;
}
.sepetPrice {
  margin-top: 75px;
}
@media only screen and (max-width: 500px) {
  .sepetPrice {
    width: 70%;
  }
}
@media only screen and (max-width: 768px) {
  #footer_text img,
  #subpageHeader img {
    width: 100%;
    height: auto;
  }
  .kaldir {
    float: left;
    width: unset;
    text-align: left;
    margin-top: 10px !important;
  }
  .sepetPrice {
    margin-top: 10px;
  }
  .sepetPuan {
    margin-top: 10px;
  }
}
.sepetPrice .original-price {
  color: var(--color-secondary);
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-bold);
}

/* — Course Content Price Overrides — */
.courseContent .courseItem .courseItemInner .textContent .price .priceArea .original-price {
  text-decoration: line-through;
  color: var(--color-secondary);
  font-size: var(--font-size-large);
  font-weight: var(--font-weight-bold);
}
.courseContent .courseItem .courseItemInner .textContent .price .priceArea .discount-price {
  font-size: var(--font-size-large);
}

/* — Student Comments — */
.studentComments .studentCommentItem .comments {
  padding: 0;
  font-size: var(--font-size-small) !important;
  min-height: 110px;
}
.studentComments .studentCommentItem div {
  padding: 0;
  font-size: var(--font-size-base) !important;
  margin-top: 0 !important;
  min-height: 50px;
}
.studentComments .studentCommentItem .studentPhoto {
  position: relative;
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto;
}
.studentComments .studentCommentItem .studentPhoto img {
  border: 2px solid var(--color-white);
  box-shadow: 0 10px 40px rgba(0,0,0,0.3);
  height: 60px;
}
.studentComments .studentCommentItem {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 360px;
  height: 300px;
  background: var(--color-white);
  padding: 1px;
  margin: 20px 0;
  border: 1px solid var(--color-bg);
  text-align: center;
  line-height: 1.7;
}
.studentComments .studentCommentItem .studentName {
  display: flex;
  align-items: center;
  height: 35px;
  background: var(--color-primary);
  color: var(--color-white) !important;
  font-weight: var(--font-weight-bold);
}

/* — Kurs Detail & Header — */
.kursDetailImg {
  /* height: 368px; */
}
#pageHeader h1,
#pageHeader p {
  text-shadow:
    3px 0 0 #000, 2.83px 0.98px 0 #000,
    2.36px 1.85px 0 #000, 1.62px 2.52px 0 #000,
    0.70px 2.91px 0 #000, -0.29px 2.99px 0 #000,
    -1.25px 2.73px 0 #000, -2.07px 2.17px 0 #000,
    -2.67px 1.37px 0 #000, -2.97px 0.42px 0 #000,
    -2.95px -0.57px 0 #000, -2.60px -1.50px 0 #000,
    -1.96px -2.27px 0 #000, -1.11px -2.79px 0 #000,
    -0.14px -2.99px 0 #000, 0.85px -2.88px 0 #000,
    1.75px -2.44px 0 #000, 2.45px -1.73px 0 #000,
    2.88px -0.84px 0 #000;
    margin-top:60px;
}



/* — Responsive Header Padding — */
@media only screen and (max-width: 770px) {
  body {
    /* padding-top: 99px; */
  }
  #contact-s1, #contact-s2, #contact-s3 {
    flex: auto;
    max-width: 100%;
    float: left !important;
    text-align: left !important;
  }
}
@media only screen and (max-width: 1200px) {
  body {
    /* padding-top: 100px; */
  }
}

/* — Logo — */
.logo {
  top: unset;
  margin-left: 0px;
}
.logo img {
  width: auto;
  height: var(--logo-height);
}
@media only screen and (max-width: 500px) {
  .logo img {
    height: var(--logo-height-sm);
  }
}

/* — Buttons & Cart — */
.redFullBtn,
.btn-red,
.btn-red2,
.courseItemInner .btn-red2,
.kursDetailPrice .btn-red2,
.liveLessonFrame .btnJoin {
  background: var(--color-primary);
  border: solid 1px var(--color-primary);
  color: var(--color-white) !important;
}
.redFullBtn:hover {
  background: var(--color-accent);
}
header .cart .cartNum,
.userLogo,
.cartNum,
#searchResults .rightArea li .link:before {
  background: var(--color-primary);
}

/* — Coupon, Stats, Tabs, Maps, Forms … — */
#coupon-apply-submit {
  line-height: unset !important;
}
#courseStats {
  margin-top: 1px;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 136px;
  background: var(--color-primary);
}
.form-promo h3.title span,
.form-promo .promoForm .formTitle,
.informative-title h4,
.smHeader a.link,
#kursTab .nav-link.active:before,
#egitmenTabs .nav-link.active:before,
#sss-tab .nav-link.active:before,
.sssTabsContent .card .active,
.why:before {
  background: var(--color-primary);
  color: var(--color-white);
}
.why {
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    background-size: cover !important;
}
.informative-title h4 {
  display: inline-block;
  border-radius: 4px;
  padding: 10px 20px;
}
.shopping-cart {
    position: relative;
    display: block;
    width: 40px !important;
    height: 40px !important;
    background: url(/uploads/source/sepet-icon.png) 0 0 no-repeat !important;
    background-size: contain;
}
.maps {
  float: left;
  width: 100%;
  height: 500px;
  border: 5px solid var(--color-primary);
  border-radius: 5px;
  margin: 50px 0 100px;
}
.iletisimForm .form-row .input-group-prepend span {
  color: var(--color-primary);
}
.iletisimForm .form-row.is-invalid {
  border: 4px solid var(--color-primary);
}
.redHeader {
  background: var(--color-primary);
  color: var(--color-white);
  padding: 50px;
  height: 336px;
}
.kaydolLink a,
.odeSepetBilgi a,
.strengthColor span.active,
.kaldir {
  color: var(--color-primary);
}

 #registerPromote{
       height:100%;
    }
#registerPromote .container {
     margin-bottom: 20px;
    margin-top: 20px;
}
    
@media only screen and (max-width: 1200px) {
    #registerPromote .container .patlangac {
        display: none !important;
    }

    #courseStats {
        padding: 30px;
        display: none !important;
    }

    #courseStats h2 {
        padding: 10px !important;
        padding-bottom: 10px !important;
        font-size: 17px !important;
    }

    #courseStats .statsBox .number {
        color: #fff;
        font-size: 11px;
    }

    #courseStats .statsBox .icon img {
        width: 35px !important;
        height: 35px !important;
    }

    #courseStats .statsBox .icon {
        width: 35px;
        margin-right: 15px;
    }

    #courseStats .statsBox .number strong {
        display: block;
        font-size: 23px;
        line-height: 1.1;
    }

    .nav {
        /* display: contents; */
    }

    .nav .nav-link {
        font-size: 12px !important;
    }

    .nav .btn-white, .nav .btn-red, .category .btn-red {
        font-size: 12px !important;
        line-height: 27px;
    }

}
@media only screen and (max-width: 500px) {

    .courseBenefits {
        display: none;
    }

  .kursDetailContent {/* padding-top: 120px; */}

   
}

@media only screen and (min-width: 991px) {
    header .cart{
        height: auto;
        margin-right:20px;
        width:48px;
    }
    header .nav {
        display: flex;
        padding-top: 0;
        align-items: center;
    }
    
    .eduPackage > .row{
        margin-left: -32px;
        margin-right: -32px;
    }
    .eduPackage .eduItem{
        padding: 32px;
        margin-bottom: 32px;
        transition: all ease .3s;
        margin-bottom:0px;
        border-radius: 4px;
    }
    .eduPackage .eduItem:hover{
        box-shadow:inset 0px 0px 0px 1px #ec5252;
    }
    .eduPackage .eduItem .eduItemInner .prodPhoto1 img{
        width:100%;
        transition: all ease .3s;
    }
    
    .eduPackage .eduItem:hover .eduItemInner .prodPhoto1 img {
        transform: scale(1.02);
    }
    
    .container-fluid.contentContainer.sepetContent > .container{
        padding:0px;
    }
}

header {  padding-bottom: 15px;}
.why .panel .ico {
    min-width: 60px;
    width: unset;
}

.why {
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    background-size: cover !important;
}
.sssTabsContent .collapse {
    padding: 0rem 1rem!important;
}


            
            
            
            
          
            
             @media only screen and (max-width: 500px) {
              #registerPromote .container h4 {font-size: 20px;margin-top:10px!important;line-height: 1.2!important; margin-bottom:10px!important;} 
              #registerPromote .container p {    margin: 0px 0px 20px 0px!important;    font-size: 14px!important;    line-height: 1.3!important; }
            }
            
            #registerPromote .container p {
                margin: 20px 50px 30px 50px;
                font-size: 16px;
                line-height: 1.3;
            }
            #registerPromote:before { 
                opacity: .85;
                background-color:var(--color-primary);
                border: solid 1px var(--color-secondary);!important;
            }
            #registerPromote .btn-red {
                border: solid 1px var(--color-secondary);!important;
            }
            .informative { background-size: cover!important; }
            
           
            .sepetOzet { min-height: 280px; padding: 40px; }
            .sepetPrice .discount-price { font-size: 16px; }
            
#breadbrumb ul li:first-child a {
    color: var(--color-primary);;
}
footer#footer .footerHeader img{   max-height:180px;}

/* slider yendien boyutlandirildi */
/* 1. Ortak ayarlar */
#pageHeader.homepage,
.homeSlide .item {
  width: 100%;                
  max-width: 1110px;          
  margin: 0 auto;             
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center bottom !important;
  position: relative;         
  height: auto;               
}

/* 2. Modern tarayıcılar icin: aspect-ratio */
#pageHeader.homepage,
.homeSlide .item {
  aspect-ratio: 1509 / 396;  
}

/* 3. Eski tarayıcılar icin: padding-top hack */
/*    aspect-ratio desteklemiyorsa buradaki ::before devreye girer */
#pageHeader.homepage::before,
.homeSlide .item::before {
  content: "";
  display: block;
  padding-top: calc(396 / 1509 * 100%); 
}

/* 4. icerik / arka plan */
#pageHeader.homepage > *,
.homeSlide .item > * {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
}

/* slider yendien boyutlandirildi END  */