/* HT01 LEGACY (budanmış) — style.css + mg-stiller + htstyle + vvsstyle
   yalnız şablon/JS'te GEÇEN seçiciler; orijinaller *.off olarak yedekte.
   Üretici: css_prune.py — yeniden üretilebilir. */
/* ═══ kaynak: style.css.off (172KB → 100KB) ═══ */
*,
*::before,
*::after{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html,
body{
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  line-height: 1.6;
  color: #333;
  min-height: 100%;
  background-color: #fff;
}
html{
  overflow-x: hidden;
}
/* [FG 10 Eyl 2026] 🔴 `overflow-y: visible` EKLENDİ — YOKSA STICKY HEADER ÖLÜYOR.
   Kök neden: `html{overflow-x:hidden}` viewport'a propagate olur (yatay kırpmayı ZATEN o yapar) ve
   html görsel olarak `visible`e döner. Ama `body` kök eleman DEĞİL → kendi overflow'u propagate
   OLMAZ; `overflow-x:clip` + belirtilmemiş `overflow-y` ikilisi body'yi kendi kaydırma kabı yapıyor
   (Chrome hesaplanan: `hidden auto`). Sayfa gerçekte viewport'ta kaydığı için body'nin scrollport'u
   hiç kaymıyor → içindeki `position:sticky` ASLA tetiklenmiyor.
   Ölçüm: 600px kaydırınca .headerfg top=-592 (yapışmıyor); `overflow-y:visible` verilince top=0 ✓.
   Yatay kırpma korunur (html + body clip). ⚠️ Bu satırı silme — header sticky'si buna bağlı. */
body{
  overflow-x: clip;
  overflow-y: visible;
}
@media (min-width: 1500px){.container{
    max-width: 1500px;
  }}
.headerfg{
  position: sticky;
  top: 0;
  width: 100%;
  background-color: #fff;
  z-index: 99999;
  border-bottom: 1px solid #f0f0f0;
}
/* [FG 10 Eyl 2026] STICKY YALNIZ MASAÜSTÜNDE. Mobil header 139px = 390×780 ekranın ~%17'si;
   kalıcı olarak yapıştırmak ürün listesinde/okumada ciddi alan kaybı (ölçüldü: 139px mobil,
   101px masaüstü). Masaüstünde 101px kabul edilebilir ve tasarımın asıl niyeti sticky.
   ⚠️ Bu kural KALDIRILIRSA mobilde de yapışır — bilinçli tercih. */
@media (max-width: 991.98px){
  .headerfg{
    position: static;
  }
}
.headerfg .container>div{
  padding: 12px 0;
}
.headerfg nav{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1;
}
.headerfg nav a{
  text-decoration: none;
  padding: 8px 14px;
  display: inline-block;
  font-size: 13px;
  font-weight: 500;
  color: #333;
  position: relative;
  transition: all 0.25s ease;
}
.headerfg nav a:hover{
  color: #00aacc;
  background: transparent !important;
}
.headerfg nav a::after{
  display: none;
}
.headerfg .header-rightfg{
  gap: 8px;
  flex-shrink: 0;
  margin-left: 16px;
}
.headerfg .header-logo{
  z-index: 100;
  box-sizing: content-box;
  flex-shrink: 0;
  padding: 0;
  position: relative;
}
.fg-hamburger{
  cursor: pointer;
  background: none;
  border: none;
  padding: 6px 10px;
  position: relative;
  z-index: 100001;
  border-radius: 999px;
  background: #f4f6f8;
  width: 44px;
  height: 38px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}
.fg-hamburger:hover{
  background: rgba(0, 170, 204, 0.08);
}
.fg-hamburger span{
  display: block;
  width: 20px;
  height: 2px;
  background-color: #333;
  margin: 2px 0;
  transition: all 0.3s ease;
  border-radius: 2px;
}
.fg-hamburger.active span:nth-child(1){
  transform: rotate(45deg) translate(6px, 6px);
}
.fg-hamburger.active span:nth-child(2){
  opacity: 0;
}
.fg-hamburger.active span:nth-child(3){
  transform: rotate(-45deg) translate(6px, -6px);
}
.fg-mobile-menu-links{
  list-style: none;
  padding: 0 30px;
}
.fg-mobile-menu-links li{
  border-bottom: 1px solid #f0f0f0;
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.headerfg nav .logo-link{
  display: flex;
  width: 165px;
  justify-content: flex-start;
}
.headerfg nav .logo-link img{
  width: 145px;
  max-width: 100%;
}
.fg-mobile-menu-links a{
  display: block;
  padding: 18px 0;
  font-size: 16px;
  font-weight: 500;
  color: #000;
  text-decoration: none;
  transition: color 0.2s ease;
}
.fg-mobile-menu-links a:hover{
  color: #00aacc;
}
@media screen and (max-width: 991px){.headerfg nav a:not(.logo-link):not(.fg-header-cat-btn){
    display: none;
  }
.headerfg .header-rightfg{
    display: flex !important;
    gap: 4px;
  }
.headerfg .container>.d-flex{
    padding: 10px 0;
  }
.headerfg .header-logo .logo-link{
    width: auto;
  }
.headerfg nav .logo-link img{
    width: 110px;
  }}
.fg-slider.cat-slider{
  height: 474px;
}
.fg-slides{
  height: 100%;
  display: flex;
  transition: transform .5s ease;
}
.fg-slide{
  flex: 0 0 100%;
  height: 100%;
  position: relative;
}
.fg-slide .container{
  position: relative;
  height: 100%;
  margin: 0 auto
}
.fg-slider{
  position: relative;
  width: 100%;
  height: auto;
  background: #1a0f0a;
  /* letterbox bölgelerini doldurur */
  overflow: hidden;
  padding: 0 !important
}
.fg-slide-content{
  position: absolute;
  /* 🔥 artık görselin üstünde durur */
  top: 50%;
  left: 80px;
  transform: translateY(-50%);
  max-width: 680px;
  text-align: left;
  z-index: 2;
  padding: 0 80px;
  /* mobilde daha esnek */
  color: #fff;
}
.cat-slider .fg-slide-content{
  text-align: left;
}
.fg-slide-content h2{
  font-size: clamp(2.4rem, 5vw, 3.1rem);
  line-height: 1.05;
  margin-bottom: 1rem;
}
.fg-slide-content p{
  font-size: 1.05rem;
  opacity: .85;
  margin-bottom: 1.5rem;
}
.fg-btn{
  background: #fff;
  color: #000;
  padding: .6rem 1.6rem;
  border-radius: 999px;
  border: none;
  cursor: pointer;
  font-weight: 600;
  display: inline-block;
}
@media(max-width: 992px){.fg-slide-content h2{
    font-size: 16px;
    margin-bottom: 10px
  }
.fg-slide-content p{
    font-size: 11px;
    margin-bottom: 10px;
  }
.fg-slide-content br{
    display: none
  }
.fg-slider .fg-btn{
    line-height: 25px;
    font-size: 14px
  }
.fg-slide-content{
    left: 0;
    padding: 0 40px !important
  }
.fg-slider-arrow{
    width: 25px !important;
    height: 25px !important;
  }
.fg-pagination-item{
    width: 25px !important;
  }}
.headerfg a.fg-header-cat-btn{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: #f4f6f8;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: #333;
  transition: all 0.3s ease;
  margin-left: 30px;
}
.headerfg a.fg-header-cat-btn::after{
  display: none;
}
.headerfg a.fg-header-cat-btn:hover{
  background: #fff;
  border-color: #00aacc;
  color: #00aacc;
  box-shadow: 0 4px 12px rgba(0, 170, 204, 0.1);
}
.fg-slider-arrow{
  position: absolute;
  top: 50%;
  /* transform: translateY(-50%); */
  width: 30px;
  height: 30px;
  border: none;
  background: #000;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 5;
  transition: background .2s;
}
.fg-slider-arrow:hover{
  background: #00aacc;
}
.fg-slider-arrow.fg-prev{
  left: 3rem;
}
.fg-slider-arrow.fg-next{
  right: 3rem;
}
.fg-slider-arrow svg{
  display: none
}
.fg-slider-controller{
  position: absolute;
  left: 50%;
  bottom: .7rem;
  transform: translateX(-50%);
  display: flex;
  gap: .8rem;
  align-items: center;
  z-index: 5;
}
.fg-play-toggle{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, .7);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .2s;
}
.fg-play-toggle:hover{
  background: rgba(0, 0, 0, .7);
}
.cat-slider .fg-play-toggle i{
  font-size: 11px
}
.fg-pagination{
  display: flex;
  gap: .55rem;
}
.fg-pagination-item{
  width: 96px;
  height: 2px;
  background: silver;
  border-radius: 999px;
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
.fg-pagination-item .fg-progress{
  position: absolute;
  inset: 0;
  width: 0;
  background: #00aacc;
  border-radius: inherit;
  transition: width 0s linear;
}
.fg-pagination-item.fg-active{
  background: rgba(255, 255, 255, .4);
}
.cat-slider .fg-pagination{
  display: flex;
  gap: 0;
}
.cat-slider .fg-pagination-item{
  width: 24px;
  height: 4px;
  background: #000;
  opacity: .2;
  border-radius: 0;
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
.cat-slider .fg-pagination-item .cat-slider .fg-progress{
  position: absolute;
  inset: 0;
  width: 0;
  background: #00aacc;
  border-radius: inherit;
  transition: width 0s linear;
}
.cat-slider .fg-pagination-item.fg-active{
  background: #fff;
  opacity: 1;
}
@media(max-width: 900px){.fg-slide{
    flex-direction: column;
    justify-content: center;
    text-align: center;
    position: relative;
  }
.fg-slide::before{
    content: "";
    position: absolute;
    inset: 0;
    background: #000;
    opacity: 0;
    z-index: 1;
  }
.fg-slide-content{
    padding: 0 20px;
    max-width: 100%;
  }
.fg-slide-content h3{
    font-size: 15px !important;
  }
.fg-slider-arrow.fg-next{
    right: 10px;
  }
.fg-slider-arrow.fg-prev{
    left: 10px;
  }
.fg-slider-controller{
    bottom: 1.1rem;
  }}
.fg-tab{
  cursor: pointer;
  padding: 10px 0 14px;
  position: relative;
  font-weight: 500;
  color: #202020;
  transition: color .2s;
}
.fg-tab:hover{
  color: #00aacc;
}
.fg-tab.fg-active{
  color: #00aacc;
}
.fg-tab.fg-active::after{
  content: "";
  position: absolute;
  height: 3px;
  background: #00aacc;
  left: 0;
  right: 0;
  bottom: -1px;
  border-radius: 999px 999px 0 0;
}
@media(max-width: 768px){.fg-tab.fg-active::after{
    bottom: -10px;
  }}
.fg-tab-pane{
  display: none;
}
.fg-tab-pane.fg-show{
  display: block;
}
.fg-btn{
  background: #000;
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 0 24px;
  font-size: 16px;
  line-height: 36px;
  font-weight: 600;
  width: fit-content;
  cursor: pointer;
}
.swiper{
  padding: 4px 4px 8px;
}
#fg-count-swiper{
  padding: 0
}
#fg-count-prev{
  left: 0;
  right: unset
}
.fg-footer{
  background: #000000;
  background-image: radial-gradient(circle at 50% 0%, rgba(0, 170, 204, 0.03) 0%, transparent 70%);
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.9rem;
  line-height: 1.6;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.fg-footer-main{
  padding: 72px 0 48px;
}
.fg-footer-brand{
  padding-right: 24px;
}
.fg-footer-logo{
  display: inline-block;
  margin-bottom: 24px;
  text-decoration: none;
  transition: opacity 0.3s;
}
.fg-footer-logo:hover{
  opacity: 0.85;
}
.fg-footer-logo img{
  height: 32px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.fg-footer-desc{
  color: rgba(255, 255, 255, 0.55);
  font-size: 13.5px;
  line-height: 1.8;
  margin-bottom: 28px;
  max-width: 290px;
}
.fg-footer-socials{
  display: flex;
  gap: 12px;
}
.fg-social-icon{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
  font-size: 15px;
  transform: none !important;
}
.fg-social-icon i{
  transition: color 0.3s ease !important;
  transform: none !important;
}
.fg-social-icon:hover{
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: #00aacc !important;
  color: #00aacc !important;
  box-shadow: 0 0 15px rgba(0, 170, 204, 0.3) !important;
  transform: none !important;
  padding-left: 0 !important;
}
.fg-social-icon:hover i{
  transform: none !important;
  color: #00aacc !important;
}
.fg-footer-apps{
  margin-top: 40px;
}
.fg-app-buttons{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.fg-app-btn{
  display: inline-block;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 8px;
}
.fg-app-btn img{
  height: 48px;
  width: auto;
  transition: opacity 0.3s ease;
}
.fg-app-btn:hover{
  box-shadow: 0 8px 24px rgba(0, 170, 204, 0.2);
  padding-left: 0 !important;
}
.fg-app-btn:hover img{
  border-color: #00aacc;
}
.fg-footer-title{
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin-bottom: 24px;
  color: #fff;
}
.fg-footer-list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.fg-footer-list li{
  margin-bottom: 12px;
}
.fg-footer a{
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  transition: all 0.3s ease;
  font-size: 13.5px;
  display: inline-flex;
  align-items: center;
}
.fg-footer a:hover{
  color: #00aacc;
  padding-left: 6px;
}
.fg-footer-contact .fg-contact-row{
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 20px;
}
.fg-footer-contact .fg-contact-row>i{
  color: #00aacc;
  font-size: 15px;
  margin-top: 3px;
  flex-shrink: 0;
  width: 16px;
  text-align: center;
}
.fg-footer-contact .fg-contact-row div{
  display: flex;
  flex-direction: column;
}
.fg-footer-contact .fg-contact-label{
  color: rgba(255, 255, 255, 0.4);
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 4px;
  font-weight: 600;
}
.fg-footer-contact .fg-contact-row a,
.fg-footer-contact .fg-contact-row span{
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
}
.fg-footer-contact .fg-contact-row a:hover{
  color: #00aacc;
  padding-left: 0;
  /* Override generic link hover padding */
}
.fg-footer-bottom{
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 28px 0;
  background: rgba(0, 0, 0, 0.2);
}
.fg-footer-bottom-inner{
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}
.fg-copyright{
  margin: 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.4);
}
.fg-footer-bottom-left{
  display: flex;
  align-items: center;
  gap: 20px;
}
a.fg-footer-btt{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.8) !important;
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: all 0.3s ease;
  font-weight: 500;
  gap: 8px;
  text-decoration: none;
}
a.fg-footer-btt:hover{
  border-color: #00aacc !important;
  color: #00aacc !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 170, 204, 0.1);
  padding: 0 16px !important;
}
a.fg-footer-btt i{
  font-size: 11px;
}
.fg-accordion-arrow{
  display: none;
  font-size: 0.75rem;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  margin-left: auto;
  color: rgba(255, 255, 255, 0.4);
}
@media (max-width: 991.98px){.fg-footer-main{
    padding: 48px 0 24px;
  }
.fg-footer-brand{
    padding-right: 0;
    margin-bottom: 24px;
    padding-bottom: 32px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }
.fg-footer-desc{
    max-width: 100%;
  }
.fg-accordion-toggle{
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    margin-bottom: 0;
    padding: 18px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    user-select: none;
    transition: color 0.3s ease;
  }
.fg-accordion-toggle:active{
    background: rgba(255, 255, 255, 0.02);
  }
.fg-accordion-arrow{
    display: inline-block;
  }
.fg-accordion-toggle.active{
    border-bottom-color: transparent;
    color: #00aacc;
  }
.fg-accordion-toggle.active .fg-accordion-arrow{
    transform: rotate(180deg);
    color: #00aacc;
  }
.fg-accordion-toggle+.fg-footer-list{
    display: none;
    padding-top: 0;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }
.fg-accordion-toggle.active+.fg-footer-list{
    display: block;
    animation: fadeInDown 0.3s ease;
  }
.fg-accordion-toggle+.fg-footer-contact{
    display: none;
    padding-top: 0;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }
.fg-accordion-toggle.active+.fg-footer-contact{
    display: block;
    animation: fadeInDown 0.3s ease;
  }
.fg-footer .col-6{
    flex: 0 0 100%;
    max-width: 100%;
  }
.fg-footer-bottom-inner{
    flex-direction: column;
    text-align: center;
    gap: 24px;
  }
.fg-footer-bottom-left{
    flex-direction: column;
    gap: 16px;
  }}
@keyframes fadeInDown{
  from {
    opacity: 0;
    transform: translateY(-10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 767.98px){.fg-footer{
    font-size: 0.8rem;
  }
.fg-footer-title{
    font-size: 11px;
  }}
.parallax-item{
  will-change: transform;
  transition: transform 0.1s linear;
}
@keyframes rotateCircle{
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}
@media (max-width: 650px){.fg-tab{
    min-width: 120px;
  }}
@media (max-width: 1400px){.headerfg nav a{
    padding: 12px 15px
  }}
.fg-homecat{
  padding: 80px 0;
  background-color: #f7f7f7;
}
#fg-homecat-swiper a{
  text-decoration: none;

}
#fg-homecat-swiper img{
  transition: .4s linear;
}
@-webkit-keyframes flash{
  0% {
    opacity: .4;
  }

  100% {
    opacity: 1;
  }
}
@keyframes flash{
  0% {
    opacity: .4;
  }

  100% {
    opacity: 1;
  }
}
#backToTop{
  position: fixed;
  left: 50px;
  bottom: 50px;
  z-index: 9999999;
  width: 50px;
  height: 50px;

  background-color: #00aacc;
  color: #fff;

  border: none;
  border-radius: 50%;
  cursor: pointer;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 20px;

  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);

  transition:
    opacity 0.3s ease,
    transform 0.3s ease,
    visibility 0.3s;
}
#backToTop.show{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
#backToTop:hover{
  background-color: #0090aa;
}
@media(max-width: 992px){#backToTop{
    display: none !important;
  }}
.fg-product-title{
  color: white;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.py-30{
  padding: 30px 0;
  background-color: #fff;
}
.btn-dark{
  background-color: #000;
  border-color: #000;
}
.btn-dark:hover{
  background-color: #00aacc;
  border-color: #00aacc;
}
@media (max-width: 576px){.fg-product-title{
    font-size: 1.2rem;
  }}
.fg-pagination{
  display: flex;
  align-items: center;
  gap: 9px;
}
@media (max-width: 575px){.fg-pagination{
    justify-content: center;
  }}
.canvas-filter .canvas-header{
  box-shadow: 0px 4px 10px 0px rgba(212, 212, 212, 0.2509803922);
}
@media (min-width: 1200px){.canvas-filter .canvas-header,
  .canvas-filter .canvas-body,
  .canvas-filter .canvas-bottom{
    padding: 32px 40px;
  }}
@media (max-width: 767px){.canvas-filter{
    max-width: 325px;
  }}
.offcanvas{
  border: none !important;
  color: #000;
  z-index: 3000;
}
.offcanvas .icon-close-popup{
  transition: all 0.25s ease;
  cursor: pointer;
  background: #f5f5f5;
  font-size: 16px;
  padding: 0;
  border: none;
  color: #666;
  z-index: 10;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.offcanvas .icon-close-popup:hover{
  background: #0a0a0a;
  color: #fff;
  transform: rotate(90deg);
}
.offcanvas{
  z-index: 999999;
}
.offcanvas-backdrop{
  z-index: 2999;
  cursor: url(../images/cursor-close.svg), auto;
}
.canvas-wrapper{
  padding: 0;
  isolation: isolate;
  height: 100%;
  width: 100%;
  max-height: none;
  display: grid;
  grid-auto-rows: auto minmax(0, 1fr) auto;
  align-content: start;

}
.canvas-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px;
  position: relative;
  text-transform: capitalize;
}
.canvas-header .icon-close-popup{
  height: 32px;
  width: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
@media (min-width: 1200px){.canvas-header{
    padding: 32px;
  }}
.canvas-body{
  background-color: #fff;
  padding: 10px 24px;
  overscroll-behavior-y: contain;
  overflow-y: auto;
  flex: 1;
}
.canvas-body::-webkit-scrollbar{
  width: 5px;
}
.canvas-body::-webkit-scrollbar-track{
  background-color: #fff;
}
.canvas-body::-webkit-scrollbar-thumb{
  background: #000;
  border-radius: 4px;
}
@media (min-width: 1200px){.canvas-body{
    padding: 24px 32px 15px;
  }}
#filterShop ul{
  margin: 0 0 0 0;
  padding: 0 0 32px 0
}
#fg-product-detail{
  position: relative;
  background-color: #fff;
}
.fg-product-detail-breadcrumb{
  background-color: #fcfcfd;
  padding: 14px 0;
  border-bottom: 1px solid #f0f0f0;
}
.fg-product-detail-breadcrumb ol{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 5px;
}
.fg-product-detail-breadcrumb li{
  display: flex;
  align-items: center;
  font-size: 13px;
  color: #888;
  line-height: normal;
}
.fg-product-detail-breadcrumb a{
  color: #888;
  text-decoration: none;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
}
.fg-product-detail-breadcrumb a:hover{
  color: #00aacc;
  text-decoration: none;
}
.fg-product-detail-breadcrumb li[aria-current="page"]{
  color: #333;
  font-weight: 500;
}
.fg-product-detail-breadcrumb li+li::before{
  content: "/";
  color: #d1d5db;
  margin: 0 12px;
  font-size: 11px;
}
.fg-product-detail-breadcrumb li:first-child a i{
  font-size: 14px;
}
@media(max-width: 992px){.fg-product-detail-breadcrumb{
    display: none !important;
  }}
.fg-video-part{
  position: relative;
  height: 700px;
}
@media(max-width: 992px){.fg-video-part{
    height: 210px;
  }}
.fg-video-part video{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fg-product-swiper-part{
  width: 100%;
  margin: 0 auto;
  padding-top: 10px;
  padding-bottom: 60px;
  text-align: center;
  box-sizing: border-box;
  background-color: #424242;
  color: white;
}
.fg-product-section-swiper{
  width: 100%;
  margin: 30px 0 0 0;
  position: relative;
  overflow: hidden;
}
.fg-product-section-swiper .swiper-button-next{
  right: 20px;
}
.fg-product-section-swiper .swiper-button-prev{
  left: 20px;
}
.fg-product-section-swiper .swiper-button-next,
.fg-product-section-swiper .swiper-button-prev{
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  transition: all 0.3s ease;
}
.fg-product-section-swiper .swiper-button-next:hover,
.fg-product-section-swiper .swiper-button-prev:hover{
  background-color: rgba(255, 255, 255, 0.8);
}
.fg-product-section-swiper .swiper-button-next::after,
.fg-product-section-swiper .swiper-button-prev::after{
  color: #fff;
}
.fg-product-section-swiper .swiper-button-next i,
.fg-product-section-swiper .swiper-button-prev i{
  color: #000;
  font-size: 12px
}
.fg-product-section-swiper .swiper-button-next svg,
.fg-product-section-swiper .swiper-button-prev svg{
  display: none;
}
.fg-product-section-swiper img{
  width: 100%;
  object-fit: contain;
}
.fg-product-banner-two-part{
  position: relative;
  background: #f8f9fa;
  padding: 40px 0;
}
.fg-product-banner-two-part img{
  width: 100%;
  object-fit: contain;
}
.fg-product-banner-two-title{
  color: #333;
  font-size: 15px;
  text-align: center;
  margin-bottom: 10px;
  margin-top: 20px;
  font-weight: bold;
}
.fg-product-banner-two-text{
  font-size: 12px;
  text-align: center;
}
.fg-product-counter-part{
  padding: 80px 0;
}
.fg-product-counter-part .fg-product-counter-number{
  background: linear-gradient(295.85deg, #00babf 0%, #9ae2fb 100%);
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 4px;
  width: 100%;
  height: 100%;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -moz-box-pack: center;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  justify-content: center;
  padding-left: 40px;
  position: relative;
}
@media(max-width: 992px){.fg-product-counter-part .fg-product-counter-number{
    padding: 40px 0;
  }}
.fg-product-counter-part .fg-product-counter-number img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right;
}
.fg-product-counter-part .fg-product-counter-number span{
  font-size: 48px;
  font-weight: bold;
  position: relative;
  z-index: 99;
  color: #000;
  line-height: 1.3;
}
.fg-product-counter-part .fg-product-counter-number .counter{
  font-size: 68px;

}
.fg-product-counter-part .fg-product-counter-number .counter-text{
  font-size: 14px;
  position: relative;
  z-index: 99;
  margin-top: 10px;
}
.fg-product-counter-part .fg-product-counter-title{
  background: linear-gradient(91.8deg, #ff3b00 -.75%, #f80 89.6%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: inline-block;
  width: auto;
  font-size: 26px;
  font-weight: bold;
  margin-bottom: 20px
}
.fg-product-counter-part .fg-product-counter-text{
  font-size: 36px;
  margin-bottom: 50px;
  font-weight: bold;
  color: #000
}
.fg-product-counter-part .fg-product-counter-bottom-text{
  font-size: 18px;
  color: #202020;
  text-align: center;
  margin: 40px 0 0 0
}
.fg-product-zigzag-part{
  padding: 80px 0;
}
.fg-product-zigzag-part .fg-product-zigzag-title{
  background: #00aacc;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: inline-block;
  width: auto;
  font-size: 26px;
  font-weight: bold;
  margin-bottom: 20px
}
.fg-product-zigzag-part .fg-product-zigzag-text{
  font-size: 36px;
  margin-bottom: 50px;
  font-weight: bold;
  color: #000
}
.fg-zigzag-box{
  padding: 0 0 150px 30px;
  border: 1px solid #e4e4e4;
}
.fg-product-zigzag-part .fg-zigzag-text{
  display: flex;
  height: 100%;
  align-items: end;
  font-size: 54px;
  font-weight: 700;
  margin: 0
}
.fg-product-zigzag-part .fg-zigzag-desc{
  font-size: 18px;
  font-weight: 400;
}
.fg-vertical-zigzag{
  padding: 0 0 70px 0;
}
.fg-vertical-zigzag .row{
  padding: 70px 0 0 0;
}
.fg-vertical-zigzag img{
  border-radius: 20px;
}
.fg-li-tr .fg-vertical-zigzag-box{
  padding: 60px 160px 60px 0px;
}
.fg-ri-tl .fg-vertical-zigzag-box{
  padding: 60px 0px 60px 70px;
}
.fg-vertical-zigzag-title{
  font-size: 26px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #000;
}
.fg-vertical-zigzag-text{
  font-size: 15px;
  font-weight: 400;
  color: #0009;
}
.fg-product-faq{
  padding: 65px 0;
}
.fg-product-faq .fg-accordion-section{}
.fg-product-faq .fg-image-section{

  position: sticky;
  top: 50px;
}
.fg-product-faq .accordion-button{
  font-size: 18px;
  font-weight: 600;
  color: #212529;
  background-color: #fff;
  padding: 20px 25px;
  border: none;
  box-shadow: none;
}
.fg-product-faq .accordion-button:not(.collapsed){
  background-color: #fff;
  color: #212529;
  box-shadow: none;
}
.fg-product-faq .accordion-button:focus{
  box-shadow: none;
  border-color: transparent;
}
.fg-product-faq .accordion-button::after{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.fg-product-faq .accordion-item{
  border: none;
  background-color: #fff;
  margin-bottom: 2px;
}
.fg-product-faq .accordion-body{
  padding: 20px 25px;
  color: #6c757d;
  font-size: 15px;
  line-height: 1.6;
}
.fg-product-faq .accordion{
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
}
.fg-product-faq .fg-robot-image{
  width: 100%;
  height: 450px;
  border-radius: 0;
  box-shadow: none;
  object-fit: contain;
  transition: opacity 0.3s ease;
}
@media (max-width: 992px){.fg-product-faq .fg-image-section{
    position: relative;
    top: 0;
    order: -1;
  }}
#fg-product-info-main{
  padding: 65px 0;
  position: relative;
}
.fg-product-info-main .fg-gallery{
  position: relative;
  display: flex;
  flex-direction: column;
  height: fit-content;
}
.fg-product-info-main .fg-main-swiper{
  width: 100%;
  margin-bottom: 15px;
  overflow: hidden;
  flex: 6;
}
.fg-product-info-main .fg-gallery .fg-slider-arrow{
  top: 50%;
}
@media(max-width:992px){.fg-product-info-main .fg-thumb-swiper{
    order: 2 !important;
    flex: 6;
  }
.fg-product-info-main .fg-gallery{
    position: relative;
    flex-direction: column;
  }
.fg-product-info-main .fg-main-swiper{
    margin-bottom: 0 !important;
  }}
.fg-product-info-main .fg-main-swiper .swiper-slide{
  display: flex;
  justify-content: center;
}
.fg-product-info-main .fg-main-swiper .swiper-slide img{
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 15px;
}
.fg-product-info-main .fg-thumb-swiper{
  position: relative;
  width: 100%;
  flex: 1;
}
.fg-product-info-main .fg-thumb-swiper .swiper-slide{
  /* width: 80px; */
  height: 80px;
  opacity: 0.5;
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.3s ease;
}
.fg-product-info-main .fg-thumb-swiper .swiper-slide:hover{
  opacity: 0.8;
}
.fg-product-info-main .fg-thumb-swiper .swiper-slide-thumb-active{
  opacity: 1;
  border-color: #000;
}
.fg-product-info-main .fg-thumb-swiper .swiper-slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fg-product-info-main .fg-product-info{
  padding: 0 15px;
}
@media (min-width: 992px){.fg-product-info-main .fg-product-info{
    background: #fff;
    border-radius: 20px;
    padding: 32px 36px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.04);
    border: 1px solid #f2f2f2;
  }}
.fg-product-info-main .fg-product-title{
  font-size: 1.75rem;
  font-weight: 600;
  margin-bottom: 16px;
  line-height: 1.3;
  color: #000;
  text-shadow: unset;
}
.fg-product-info-main .fg-trust-badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  background: none;
  padding: 0;
  border: none;
  border-radius: 0;
  cursor: pointer;
}
.fg-product-info-main .fg-trust-badge:hover .fg-trust-count{
  text-decoration: underline;
  color: #00aacc;
}
.fg-product-info-main .fg-trust-stars{
  display: flex;
  align-items: center;
  gap: 2px;
}
.fg-product-info-main .fg-trust-count{
  color: #888;
  font-size: 13px;
  transition: color 0.2s;
}
.fg-product-info-main .fg-features{
  list-style: none;
  padding: 0;
  margin-bottom: 32px;
}
.fg-product-info-main .fg-features li{
  padding: 8px 0;
  padding-left: 25px;
  position: relative;
  color: #333;
}
.fg-product-info-main .fg-features li::before{
  content: "•";
  position: absolute;
  left: 0;
  color: #000;
  font-weight: bold;
  font-size: 1.2rem;
}
.fg-product-info-main .fg-btn-add,
.fg-product-info-main .fg-btn-buy{
  padding: 12px 32px;
  font-weight: 600;
  border-radius: 999px;
  transition: all 0.3s ease;
  border: 1px solid #00aacc;
}
.fg-product-info-main .fg-btn-add:hover{
  background: #00aacc;
  border-color: #00aacc;
  color: white;
}
.fg-product-info-main .fg-btn-buy,
.product-bottom-fixed .fg-btn-buy{
  background: #00aacc;
  border-color: #00aacc;
}
.product-bottom-fixed .fg-btn-buy{
  width: auto !important;
  border-radius: 30px;
  padding: 10px 40px;
}
.fg-product-info-main .fg-btn-buy:hover,
.product-bottom-fixed .fg-btn-buy:hover{
  background: #333;
  border-color: #333;
}
@media (max-width: 991px){.fg-product-info-main .fg-product-title{
    font-size: 1.5rem;
  }
.fg-product-info-main .fg-thumb-swiper .swiper-slide{
    width: 70px;
    height: 70px;
  }}
@media (max-width: 576px){.fg-product-info-main .fg-product-info{
    padding: 0;
  }
.fg-product-info-main .fg-thumb-swiper .swiper-slide{
    width: 60px;
    height: 60px;
  }}
.fg-product-text-gsap-animate{
  padding: 65px 0;
  position: relative;
  overflow: hidden;
}
.fg-product-text-gsap-animate .container{
  position: relative;
  overflow: visible;
  /* robot genişse taşıyor olmasın istersen hidden yap */
}
#robot{
  width: 240px;
  user-select: none;
  -webkit-user-drag: none;
  position: absolute;
  pointer-events: none;

  left: 0;
  top: -65px;

  animation: moveRobot 10s forwards;
}
@keyframes moveRobot{
  from {
    left: 0;
    transform: rotate(0deg);
  }

  to {
    left: calc(100% - 240px);
    transform: rotate(720deg);
  }
}
.fg-product-text-gsap-animate figure{
  margin: 0;
  display: flex;
  justify-content: center;
}
.fg-product-text-gsap-animate svg{

  width: 60%;
}
@media(max-width:992px){#robot{
    /* width: 120px */
    display: none
  }
.fg-product-text-gsap-animate svg{
    width: 100%;
  }}
.fg-product-text-gsap-animate svg>*{
  fill: #1c1c1c;
  stroke: #1c1c1c;
  stroke-width: 0.85px;
}
.cls-1{
  fill: #0ac;
  stroke: #0ac;
}
@keyframes tip{

  0%,
  100% {
    opacity: 0;
  }

  10%,
  80% {
    opacity: 1;
  }
}
.fg-product-detail-scroll-swiper{
  padding: 80px 0;
}
.fg-product-detail-scroll-swiper .mySwiper{
  width: 100%;
  padding: 0;
}
.fg-product-detail-scroll-swiper .mySwiper .swiper-slide{
  width: 420px;
  height: 550px;
  border-radius: 24px;
  overflow: hidden;
  transition: 0.4s;
  opacity: 0.6;
  transform: scale(0.85);
}
@media(max-width:992px){.fg-product-detail-scroll-swiper{
    padding: 40px 20px;
  }
.fg-product-detail-scroll-swiper .mySwiper .swiper-slide{
    height: 420px;
  }}
.fg-product-detail-scroll-swiper .mySwiper .swiper-slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fg-product-detail-scroll-swiper .mySwiper .swiper-slide-active{
  opacity: 1;
  transform: scale(1);
  z-index: 10;
}
.fg-right-focused-swiper .mySwiper{
  width: 100%;
  box-sizing: border-box;
  /* slider'ı içeri çekmeden sol kenardan başlaması için padding-left:0 */
  padding-left: 0;
  position: relative;
}
.fg-right-focused-swiper .mySwiper .swiper-wrapper{
  align-items: center;
}
.fg-right-focused-swiper .mySwiper .swiper-slide{
  width: 420px;
  height: 420px;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
  transition: transform 0.36s ease, filter 0.36s ease, opacity 0.36s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ddd;
}
.fg-right-focused-swiper .mySwiper .swiper-slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.fg-right-focused-swiper .mySwiper .swiper-slide:not(.swiper-slide-active){
  filter: brightness(0.55) saturate(0.9);
  opacity: 0.95;
  transform: scale(0.995);
}
.fg-right-focused-swiper .mySwiper .swiper-slide.swiper-slide-active{
  filter: none;
  opacity: 1;
  transform: scale(1);
}
.fg-right-focused-swiper .swiper-button-prev{
  left: -10px;
}
.fg-right-focused-swiper .swiper-button-next{
  right: -10px;
}
@media (max-width: 1150px){.fg-right-focused-swiper .mySwiper .swiper-slide{
    width: 360px;
    height: 360px;
    border-radius: 14px;
  }}
@media (max-width: 820px){.fg-right-focused-swiper .mySwiper .swiper-slide{
    width: 88vw;
    height: 56vw;
    border-radius: 12px;
  }
.fg-right-focused-swiper .swiper-button-prev,
  .fg-right-focused-swiper .swiper-button-next{
    display: none;
  }}
.fg-product-detail-tab-container{
  background: #f8f9fa;
  padding: 20px 0;
}
.fg-product-detail-tab-nav{
  margin-bottom: 30px;
  justify-content: center;
  gap: 20px;
}
.fg-product-detail-tab-button{
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 52px;
  color: #949494;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .01em;
  text-align: left;
  white-space: nowrap;
  padding-inline: 18px;
  background-color: transparent;
  border-radius: 999px;
  box-shadow: 0 2px 14.7px #e3e3e340;
  border: 1px solid #eee;
  width: 220px;
  background-color: #fff;
  cursor: pointer;
}
.fg-product-detail-tab-button > span{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fg-product-detail-tab-button > i{
  flex: 0 0 auto;
}
.fg-product-detail-tab-button:hover{
  color: #212529;
}
.fg-product-detail-tab-button.active{
  color: #fff;
  background-color: #00aacc;
}
.fg-product-detail-tab-content{
  display: none;
  animation: fadeIn 0.3s ease-in;
}
.fg-product-detail-tab-content.active{
  display: block;
}
@keyframes fadeIn{
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.fg-product-detail-tab-section{
  background: white;
  padding: 55px 20px;
  border-radius: 8px;
}
.fg-product-detail-tab-section li{
  margin-bottom: 20px;
}
.fg-product-detail-tab-title{
  font-size: 26px;
  font-weight: 700;
  color: #212529;
  margin-bottom: 50px;
  margin-top: 25px;
  text-align: center;
}
@media(max-width: 992px){.fg-product-detail-tab-title{
    margin-bottom: 25px
  }}
.fg-product-detail-tab-title:first-child{
  margin-top: 0;
}
.fg-product-detail-tab-text{
  color: #495057;
  line-height: 1.8;
  margin-bottom: 15px;
}
.fg-manual-card{
  display: flex;
  align-items: center;
  gap: 16px;
  max-width: 620px;
  margin: 10px auto 0;
  padding: 18px 20px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  box-shadow: 0 2px 14.7px #e3e3e340;
  text-decoration: none;
  color: #212529;
  transition: border-color .15s ease;
}
.fg-manual-card:hover,
.fg-manual-card:focus-visible{
  border-color: #00aacc;
  color: #212529;
  outline: none;
}
.fg-manual-card__icon{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 10px;
  background: #00aacc;
  color: #fff;
}
.fg-manual-card__icon svg{
  width: 24px;
  height: 24px;
  display: block;
}
.fg-manual-card__body{
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: left;
}
.fg-manual-card__title{
  font-size: 16px;
  font-weight: 700;
  color: #212529;
  line-height: 1.3;
}
.fg-manual-card__meta{
  font-size: 13px;
  color: #949494;
  line-height: 1.35;
}
.fg-manual-card__action{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 22px;
  border-radius: 999px;
  background: #00aacc;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  transition: background .15s ease;
}
.fg-manual-card:hover .fg-manual-card__action,
.fg-manual-card:focus-visible .fg-manual-card__action{
  background: #0088b3;
}
.fg-manual-card__action svg{
  width: 18px;
  height: 18px;
  display: block;
}
@media (max-width: 560px){.fg-manual-card{
    flex-wrap: wrap;
    gap: 14px 16px;
    padding: 18px;
  }
.fg-manual-card__body{
    flex: 1 1 55%;
  }
.fg-manual-card__action{
    order: 3;
    width: 100%;
    justify-content: center;
    padding: 12px;
  }}
@media (max-width: 768px){.fg-product-detail-tab-nav{
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
    justify-content: flex-start;
    padding: 4px 16px 14px;
    gap: 10px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-left: -16px;
    margin-right: -16px;
  }
.fg-product-detail-tab-nav::-webkit-scrollbar{
    display: none;
  }
.fg-product-detail-tab-button{
    flex-shrink: 0;
    width: auto;
    min-width: 0;
    height: 44px;
    padding: 0 18px;
    font-size: 13.5px;
    white-space: nowrap;
  }
.fg-product-detail-tab-button i{
    display: none;
  }
.fg-product-detail-tab-section{
    padding: 24px 16px;
  }}
.fg-product-detail-tab-technical-item{
  display: flex;
  flex-direction: column;
  align-items: baseline;
  row-gap: 8px;
  padding: 12px 0;
  border-top: 0;
  position: relative;
  width: 50%;
  /* border-bottom: 1px solid rgba(119, 119, 119, .2); */
}
.fg-product-detail-tab-technical-item::before{
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: rgba(119, 119, 119, .2);
}
.fg-product-detail-tab-technical-item-title{
  color: rgba(0, 0, 0, .8);
  font-weight: 700;
  font-size: 18px;
}
.fg-product-detail-tab-technical-item-text{
  font-size: 17px;
  font-weight: 400;
}

/* ── TEKNİK ÖZELLİKLER (fg-spec) ─────────────────────────────────────────────
   Ürün sayfası "Teknik Özellikler" sekmesinin içeriği. Veri oc4_cecotec_extratab'ten
   gelir ve şablon onu <p class="fg-product-detail-tab-text"> İÇİNE basar → tarayıcı
   <p>'yi blok elemanda erken kapatır (156 Kutu İçeriği kaydı da aynen böyle,
   CLAUDE.md §7.2 md.6 "şablonu düzeltmeye kalkma"). Bu yüzden seçiciler
   .fg-product-detail-tab-text ALTINDA olmaya GÜVENMEZ, kendi kökünden başlar.
   ⚠️ fg-uiscale.css sekme içinde p/li/span/font/td font-size'ını !important ile
   kilitler; <dl>/<dt>/<dd> o listede DEĞİL → ölçüyü burada veriyoruz, sabit px
   değil token ile (--fg-fs-body / --fg-lh-body, CLAUDE.md §4.3.1).
   Hover/aktif efekt YOK: satırlar etkileşimli değil (§4.3.3 "tek vurgu ilkesi":
   zemin dolgusu hover'ın işi değil; dokunmatikte :hover takılma riski de sıfırlanır). */
.fg-spec{
  display: grid;
  grid-template-columns: fit-content(46%) minmax(0, 1fr);
  column-gap: 0;                               /* boşluk padding'den — bkz. SÜREKLI ÇIZGI notu */
  margin: 0;
  padding: 0;
  text-align: left;
}
/* ≥1200px: iki anahtar/değer çifti yan yana. 992px'te DENENDI ve GERI ALINDI —
   değer sütunu 152px'e düşüp en uzun değer (76 karakter) 4 satıra sarıyordu (ölçüldü). */
@media (min-width: 1200px){
  .fg-spec{
    grid-template-columns: fit-content(26%) minmax(0, 1fr) fit-content(26%) minmax(0, 1fr);
  }
  /* İki yarı arasındaki oluk: sol yarının DEĞER hücresinin sağ padding'i.
     column-gap KULLANILMIYOR çünkü grid boşluğu border-bottom'ı da böler →
     çizgiler parçalı görünüyordu (ölçüldü/görüldü). nth-of-type(odd) = sol sütun
     değer hücreleri (satır başına 2 dd var: 1.,3.,5.… hep sol yarıda). */
  .fg-spec > dd:nth-of-type(odd){ padding-right: clamp(24px, 2.6vw, 44px); }
}
.fg-spec > dt,
.fg-spec > dd{
  margin: 0;                                   /* dd'nin varsayılan margin-inline-start:40px'i */
  padding: 13px 0;
  border-bottom: 1px solid rgba(119, 119, 119, .2);  /* SÜREKLI ÇIZGI: hücre border'ları
     yan yana birleşir (aralarında grid gap YOK) → satır boyunca tek saç teli çizgi */
  line-height: var(--fg-lh-body, 1.6);
  overflow-wrap: break-word;
}
.fg-spec > dt{
  padding-right: 18px;                         /* anahtar↔değer boşluğu (gap DEĞİL → çizgi sürekli) */
  font-weight: 700;
  color: rgba(0, 0, 0, .8);
  font-size: var(--fg-fs-body, 14px);
}
.fg-spec > dd{
  color: #495057;
  font-size: var(--fg-fs-body, 14px);
}
/* ≤479.98px: 46% anahtar sütunu 320px ekranda 108px'e düşüyor → anahtarı üste al */
@media (max-width: 479.98px){
  .fg-spec{ grid-template-columns: minmax(0, 1fr); column-gap: 0; }
  .fg-spec > dt{ padding: 11px 0 0; border-bottom: 0; }
  .fg-spec > dd{ padding: 2px 0 11px; }
}

.fg-catsidebar-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
  z-index: 999;
}
.fg-catsidebar-panel{
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 340px;
  max-width: 92vw;
  background: #fff;
  box-shadow: 8px 0 40px rgba(0, 0, 0, 0.1);
  transform: translateX(-110%);
  transition: transform .35s cubic-bezier(.16, 1, .3, 1);
  z-index: 9999999999;
  overflow: visible;
  -webkit-overflow-scrolling: touch;
}
.fg-catsidebar-panel.open{
  transform: translateX(0);
}
.fg-catsidebar-overlay.open{
  opacity: 1;
  pointer-events: auto;
}
.fg-catsidebar-inner{
  padding: 16px 0 40px;
  height: 100vh;
  overflow-y: auto;
  overflow-x: visible;
  -webkit-overflow-scrolling: touch;
}
.fg-catsidebar-close{
  position: absolute;
  right: 16px;
  top: 24px;
  width: 36px;
  height: 36px;
  background: #f5f5f5;
  border: none;
  border-radius: 50%;
  font-size: 18px;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s ease;
  color: #666;
}
.fg-catsidebar-close:hover{
  background: #0a0a0a;
  color: #fff;
  transform: rotate(90deg);
}
.fg-catsidebar-close svg{
  display: block;
  width: 16px;
  height: 16px;
}
.fg-catsidebar-header-row{
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 10px 20px 14px;
  border-bottom: 1px solid #f0f0f0;
}
.fg-catsidebar-logo{
  padding: 0;
}
.fg-catsidebar-logo img{
  height: 28px;
  width: auto;
  display: block;
}
.fg-catsidebar-logo a{
  display: inline-block;
  line-height: 0;
}
.fg-catsidebar-close{
  position: absolute !important;
  top: 50% !important;
  margin-top: -18px !important;
  right: 16px !important;
  left: auto !important;
  flex-shrink: 0;
}
.fg-catsidebar-divider{
  border: none;
  border-top: 1px solid #f0f0f0;
  margin: 0;
}
.fg-catsidebar-nav{
  position: relative;
}
.fg-catsidebar-nav ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
.fg-catsidebar-list{
  list-style: none;
  padding: 0;
  margin: 0;
}
.fg-catsidebar-item{
  position: static;
  padding: 0;
  margin-bottom: 0;
  border-bottom: 1px solid #f0f0f0;
}
.fg-catsidebar-item:last-child{
  border-bottom: none;
}
.fg-catsidebar-link{
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 20px;
  color: #333;
  text-decoration: none;
  font-weight: 500;
  border-radius: 0;
  transition: all .2s ease;
  position: relative;
}
.fg-catsidebar-link:hover{
  background: #f4f9fc;
}
.fg-catsidebar-logo{
  padding: 0 24px
}
.fg-catsidebar-item-icon{
  display: inline-flex;
  width: 46px;
  height: 46px;
  justify-content: center;
  align-items: center;
  background: #f5f7f9;
  border-radius: 14px;
  border: 1px solid #eef0f2;
  box-shadow: none;
  margin-right: 2px;
  flex-shrink: 0;
  transition: all 0.3s ease;
}
.fg-catsidebar-item-icon img,
.fg-catsidebar-item-icon svg{
  width: 22px;
  height: 22px;
  object-fit: contain;
  transition: all 0.3s ease;
}
.fg-catsidebar-item-icon svg{
  stroke: #888;
}
.fg-catsidebar-link:hover .fg-catsidebar-item-icon{
  background: rgba(0, 170, 204, 0.08);
  border-color: rgba(0, 170, 204, 0.15);
  box-shadow: none;
  transform: none;
}
.fg-catsidebar-link:hover .fg-catsidebar-item-icon img,
.fg-catsidebar-link:hover .fg-catsidebar-item-icon svg{
  transform: scale(1.05);
}
.fg-catsidebar-link:hover .fg-catsidebar-item-icon svg{
  stroke: #00aacc;
}
.fg-catsidebar-item-text{
  flex: 1;
  font-size: 14px;
  font-weight: 500;
  color: #333;
  transition: color 0.2s ease;
}
.fg-catsidebar-link:hover .fg-catsidebar-item-text{
  color: #00aacc;
}
.fg-catsidebar-item-arrow{
  margin-left: auto;
  opacity: 0.3;
  transition: all 0.25s ease;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  color: #888;
}
.fg-catsidebar-link:hover .fg-catsidebar-item-arrow{
  opacity: 1;
  color: #00aacc;
  transform: translateX(3px);
}
.fg-catsidebar-submenu{
  position: fixed;
  top: 0;
  left: 340px;
  margin-left: 8px;
  /* Added to prevent clipping the main sidebar edge */
  height: 100vh;
  width: 320px;
  max-width: 85vw;
  background: #fff;
  border-left: 1px solid #f0f0f0;
  box-shadow: 12px 0 40px rgba(0, 0, 0, 0.06);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(10px);
  transition: opacity 0.22s ease, visibility 0.22s ease, transform 0.22s ease;
  z-index: 99999999999;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.fg-catsidebar-item-parent:hover .fg-catsidebar-submenu{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0);
}
.fg-catsidebar-submenu:hover{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0);
}
.fg-catsidebar-submenu-header{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
  position: sticky;
  top: 0;
  z-index: 10;
}
.fg-catsidebar-submenu-back{
  background: #f5f5f5;
  border: 0;
  padding: 0;
  cursor: pointer;
  display: none;
  line-height: 1;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #666;
  transition: all 0.25s ease;
}
.fg-catsidebar-submenu-back:hover{
  background: #0a0a0a;
  color: #fff;
}
.fg-catsidebar-submenu-back svg{
  display: block;
  width: 16px;
  height: 16px;
}
.fg-catsidebar-submenu-title{
  font-weight: 700;
  font-size: 15px;
  color: #0a0a0a;
  letter-spacing: -0.01em;
  flex: 1;
}
.fg-catsidebar-submenu-list{
  list-style: none;
  padding: 0;
  margin: 0;
}
.fg-catsidebar-submenu-list li{
  margin-bottom: 0;
  border-bottom: 1px solid #f0f0f0;
}
.fg-catsidebar-submenu-list li:last-child{
  border-bottom: none;
}
.fg-catsidebar-submenu-link{
  display: flex;
  align-items: center;
  padding: 14px 20px;
  color: #333;
  text-decoration: none;
  border-radius: 0;
  transition: background 0.2s, color 0.2s;
  font-size: 14px;
  font-weight: 500;
}
.fg-catsidebar-submenu-link:hover{
  background: #f4f9fc;
  color: #00aacc;
  transform: none;
}
.fg-catsidebar-submenu-all{
  font-weight: 600;
  color: #00aacc;
  border-bottom: 1px solid #f0f0f0;
  border-radius: 0;
}
.fg-catsidebar-submenu-all:hover{
  transform: none;
  background: #f4f9fc;
  color: #0097b2;
}
.fg-mobile-header-search{
  width: 100%;
}
.fg-mobile-header-search-form{
  width: 100%;
}
.fg-mobile-header-search-wrapper{
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  background: #ffffff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.fg-mobile-header-search-input{
  flex: 1;
  border: none;
  outline: none;
  padding: 6px 20px;
  font-size: 16px; /* 16px: iOS'ta dokununca otomatik zoom'u engeller (15px zoom yapıyordu) */
  color: #202020;
  background: transparent;
  font-weight: 400;
}
.fg-mobile-header-search-input::placeholder{
  color: #999999;
  font-weight: 400;
}
.fg-mobile-header-search-button{
  flex-shrink: 0;
  width: 70px;
  height: 40px;
  border: none;
  outline: none;
  background: #2c9baf;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease;
}
.fg-mobile-header-search-button:hover{
  background: #258a9c;
}
.fg-mobile-header-search-button:active{
  background: #1f7685;
}
.fg-mobile-header-search-icon{
  width: 24px;
  height: 24px;
  stroke-width: 2.5;
  color: #ffffff;
}
@media (max-width: 480px){.fg-mobile-header-search{}
.fg-mobile-header-search-input{
    padding: 4px 16px;
    font-size: 12px;
  }
.fg-mobile-header-search-button{
    width: 40px;
    height: 40px;
  }
.fg-mobile-header-search-icon{
    width: 22px;
    height: 22px;
  }}
@media (max-width: 360px){.fg-mobile-header-search-input{
    padding: 4px 14px;
    font-size: 13px;
  }
.fg-mobile-header-search-button{
    width: 40px;
    height: 40px;
  }
.fg-mobile-header-search-icon{
    width: 20px;
    height: 20px;
  }}
@media (max-width: 768px){.fg-catsidebar-panel{
    width: 280px;
  }
.fg-catsidebar-submenu{
    left: 0;
    width: 280px;
    max-width: 92vw;
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.2, 0.9, 0.2, 1),
      opacity 0.3s ease,
      visibility 0.3s ease;
  }
.fg-catsidebar-submenu-back{
    display: flex;
  }
.fg-catsidebar-item-parent:hover .fg-catsidebar-submenu{
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(100%);
  }
.fg-catsidebar-item-parent.active .fg-catsidebar-submenu{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
  }
.fg-catsidebar-submenu:hover{
    /* Mobilde submenu hover'ı iptal et */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
.fg-catsidebar-item-parent.active .fg-catsidebar-submenu:hover{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }}
@media (min-width: 769px){.fg-catsidebar-submenu{
    left: 320px;
  }}
@media (max-width: 992px){.fg-tab{
    flex-shrink: 0;
    min-width: calc(50% - 10px);
    text-align: center;
  }}
@media (max-width: 768px){.fg-product-zigzag-part{
    padding-top: 40px !important
  }
.fg-product-swiper-part h3{
    font-size: 18px;
    font-weight: 500;
  }
.fg-product-swiper-part p{
    font-size: 12px;
    font-weight: 200;
  }
.fg-product-counter-part .fg-product-counter-title{
    font-size: 24px;
    margin-bottom: 0;
    display: block;
    text-align: center;
  }
.fg-product-counter-part .fg-product-counter-text{
    font-size: 28px;
    display: block;
    text-align: center;
    margin-bottom: 40px;
  }
.fg-product-zigzag-part .fg-product-zigzag-title{
    font-size: 24px;
    margin-bottom: 0;
    display: block;
    text-align: center;
  }
.fg-product-zigzag-part .fg-product-zigzag-text{
    font-size: 28px;
    display: block;
    text-align: center;
    margin-bottom: 40px;
  }
.fg-product-zigzag-part .fg-zigzag-text{
    font-size: 28px;
    align-items: center;
    height: auto;
  }
.fg-zigzag-box{
    padding: 50px 20px
  }}
@media (max-width: 640px){.fg-tab{
    font-size: 14px;
  }}
.outofstock{
  /* filter: grayscale(1); */
  opacity: .4;
}
.outofstock a{
  /* cursor: not-allowed */
}
.disabled{
  cursor: not-allowed;
}
.fullresim{
  position: relative;
  overflow: hidden;
  min-height: 400px;
}
.fullresim *{
  font-family: 'Inter', sans-serif !important;
}
.alert.alert-success.alert-dismissible{
  display: block !important;
  position: relative !important;
  font-size: 13px !important
}
.alert button.close{
  width: 20px !important;
  height: 20px !important;
  line-height: 0px !important;
  position: absolute !important;
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}
.fullresim-content{
  position: relative;
  width: 100%;
  height: 100%;
}
.fullresim-content img{
  width: 100%;
  height: auto;
  display: block;
}
.fullresim-text{
  position: absolute;
  bottom: 100px;
  /* Aşağıdan 200px yukarıda konumlandırma */
  left: 50%;
  transform: translateX(-50%);
  /* Sadece yatay ortalama */
  text-align: center;
  color: white;
  z-index: 2;
  width: 90%;
  max-width: 800px;
  padding: 20px;
}
.fullresim-text h3{
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
.fullresim-text p{
  font-size: 21px !important;
  line-height: 1.6;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  margin: 0;
}
.fullresim-text-mobile h5{
  font-size: 1.5rem !important;
  margin-bottom: 0px !important;
  padding-bottom: 0px !important;
}
.fullresim-text-mobile h3{
  font-size: 1.5rem !important;
  font-weight: 700;
  margin-bottom: 1rem;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
.fullresim-text-mobile p{
  font-size: 18px !important;
  line-height: 1.6;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  margin: 0;
}
@media (max-width: 768px){.fullresim{
    min-height: 1px;
  }
.fullresim-text h5{
    font-size: .7rem !important;
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
  }
.fullresim-text h3{
    font-size: 1.4rem !important;
    color: #fff !important
  }
.fullresim-text p{
    font-size: 1rem;
  }}
@media (max-width: 480px){.fullresim-text{
    bottom: 0;
    padding: 10px;
  }
.fullresim-text h3{
    font-size: 1.4rem;
  }
.fullresim-text p{
    font-size: 0.9rem;
  }}
.product-bottom-fixed{
  position: fixed;
  left: 0;
  bottom: -120px;
  z-index: 9999;
  width: 100%;
  height: 96px;
  padding-block: 6px;
  background-color: #fff;
  box-shadow: 0 -4px 15px 0 rgba(0, 0, 0, 0.1);
  transition: all .4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
body.modal-open-sticky-hide .product-bottom-fixed{
  bottom: -150px !important;
  opacity: 0;
  visibility: hidden;
}
body.scrolled-past-bottom-fixed{
  padding-bottom: 96px;
}
body.scrolled-past-bottom-fixed .product-bottom-fixed{
  bottom: 0;
}
body.scrolled-past-bottom-fixed #backToTop{
  bottom: 110px;
}
@media (max-width: 767px){body.scrolled-past-bottom-fixed #backToTop{
    bottom: 80px;
  }}
.product-bottom-fixed .container{
  width: 1200px;
  padding-left: 20px;
  padding-right: 90px;
  margin-inline: auto;
}
.product-bottom-fixed-inside{
  display: grid;
  align-items: center;
  grid-template-columns: 84px 1fr 200px;
  column-gap: 24px;
}
.product-bottom-fixed-image{
  position: relative;
  width: 100%;
  aspect-ratio: 1;
}
.product-bottom-fixed-image img{
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  max-width: 100%;
  max-height: 100%;
  display: inline-block;
  margin: auto;
}
.product-bottom-fixed-button .product-form,
.product-bottom-fixed-button .add_to_cart_holder{
  margin-bottom: 0;
}
.product-bottom-fixed-title h1{
  line-height: 26px;
  color: #333;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 500px;
}
.product-bottom-fixed-price{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
}
.product-bottom-fixed-price .price{
  font-size: 18px;
  font-weight: 700;
  white-space: nowrap;
}
.product-bottom-fixed-price .text-decoration-line-through{
  white-space: nowrap;
  font-size: 13px !important;
}
@media only screen and (max-width: 1199px){.product-bottom-fixed .container{
    width: 100%;
  }}
@media only screen and (max-width: 991px){.product-bottom-fixed-button .product-form{
    text-align: right;
  }}
@media only screen and (max-width: 767px){.product-bottom-fixed{
    bottom: -100px;
    height: 70px;
    padding-block: 8px;
  }
.product-bottom-fixed-inside{
    grid-template-columns: auto 1fr 1.5fr;
    column-gap: 10px;
    height: 100%;
    align-items: center;
  }
.product-bottom-fixed .container{
    padding-inline: 15px;
    height: 100%;
  }
.product-bottom-fixed-image{
    display: flex;
    align-items: center;
    width: 46px;
    height: 46px;
    flex-shrink: 0;
  }
.product-bottom-fixed-image img{
    width: 46px;
    height: 46px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #eee;
  }
.product-bottom-fixed-title{
    display: none;
  }
.product-bottom-fixed-price{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1px;
  }
.product-bottom-fixed-price .price{
    font-size: 15px;
    margin-bottom: 0;
    white-space: nowrap;
  }
.product-bottom-fixed-price .text-decoration-line-through{
    font-size: 11px !important;
    white-space: nowrap;
  }
.product-bottom-fixed-button{
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
.product-bottom-fixed-button .btn{
    padding: 8px 12px;
    font-size: 14px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
  }}
video::-webkit-media-controls{
  display: none !important;
}
video::-webkit-media-controls-overlay-play-button{
  display: none !important;
}
.fg-product-model{
  display: block;
  color: #aaa;
  font-size: 10px;
  line-height: normal;
  font-weight: 500;
  margin-bottom: 16px;
  background: transparent;
  padding: 0;
  border-radius: 0;
  border: none;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}
.fg-product-model .fg-copyable{
  -webkit-user-select: all;
  -moz-user-select: all;
  -ms-user-select: all;
  user-select: all;
}
@media(max-width: 992px){.fg-product-counter-part .fg-product-counter-number .counter{
    font-size: 44px
  }
.fg-product-counter-part .fg-product-counter-number{
    padding: 20px
  }
.fg-product-counter-part .fg-product-counter-number{
    justify-content: center;
  }
.fg-product-counter-part .fg-product-counter-number .d-flex{
    justify-content: center;
  }
.fg-product-counter-part .fg-product-counter-number .counter-text{
    text-align: center;
  }
.fg-vertical-zigzag .row{
    padding-top: 0px
  }
.row.g-0.fg-ri-tl{
    flex-direction: column-reverse;
  }
.fg-li-tr .fg-vertical-zigzag-box,
  .fg-ri-tl .fg-vertical-zigzag-box{
    padding: 20px 20px 60px 20px
  }
.fg-vertical-zigzag-title{
    font-size: 22px
  }
.fg-vertical-zigzag-text{
    font-size: 15px
  }
#fg-product-detail{
    padding: 0 !important
  }
.fullresim{
    padding: 0 !important
  }
.fg-product-detail-tab-technical-item{
    width: 100%
  }
.fg-product-detail-tab-technical-item-title{
    font-size: 16px
  }
.fg-product-detail-tab-technical-item-text{
    font-size: 14px
  }
.fg-product-info-main .fg-features{
    display: none;
  }}
.fullresim-content>div:not(.fullresim-text){
  display: none
}
.fullresim-content{
  position: relative
}
@media (max-width: 768px){.fullresim-content:before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5)
  }
.fullresim-text{
    position: static !important;
    transform: none !important;
    margin: -132px auto 0 !important;
    left: auto !important;
    top: auto !important;
    max-width: 90% !important;
    text-align: center !important;
  }
.fullresim-content{
    display: flex;
    flex-direction: column;
    align-items: center;
  }}
.dt-s2-minimal{
  background-color: var(--dt-white);
  color: var(--dt-black);
  padding: 150px 0;
  text-align: center;
}
.dt-s3-asymmetric{
  padding: 120px 0;
}
.dt-tech-highlight{
  color: #00f2ea;
  font-size: 1.2rem;
  text-transform: uppercase;
  letter-spacing: 2px;
}
.dt-floating-img{
  animation: float 6s ease-in-out infinite;
}
@keyframes float{

  0%,
  100% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-20px);
  }
}
#fg-discover-swiper{
  overflow: hidden;
}
.fg-desktop-header-search-wrapper{
  position: relative;
}
.fg-desktop-header-search-wrapper i{
  position: absolute;
  top: 13.5px;
  left: 13.5px;
  transition: all .25s cubic-bezier(.104, .204, .492, 1);
}
.fg-desktop-header-search-input{
  box-sizing: border-box;
  padding-right: 15px;
  padding-left: 45px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #333;
  background-color: transparent !important;
  height: 44px;
  border-radius: 999px;
  border: none !important;
  width: 450px;
  outline: none !important;
  transition: width 0.3s ease;
}
.fg-desktop-header-search-wrapper{
  background: #f4f6f8;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: all 0.3s ease;
  display: flex !important;
  align-items: center;
}
.fg-desktop-header-search-wrapper:focus-within{
  background: #fff;
  border-color: #00aacc;
  box-shadow: 0 4px 12px rgba(0, 170, 204, 0.1);
}
.fg-search-icon{
  position: absolute;
  left: 14px;
  color: #888;
  transition: color 0.3s ease;
}
.fg-desktop-header-search-wrapper:focus-within .fg-search-icon{
  color: #00aacc;
}
.fg-header-icon-btn{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #f4f6f8;
  border: 1px solid transparent;
  color: #333 !important;
  text-decoration: none !important;
  transition: all 0.3s ease;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0 !important;
}
.fg-header-icon-btn::after{
  display: none !important;
}
.fg-header-icon-btn:hover{
  background: #fff;
  border-color: #00aacc;
  color: #00aacc !important;
  box-shadow: 0 4px 14px rgba(0, 170, 204, 0.12);
}
.fg-header-icon-btn:hover svg{
  stroke: #00aacc;
}
.fg-header-cart-wrap{
  width: auto !important;
  height: 44px !important;
  border-radius: 999px !important;
  padding: 0 14px 0 12px !important;
  overflow: visible;
  gap: 0;
}
.fg-header-cart-wrap .cart-link{
  display: flex !important;
  align-items: center;
  gap: 8px;
  width: auto;
  height: 100%;
  color: inherit;
  text-decoration: none;
  position: relative;
}
.fg-header-cart-wrap .cart-count{
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  background: #00aacc;
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 20px;
  text-align: center;
  border: none;
  box-sizing: border-box;
  box-shadow: none;
  pointer-events: none;
}
.fg-desktop-header-search-input::placeholder{
  color: #333;
}
.video-section__container{
  position: relative;
  width: 100%;
  max-width: 1366px;
  margin: 0 auto;
}
.video-aspect--16-9{
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 aspect ratio */
  height: 100%;
  overflow: hidden;
}
.video-aspect--16-9 video{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#fg-heroSlider{
  display: none;
}
@media (min-width: 768px){#fg-heroSlider{
    display: block;
  }}
#fg-heroSlider2{
  display: block;
}
@media (min-width: 768px){#fg-heroSlider2{
    display: none;
  }}
.search-autocomplete{
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  max-height: 400px;
  overflow-y: auto;
  z-index: 1000;
  display: none;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
}
.search-autocomplete.active{
  display: block;
}
.search-autocomplete-item{
  padding: 10px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.2s;
}
.search-autocomplete-item:hover{
  background-color: #f5f5f5;
}
.search-autocomplete-item:last-child{
  border-bottom: none;
}
.search-autocomplete-image{
  width: 50px;
  height: 50px;
  object-fit: cover;
  margin-right: 10px;
  border-radius: 4px;
}
.search-autocomplete-details{
  flex: 1;
}
.search-autocomplete-name{
  font-weight: 500;
  color: #333;
  margin-bottom: 4px;
}
.search-autocomplete-price{
  color: #666;
  font-size: 14px;
}
.fg-ac-price-special{
  color: #5C0F1A;
  font-weight: 600;
  margin-right: 6px;
}
.fg-ac-price-old{
  color: #999;
  font-size: 12px;
  text-decoration: line-through;
}
.search-autocomplete-empty{
  padding: 15px;
  text-align: center;
  color: #999;
}
.search-autocomplete-section-title{
  padding: 8px 10px;
  background-color: #f8f8f8;
  font-weight: 600;
  color: #555;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid #e0e0e0;
}
.search-autocomplete-category-item{
  padding: 10px 15px;
  border-bottom: 1px solid #f0f0f0;
  display: block;
  cursor: pointer;
  transition: background-color 0.2s;
  text-decoration: none;
  color: inherit;
}
.search-autocomplete-category-item:hover{
  background-color: #f5f5f5;
}
.fg-mobile-header-search-wrapper{
  position: relative;
}
.header-search-autocomplete{
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  max-height: 500px;
  overflow-y: auto;
  z-index: 10000;
  display: none;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
  border-radius: 16px;
  padding: 8px 0;
}
.header-search-autocomplete.active{
  display: block;
}
.header-search-autocomplete-item{
  padding: 12px 15px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.2s;
  text-decoration: none;
  color: inherit;
}
.header-search-autocomplete-item:hover{
  background-color: transparent !important;
  color: #00aacc !important;
  border-radius: 0 !important;
}
.header-search-autocomplete-item:last-child{
  border-bottom: none;
}
.header-search-autocomplete-image{
  width: 50px;
  height: 50px;
  object-fit: cover;
  margin-right: 12px;
  border-radius: 6px;
  border: 1px solid #eee;
}
.header-search-autocomplete-details{
  flex: 1;
}
.header-search-autocomplete-name{
  font-weight: 500;
  color: #333;
  margin-bottom: 4px;
  font-size: 14px;
}
.header-search-autocomplete-price{
  color: #5C0F1A;
  font-size: 14px;
  font-weight: 600;
}
.header-search-autocomplete-empty{
  padding: 20px;
  text-align: center;
  color: #999;
  font-size: 14px;
}
.header-search-autocomplete-section-title{
  padding: 10px 15px;
  background-color: #f8f9fa;
  font-weight: 600;
  color: #555;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid #e0e0e0;
}
.header-search-autocomplete-category-item{
  padding: 10px 15px;
  border-bottom: 1px solid #f0f0f0;
  display: block;
  cursor: pointer;
  transition: background-color 0.2s;
  text-decoration: none;
  color: inherit;
}
.header-search-autocomplete-category-item:hover{
  background-color: transparent !important;
  color: #00aacc !important;
  border-radius: 0 !important;
}
.fg-desktop-header-search-wrapper{
  position: relative;
}
.cart-link{
  position: relative;
  display: inline-flex;
  align-items: center;
}
.cart-count{
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  background-color: #00aacc;
  color: #ffffff;
  border-radius: 50%;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0, 170, 204, 0.3);
  border: 2px solid #fff;
  box-sizing: content-box;
  pointer-events: none;
}
@media(max-width:992px){#fg-heroSlider2 .fg-slide-content{
    transform: unset;
    top: unset;
    bottom: 30px;
    padding: 0 90px 0 20px !important
  }
#fg-heroSlider2 .fg-slider-controller{
    display: none !important
  }}
.cart-modal{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100005;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}
.cart-modal.show{
  opacity: 1;
  visibility: visible;
}
.cart-modal-overlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
}
.cart-modal-content{
  position: relative;
  background: #fff;
  border-radius: 20px;
  max-width: 500px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
  transform: scale(0.9);
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.cart-modal.show .cart-modal-content{
  transform: scale(1);
}
.cart-modal-close{
  position: absolute;
  top: 15px;
  right: 15px;
  background: #f5f5f5;
  border: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 20px;
  color: #666;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s ease;
  z-index: 1;
}
.cart-modal-close:hover{
  background: #0a0a0a;
  color: #fff;
  transform: rotate(90deg);
}
.cart-modal-header{
  padding: 40px 30px 20px;
  text-align: center;
  border-bottom: 1px solid #f3f4f6;
}
.success-icon-wrapper{
  margin-bottom: 20px;
}
.checkmark{
  width: 80px;
  height: 80px;
  margin: 0 auto;
  display: block;
}
.checkmark-circle{
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke: #00aacc;
  fill: none;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}
.cart-modal.show .checkmark.animate .checkmark-circle{
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}
.checkmark-check{
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  stroke: #00aacc;
  stroke-width: 3;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.6s forwards;
}
.cart-modal.show .checkmark.animate .checkmark-check{
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.6s forwards;
}
@keyframes stroke{
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes scaleIn{
  0% {
    transform: scale(0);
  }

  50% {
    transform: scale(1.2);
  }

  100% {
    transform: scale(1);
  }
}
.cart-modal-header h3{
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: #1f2937;
}
.cart-modal-body{
  padding: 25px 30px;
}
.added-product-info{
  display: flex;
  gap: 20px;
  padding: 20px;
  background: #f9fafb;
  border-radius: 12px;
  margin-bottom: 20px;
}
.added-product-info img{
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 8px;
  flex-shrink: 0;
}
.product-details{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.product-details h4{
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: #1f2937;
  line-height: 1.4;
}
.product-quantity,
.product-price{
  margin: 0;
  font-size: 14px;
  color: #6b7280;
}
.product-price{
  font-size: 18px;
  font-weight: 700;
  color: #00aacc;
}
.cart-summary{
  border-top: 2px dashed #e5e7eb;
  padding-top: 20px;
}
.summary-row{
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
}
.summary-row strong{
  font-size: 20px;
  color: #00aacc;
}
.cart-modal-footer{
  padding: 20px 30px 30px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cart-modal-footer button,
.cart-modal-footer a{
  padding: 14px 24px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  display: block;
}
.btn-checkout{
  background: linear-gradient(135deg, #00aacc 0%, #014d5c 100%);
  color: #fff;
  box-shadow: 0 4px 12px rgba(0, 122, 148, 0.32);
}
.btn-checkout:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 122, 148, 0.42);
  color: #fff;
}
.btn-go-cart{
  background: #fff;
  color: #1f2937;
  border: 2px solid #e5e7eb;
}
.btn-go-cart:hover{
  background: #f9fafb;
  border-color: #d1d5db;
  color: #1f2937;
}
.btn-continue-shopping{
  background: transparent;
  color: #6b7280;
  border: none;
  font-size: 14px;
  padding: 8px;
}
.btn-continue-shopping:hover{
  color: #1f2937;
  text-decoration: underline;
}
@media (max-width: 640px){.cart-modal-content{
    width: 95%;
    border-radius: 16px;
  }
.cart-modal-header,
  .cart-modal-body,
  .cart-modal-footer{
    padding-left: 20px;
    padding-right: 20px;
  }
.added-product-info{
    flex-direction: column;
    text-align: center;
  }
.added-product-info img{
    width: 80px;
    height: 80px;
    margin: 0 auto;
  }
.checkmark{
    width: 60px;
    height: 60px;
  }
.cart-modal-header h3{
    font-size: 20px;
  }}
.video-trigger-btn{
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 10;
  width: auto;
  min-width: 50px;
  height: 50px;
  padding: 0 20px;
  background: rgba(0, 0, 0, 0.7);
  border: 2px solid rgba(255, 255, 255, 0.9);
  border-radius: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  backdrop-filter: blur(10px);
}
.video-trigger-btn span{
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.video-trigger-btn:hover{
  background: rgba(0, 0, 0, 0.9);
  transform: scale(1.1);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}
.video-trigger-btn svg{
  width: 24px;
  height: 24px;
  color: #fff;
  margin-left: 2px;
  /* Play ikonunu ortala */
}
.video-modal-content{
  max-width: 1200px;
  width: 90%;
  background: #000;
  border-radius: 12px;
  overflow: hidden;
}
.video-modal-content .cart-modal-body{
  padding: 0;
}
.video-wrapper{
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 Aspect Ratio */
  height: 0;
  overflow: hidden;
}
.video-wrapper iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#video-modal .cart-modal-close{
  color: #fff;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
#video-modal .cart-modal-close:hover{
  background: #fff;
  color: #0a0a0a;
}
@media (max-width: 768px){.video-trigger-btn{
    width: 50px;
    height: 50px;
    min-width: 40px;
    padding: 0;
    top: 15px;
    left: 15px;
    border-radius: 50%;
  }
.video-trigger-btn span{
    display: none;
  }
.video-trigger-btn svg{
    width: 20px;
    height: 20px;
    margin-left: 2px;
  }
.video-modal-content{
    width: 95%;
    border-radius: 8px;
  }}
@media (max-width: 768px){.fg-tab{
    flex: 0 0 50%;
    /* BURASI DEĞİŞTİ: 100 yerine 50 */
    box-sizing: border-box;
    /* Padding eklersek taşmasın diye */
    text-align: center;
    justify-content: center;
    scroll-snap-align: start;
    /* Kaydırınca sol başa hizalansın */
    padding: 0 5px;
    /* Aralarında hafif boşluk hissi olsun */
  }}
.installment-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
}
@media (min-width: 768px){.installment-grid{
    grid-template-columns: repeat(2, 1fr);
  }}
@media (min-width: 992px){.installment-grid{
    grid-template-columns: repeat(3, 1fr);
  }}
.installment-grid>div{
  margin-bottom: 0 !important;
}
@media screen and (width: 1920px){#textContainer1920{
    top: 65% !important;
  }}
.cc-triple-section{
  padding: 0;
  background: #fff;
}
.cc-triple-col{
  padding: 0 !important;
  position: relative;
  overflow: hidden;
}
.cc-triple-image-wrapper{
  position: relative;
  width: 100%;
  overflow: hidden;
}
.cc-triple-image-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  transition: transform 0.6s ease;
}
.cc-triple-image-wrapper:hover img{
  transform: scale(1.1);
}
.cc-triple-overlay{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(to top, rgb(0 0 0 / 85%) 0%, rgb(0 0 0 / 70%) 70%, transparent 100%);
  padding: 40px 30px;
  color: white;
}
.cc-triple-title{
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 15px;
  color: white;
  line-height: 1.3;
}
.cc-triple-description{
  font-size: 15px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
}
@media (max-width: 768px){.cc-triple-image-wrapper{}
.cc-triple-title{
    font-size: 22px;
  }
.cc-triple-description{
    font-size: 14px;
  }}
.fg-spain-price-wrapper{
  margin-bottom: 16px;
}
.fg-spain-price{
  color: #B10A45;
  font-size: 36px;
  font-weight: 700;
  line-height: 1;
}
.fg-spain-price.special{
  color: #B10A45;
}
.fg-spain-old-price{
  color: #6c757d;
  font-size: 18px;
  text-decoration: line-through;
  margin-top: 5px;
}
.fg-spain-vat{
  color: #666;
  font-size: 14px;
  font-weight: 400;
  margin-left: 5px;
}
.fg-spain-installment-bar{
  background-color: #fcfcfd;
  color: #333;
  padding: 16px 24px;
  border-radius: 12px;
  border: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: all 0.3s ease;
  margin-bottom: 0;
  cursor: pointer;
}
.fg-spain-installment-bar:hover{
  background-color: #fff;
  border-color: #00aacc;
  box-shadow: 0 10px 25px rgba(0, 170, 204, 0.08);
}
.fg-sib-left{
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  font-weight: 500;
}
.fg-sib-left i{
  color: #00aacc;
  font-size: 18px;
}
.fg-sib-link{
  color: #00aacc;
  margin-left: 12px;
  font-size: 13px;
  font-weight: 600;
}
.fg-sib-right{
  font-size: 18px;
  font-weight: 700;
  color: #333;
}
.fg-sib-month{
  font-size: 13px;
  color: #888;
  font-weight: 400;
  margin-left: 3px;
}
.fg-installment-amount{
  color: #333 !important;
}
.fg-action-buttons{
  margin-bottom: 32px !important;
}
@media(max-width: 992px){.fg-spain-price-wrapper{
    margin-bottom: 16px;
  }
.fg-action-buttons{
    margin-bottom: 24px !important;
    width: 100%;
    margin-top: 10px;
  }
.fg-action-buttons .btn{
    flex: 1;
    padding-left: 10px;
    padding-right: 10px;
    text-align: center;
    white-space: nowrap;
    font-size: 13px;
  }
.fg-btn-wishlist-icon{
    width: 48px;
    height: 48px;
  }
.fg-spain-installment-bar{
    margin-bottom: 24px;
  }
.fg-product-info-main .fg-product-title{
    font-size: 1.5rem;
    margin-bottom: 16px;
  }}
@media (max-width: 768px){.fg-spain-installment-bar{
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
.fg-sib-link{
    margin-left: auto;
  }
.fg-sib-right{
    align-self: flex-end;
  }}
.fg-btn-add,
.fg-btn-buy,
#button-cart,
#button-cart2,
#button-cart-fixed,
.fg-product-detail-tab-button,
.fg-spain-installment-bar,
.btn-dark,
.btn-outline-dark,
.fg-sib-link,
.fg-cc-value,
.fg-header-cat-btn,
.fg-catsidebar-link,
.fg-catsidebar-close,
.fg-catsidebar-submenu-back,
button,
a.btn{
  cursor: pointer !important;
}
.fg-recently-viewed-section,
.fg-similar-products-section{
  padding: 60px 0;
  background-color: #f7f7f7;
  overflow: hidden;
}
.fg-recently-viewed-section{
  border-bottom: 1px solid #eaeaea;
}
.fg-section-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 30px;
}
.fg-section-title{
  font-size: 24px;
  font-weight: 700;
  color: #111;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}
.fg-section-title i{
  color: #00aacc;
}
.fg-section-link{
  font-size: 15px;
  font-weight: 600;
  color: #555;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: color 0.3s ease;
}
.fg-section-link:hover{
  color: #00aacc;
}
.fg-rec-product-card{
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
  border: 1px solid rgba(0, 0, 0, 0.04);
}
.fg-rec-product-card:hover{
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}
.fg-rec-product-image{
  position: relative;
  display: block;
  padding-top: 100%;
  overflow: hidden;
  background: #fff;
}
.fg-rec-product-image img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 15px;
  transition: transform 0.4s ease;
}
.fg-rec-product-card:hover .fg-rec-product-image img{
  transform: scale(1.05);
}
.fg-rec-product-info{
  padding: 20px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.fg-rec-product-name{
  font-size: 15px;
  font-weight: 600;
  color: #333;
  text-decoration: none;
  margin-bottom: 12px;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  /* 2 satır için sabit yükseklik ayır: 1 ve 2 satırlık başlıklar aynı yükseklikte
     dursun (fiyat/buton hep aynı hizada). flex-grow başlığın altında boşluk bırakıyordu. */
  min-height: 2.8em;
  transition: color 0.3s;
}
.fg-rec-product-name:hover{
  color: #00aacc;
}
.fg-rec-product-price{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  margin-bottom: 15px;
}
.fg-rec-price-current{
  font-size: 17px;
  font-weight: 700;
  color: #5C0F1A;
  line-height: 1.2;
}
.fg-rec-price-old{
  font-size: 13px;
  color: #999;
  text-decoration: line-through;
  line-height: 1.2;
}
.fg-rec-product-btn{
  display: block;
  width: 100%;
  padding: 10px;
  text-align: center;
  background-color: #fff;
  border: 1px solid #eee;
  color: #111;
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  transition: all 0.3s ease;
  /* Butonu her zaman kartın en altına sabitle (fiyat satırı 1 veya 2 satır olsun fark etmez). */
  margin-top: auto;
}
.fg-rec-product-card:hover .fg-rec-product-btn,
.fg-rec-product-btn:hover{
  background-color: #00aacc;
  border-color: #00aacc;
  color: #fff;
}
.fg-recently-viewed-swiper,
.fg-similar-products-swiper{
  padding: 20px 10px !important;
  margin: -20px -10px !important;
  position: relative;
}
.fg-recently-viewed-swiper .swiper-wrapper,
.fg-similar-products-swiper .swiper-wrapper{
  align-items: stretch;
}
.fg-recently-viewed-swiper .swiper-slide,
.fg-similar-products-swiper .swiper-slide{
  height: auto;
  display: flex;
}
.fg-recently-viewed-swiper .swiper-slide .fg-rec-product-card,
.fg-similar-products-swiper .swiper-slide .fg-rec-product-card{
  width: 100%;
}
.fg-rv-arrow{
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 44px !important;
  height: 44px !important;
  background: rgba(0, 0, 0, 0.5) !important;
  border: 2px solid rgba(255, 255, 255, 0.4) !important;
  border-radius: 50% !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 0 !important;
  z-index: 10 !important;
  backdrop-filter: blur(4px) !important;
  transition: background .2s, opacity .2s !important;
  cursor: pointer;
  box-shadow: none !important;
}
.fg-rv-arrow:after{
  content: none !important;
}
.fg-rv-arrow i{
  font-size: 22px;
  line-height: 1;
}
.fg-rv-arrow:hover{
  background: rgba(0, 0, 0, 0.75) !important;
  color: #fff !important;
}
.fg-rv-arrow.swiper-button-prev,
.fg-rv-arrow.fg-rv-prev,
.fg-rv-arrow.fg-sp-prev{
  left: 0 !important;
}
.fg-rv-arrow.swiper-button-next,
.fg-rv-arrow.fg-rv-next,
.fg-rv-arrow.fg-sp-next{
  right: 0 !important;
}
@media(max-width: 768px){.fg-recently-viewed-section,
  .fg-similar-products-section{
    padding: 40px 0;
  }
.fg-section-title{
    font-size: 18px;
  }
.fg-rec-product-info{
    padding: 12px;
  }
.fg-rec-product-name{
    font-size: 13px;
    margin-bottom: 8px;
  }
.fg-rec-price-current{
    font-size: 14px;
  }
.fg-rec-price-old{
    font-size: 12px;
  }
.fg-rec-product-btn{
    padding: 8px 6px;
    font-size: 13px;
  }
.fg-rv-arrow{
    display: none !important;
  }}
.btn-close,
.modal .btn-close,
.modal .close,
.offcanvas .btn-close,
.fslightbox-toolbar-button,
.cart-modal-close,
.icon-close-popup,
#video-modal .cart-modal-close{
  background-color: #f5f5f5 !important;
  background-image: none !important;
  opacity: 1 !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  padding: 0 !important;
  display: block !important;
  transition: all 0.25s ease !important;
  border: none !important;
  outline: none !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
  position: absolute !important;
  z-index: 99 !important;
  cursor: pointer !important;
}
.modal .close{ font-size: 0 !important; }
.btn-close::before,
.fslightbox-toolbar-button svg,
.cart-modal-close i,
.icon-close-popup i{
  display: none !important;
}
.btn-close::after,
.modal .btn-close::after,
.modal .close::after,
.offcanvas .btn-close::after,
.fslightbox-toolbar-button::after,
.cart-modal-close::after,
.icon-close-popup::after,
#video-modal .cart-modal-close::after{
  content: "";
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  background-color: #666 !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  transition: all 0.25s ease !important;
}
.btn-close:hover,
.modal .btn-close:hover,
.modal .close:hover,
.offcanvas .btn-close:hover,
.fslightbox-toolbar-button:hover,
.cart-modal-close:hover,
.icon-close-popup:hover,
#video-modal .cart-modal-close:hover{
  background-color: #0a0a0a !important;
  transform: rotate(90deg) !important;
}
.btn-close:hover::after,
.modal .btn-close:hover::after,
.modal .close:hover::after,
.offcanvas .btn-close:hover::after,
.fslightbox-toolbar-button:hover::after,
.cart-modal-close:hover::after,
.icon-close-popup:hover::after,
#video-modal .cart-modal-close:hover::after{
  background-color: #fff !important;
}
.modal .btn-close,
.modal .close,
.offcanvas .btn-close{
  top: 16px !important;
  right: 16px !important;
}
.fslightbox-toolbar-button{
  top: 24px !important;
  right: 24px !important;
}
.cart-modal-close{
  top: 16px !important;
  right: 16px !important;
}
.alert,
.alert-dismissible{
  border: none !important;
  border-radius: 10px !important;
  padding: 14px 18px !important;
  font-size: 14px !important;
  line-height: 1.45;
}
.alert-success{
  background: #dcfce7 !important;
  color: #166534 !important;
  border-left: 4px solid #22c55e !important;
}
.alert-danger{
  background: #fef2f2 !important;
  color: #991b1b !important;
  border-left: 4px solid #ef4444 !important;
}
.alert-warning{
  background: #fffbeb !important;
  color: #92400e !important;
  border-left: 4px solid #f59e0b !important;
}
.alert-info{
  background: #eff6ff !important;
  color: #1e3a8a !important;
  border-left: 4px solid #3b82f6 !important;
}
.alert i.fa,
.alert .fa{
  margin-right: 8px;
}
@media (max-width: 991px){.header-rightfg{
    display: flex !important;
  }}
@media (max-width: 991px){.fg-header-container .fg-header-main-row{
    position: relative;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
.fg-header-nav{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
  }
.fg-main-logo{
    width: 140px !important;
    transition: width 0.3s;
  }
.fg-catsidebar-panel{
    width: 100vw !important;
    max-width: 100vw !important;
  }
.fg-catsidebar-submenu{
    left: 0 !important;
    margin-left: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    border-left: none !important;
    box-shadow: none !important;
    z-index: 10;
  }
.fg-hamburger{
    width: 40px !important;
    height: 40px !important;
    background: transparent !important;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 11;
    position: relative;
  }
.fg-hamburger span{
    background-color: #000 !important;
    width: 24px;
    height: 2px;
    margin: 3px 0;
  }
.fg-hamburger:hover{
    background: transparent !important;
  }
.header-rightfg{
    z-index: 11;
    position: relative;
    margin-left: auto !important;
    gap: 2px !important;
  }
.header-rightfg .fg-header-icon-btn{
    width: auto !important;
    height: auto !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 4px !important;
    box-shadow: none !important;
  }
.header-rightfg .fg-header-icon-btn.d-none{
    display: none !important;
  }
.header-rightfg .fg-header-cart-wrap{
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
  }
.header-rightfg .fg-header-cart-wrap .cart-link{
    width: 40px;
    height: 40px;
    gap: 0;
    padding: 0;
    justify-content: center;
  }
.header-rightfg .fg-header-cart-wrap .cart-link svg{
    width: 24px;
    height: 24px;
  }
.header-rightfg .fg-header-cart-wrap .cart-count{
    display: none !important;
  }
.fg-mobile-search-row{
    margin: 0 -15px !important;
    padding: 8px 15px 12px !important; /* Offset box shadow to visually center */
    background-color: #f4f6f8;
    border-top: none;
    width: calc(100% + 30px);
  }
.fg-mobile-search-row .col-12{
    padding: 0 !important;
  }
.fg-mobile-search-row .fg-mobile-header-search,
  .fg-mobile-search-row .fg-mobile-header-search-form{
    margin: 0 !important;
    padding: 0 !important;
  }
.fg-mobile-header-search-input{
    font-size: 16px !important;
    -webkit-text-size-adjust: 100%;
    touch-action: manipulation;
  }
.fg-mobile-header-search-input:focus{
    font-size: 16px !important;
  }
#search .form-control{
    font-size: 16px !important;
    background-color: #f5f5f5 !important;
    border: 1px solid #f0f0f0 !important;
    border-radius: 8px !important;
    padding-left: 16px;
    box-shadow: none !important;
  }
#search .btn{
    background-color: transparent !important;
    color: #000 !important;
    border: none !important;
  }
.fg-search-overlay{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 999;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    animation: fadeInOverlay 0.25s ease;
  }
.fg-search-overlay.active{
    display: block;
  }
@keyframes fadeInOverlay{
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }
.fg-mobile-header-search-wrapper{
    position: relative !important;
    z-index: 1001;
  }
.search-autocomplete{
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: -15px !important;
    right: -15px !important;
    bottom: auto !important;
    max-height: 65vh !important;
    height: auto !important;
    border-radius: 0 0 16px 16px !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15) !important;
    z-index: 1001 !important;
    border: none !important;
    padding: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    animation: slideDownResults 0.25s ease;
  }
@keyframes slideDownResults{
    from {
      opacity: 0;
      transform: translateY(-10px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
.search-autocomplete .fg-search-results-header{
    position: sticky;
    top: 0;
    background: #fff;
    padding: 16px 20px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f0f0f0;
    z-index: 2;
  }
.fg-search-results-title{
    font-size: 15px;
    font-weight: 700;
    color: #1a1a1a;
    letter-spacing: -0.2px;
  }
.search-autocomplete .search-autocomplete-section-title{
    padding: 12px 20px 8px !important;
    background: #fff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #999 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border-bottom: none !important;
  }
.search-autocomplete .search-autocomplete-item{
    padding: 12px 20px !important;
    border-bottom: 1px solid #f5f5f5 !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    text-decoration: none !important;
  }
.search-autocomplete .search-autocomplete-item:active{
    background-color: #f0f4f8 !important;
  }
.search-autocomplete .search-autocomplete-image{
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    border-radius: 10px !important;
    object-fit: cover !important;
    background: #f8f8f8;
    border: 1px solid #f0f0f0;
  }
.search-autocomplete .search-autocomplete-name{
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #1a1a1a !important;
    line-height: 1.35 !important;
    margin-bottom: 3px !important;
  }
.search-autocomplete .search-autocomplete-price{
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #00aacc !important;
  }
.search-autocomplete .search-autocomplete-category-item{
    padding: 12px 20px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #333 !important;
    border-bottom: 1px solid #f5f5f5 !important;
  }
.search-autocomplete .search-autocomplete-category-item:active{
    background-color: #f0f4f8 !important;
  }
.search-autocomplete .search-autocomplete-empty{
    padding: 40px 20px !important;
    text-align: center !important;
    color: #aaa !important;
    font-size: 14px !important;
  }
.fg-search-close-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 16px;
    border: none;
    background: #f4f6f8;
    color: #666;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border-top: 1px solid #eee;
    transition: background 0.2s;
  }
.fg-search-close-btn:active{
    background: #e8eaed;
  }
.fg-search-close-btn svg{
    width: 16px;
    height: 16px;
  }}
.fg-mobile-sidebar-tabs{
  display: flex;
  background: #f4f6f8;
  border-radius: 12px;
  padding: 4px;
}
.fg-tab-btn{
  flex: 1;
  background: transparent;
  border: none;
  padding: 10px 0;
  font-size: 13px;
  font-weight: 700;
  color: #888;
  border-radius: 8px;
  transition: all 0.25s ease;
}
.fg-tab-btn.active{
  background: #fff;
  color: #0a0a0a;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.fg-tab-content{
  display: none;
  animation: fadeInTab 0.3s ease;
}
.fg-tab-content.active{
  display: block;
}
@keyframes fadeInTab{
  from {
    opacity: 0;
    transform: translateY(5px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.fg-mobile-menu-links li{
  opacity: 1 !important;
  transform: none !important;
}
.fg-product-discount-badge{
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 10;
  background: #00AACC;
  color: #fff;
  padding: 0 16px;
  height: 50px;
  border-radius: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  pointer-events: none;
}
.fg-discount-mobile{
  display: none;
}
.fg-discount-desktop{
  display: block;
}
@media (max-width: 768px){.fg-product-discount-badge{
    top: 15px;
    right: 15px;
    width: 50px;
    height: 50px;
    padding: 0;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
  }
.fg-discount-desktop{
    display: none;
  }
.fg-discount-mobile{
    display: block;
  }}
.fg-catsidebar-allproducts .fg-catsidebar-item-text{
  color: #333;
  font-weight: 500;
}
.fg-btn-wishlist{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 1.5px solid #e0e0e0;
  border-radius: 999px;
  padding: 9px 20px;
  font-size: 13px;
  font-weight: 500;
  color: #888;
  cursor: pointer;
  transition: all 0.25s ease;
}
.fg-btn-wishlist:hover{
  border-color: #e74c3c;
  color: #e74c3c;
}
.fg-btn-wishlist:hover svg{
  fill: #e74c3c;
  stroke: #e74c3c;
}
.fg-btn-wishlist svg{
  transition: all 0.25s ease;
  flex-shrink: 0;
}
.fg-btn-wishlist-icon{
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  padding: 0;
  justify-content: center;
  border-radius: 999px;
}
.fg-btn-wishlist.is-wishlisted{
  border-color: #e74c3c;
  color: #e74c3c;
}
.fg-btn-wishlist.is-wishlisted svg{
  fill: #e74c3c;
  stroke: #e74c3c;
}
.fg-btn-wishlist.is-wishlisted:hover{
  background: #fdf0ef;
  border-color: #c0392b;
}
.fg-btn-wishlist.is-wishlisted:hover svg{
  fill: #c0392b;
  stroke: #c0392b;
}
.fg-reviews-list{
  margin-top: 8px;
}
#yorumlar .fg-product-detail-tab-section{
  padding-top: 40px;
  padding-bottom: 40px;
}
.fg-review-form-box{
  background: #fff;
  border: 1px solid #ebebeb;
  border-radius: 20px;
  padding: 40px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.05);
}
.fg-review-form-heading{
  font-size: 20px;
  font-weight: 700;
  color: #111;
  margin-bottom: 28px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 24px;
  border-bottom: 1px solid #f3f3f3;
}
.fg-review-form-heading i{
  color: #00aacc;
}
.fg-review-form-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
  align-items: start;
}
.fg-review-form-col{
  display: flex;
  flex-direction: column;
}
.fg-form-label{
  font-size: 11.5px;
  font-weight: 700;
  color: #888;
  margin-bottom: 8px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}
.fg-form-label .text-danger{
  color: #e74c3c;
  font-size: 13px;
}
.fg-form-control,
.fg-review-form .form-control.fg-form-control{
  width: 100%;
  height: 52px;
  padding: 0 18px;
  border: 1.5px solid #e8e8e8;
  border-radius: 12px;
  font-size: 14.5px;
  font-weight: 400;
  color: #222;
  background: #fafafa;
  transition: border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
  display: block;
  box-sizing: border-box;
  outline: none;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
}
.fg-form-control::placeholder,
.fg-review-form .form-control.fg-form-control::placeholder{
  color: #bbb;
  font-weight: 400;
}
.fg-form-control:focus,
.fg-review-form .form-control.fg-form-control:focus{
  border-color: #00aacc;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(0,170,204,0.09);
  outline: none;
}
.fg-form-control:hover:not(:focus),
.fg-review-form .form-control.fg-form-control:hover:not(:focus){
  border-color: #ccc;
}
textarea.fg-form-control,
.fg-review-form textarea.form-control.fg-form-control{
  height: auto;
  min-height: 130px;
  padding: 16px 18px;
  resize: vertical;
  line-height: 1.6;
}
.fg-star-rating{
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 2px;
}
.fg-star-rating input[type="radio"]{
  display: none;
}
.fg-star-rating label{
  color: #e0e0e0;
  cursor: pointer;
  transition: color 0.15s ease, transform 0.1s ease;
  display: inline-flex;
  align-items: center;
  line-height: 1;
}
.fg-star-rating label:hover{
  transform: scale(1.12);
}
.fg-star-rating input:checked ~ label,
.fg-star-rating label:hover,
.fg-star-rating label:hover ~ label{
  color: #FFC107;
}
.fg-trust-no-reviews{
  color: #bbb !important;
  font-style: italic;
}
.fg-captcha-row{
  margin-bottom: 0;
}
.fg-captcha-wrapper fieldset{
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
}
.fg-captcha-wrapper .form-group{
  margin-bottom: 0 !important;
}
.fg-captcha-wrapper label.control-label{
  display: none !important;
}
.fg-captcha-wrapper .col-sm-12{
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100%;
}
.fg-captcha-wrapper .d-flex{
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  gap: 12px !important;
  overflow: visible !important;
}
.fg-captcha-wrapper input[type="text"]{
  width: 180px !important;
  flex: 0 0 180px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 1.5px solid #e8e8e8 !important;
  border-radius: 12px !important;
  font-size: 14.5px !important;
  color: #222 !important;
  background: #fafafa !important;
  box-sizing: border-box !important;
  transition: border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease !important;
  outline: none !important;
  box-shadow: none !important;
  display: block !important;
}
.fg-captcha-wrapper input[type="text"]:focus{
  border-color: #00aacc !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(0,170,204,0.09) !important;
  outline: none !important;
}
.fg-captcha-wrapper img{
  height: 52px !important;
  width: auto !important;
  border-radius: 12px !important;
  border: 1.5px solid #e8e8e8 !important;
  flex: 0 0 auto !important;
  display: block !important;
  margin: 0 !important;
  object-fit: cover !important;
}
.fg-captcha-wrapper .text-danger{
  display: none !important;
}
.fg-btn-submit-review{
  margin-top: 24px;
  height: 52px;
  padding: 0 36px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  background: #00aacc;
  border: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background 0.22s ease, transform 0.15s ease, box-shadow 0.22s ease;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0,170,204,0.25);
  letter-spacing: 0.2px;
}
.fg-btn-submit-review:hover{
  background: #111;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.18);
}
.fg-btn-submit-review:active{
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}
.fg-review-login-notice{
  text-align: center;
  padding: 40px 24px;
  color: #888;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.fg-review-login-notice i{
  font-size: 18px;
  color: #00aacc;
}
.fg-review-login-notice a{
  color: #00aacc;
  text-decoration: underline;
}
@media (max-width: 768px){.fg-review-form-box{
    padding: 24px 18px;
    border-radius: 16px;
  }
.fg-review-form-heading{
    font-size: 17px;
    margin-bottom: 20px;
    padding-bottom: 16px;
  }
.fg-review-form-row{
    grid-template-columns: 1fr;
    gap: 0;
  }
.fg-review-form-col{
    margin-bottom: 16px;
  }
.fg-form-control,
  .fg-review-form .form-control.fg-form-control{
    height: 48px;
    font-size: 16px;
  }
textarea.fg-form-control,
  .fg-review-form textarea.form-control.fg-form-control{
    min-height: 110px;
  }
.fg-star-rating label svg{
    width: 28px;
    height: 28px;
  }
.fg-captcha-wrapper .d-flex{
    flex-wrap: wrap !important;
    gap: 10px !important;
  }
.fg-captcha-wrapper input[type="text"]{
    width: 100% !important;
    flex: 1 1 100% !important;
    height: 48px !important;
    font-size: 16px !important;
  }
.fg-captcha-wrapper img{
    height: 48px !important;
    max-width: 160px !important;
    flex: 0 0 auto !important;
  }
.fg-btn-submit-review{
    width: 100%;
    justify-content: center;
    height: 52px;
    margin-top: 20px;
  }}
.fg-stock-notice{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  margin: 0 0 24px;
  background: #fdf3f2;
  border: 1px solid #f4cbc6;
  border-radius: 14px;
}
.fg-stock-notice svg{
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  stroke: #d92d20;
}
.fg-stock-notice-text{
  display: flex;
  flex-direction: column;
  line-height: 1.35;
}
.fg-stock-notice-text strong{
  font-size: 15px;
  font-weight: 700;
  color: #b42318;
}
.fg-stock-notice-text span{
  font-size: 13px;
  color: #9a655e;
}
.fg-btn-soldout{
  flex: 1;
  padding: 12px 32px;
  font-weight: 600;
  font-size: 15px;
  border-radius: 999px;
  background: #f1f1f3;
  color: #8a8f99;
  border: 1px solid #e3e4e8;
  cursor: not-allowed !important;
  pointer-events: none;
}
.fg-product-info-main .fg-btn-add.disabled,
.fg-product-info-main .fg-btn-buy.disabled,
.product-bottom-fixed .fg-btn-buy.disabled,
#button-cart.disabled,
#button-cart2.disabled,
#button-cart-bottom.disabled{
  background: #f1f1f3 !important;
  color: #8a8f99 !important;
  border-color: #e3e4e8 !important;
  cursor: not-allowed !important;
  opacity: 1;
  pointer-events: none;
  box-shadow: none;
}
.fg-product-info-main .fg-btn-add.disabled:hover,
.fg-product-info-main .fg-btn-buy.disabled:hover,
.product-bottom-fixed .fg-btn-buy.disabled:hover,
#button-cart.disabled:hover,
#button-cart2.disabled:hover,
#button-cart-bottom.disabled:hover{
  background: #f1f1f3 !important;
  color: #8a8f99 !important;
  border-color: #e3e4e8 !important;
}
.modal-backdrop{ z-index: 100050; }
/* ═══ kaynak: mg-stiller.css.off (20KB → 18KB) ═══ */
:root{
  --mg-dark-bg: #0d2b2e;
  --mg-accent: #4ecdc4;
  --mg-text-light: #ffffff;
  --mg-text-muted: rgba(255, 255, 255, 0.75);
  --mg-overlay: rgba(0, 0, 0, 0.45);
}
@media (min-width: 993px){.mobile-only{
    display: none !important;
  }}
@media (max-width: 992px){.desktop-only{
    display: none !important;
  }}
.mg-video-banner{
  position: relative;
  width: 100%;
  height: 650px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  overflow: hidden;
}
.mg-video-banner__bg{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
}
.mg-video-banner__overlay{
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.25);
}
.mg-play-btn{
  position: relative;
  z-index: 5;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.15);
  border: 2px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  backdrop-filter: blur(5px);
  animation: mg-play-pulse 2s infinite;
}
@keyframes mg-play-pulse{
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }

  70% {
    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
.mg-play-btn:hover{
  background: rgba(255, 255, 255, 0.3);
  transform: scale(1.1);
  border-color: #fff;
}
.mg-play-btn svg{
  width: 32px;
  height: 32px;
  fill: #fff;
  margin-left: 5px;
}
.video-trigger-btn{
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 10;
  width: auto;
  min-width: 50px;
  height: 50px;
  padding: 0 20px;
  background: rgba(0, 0, 0, 0.7);
  border: 2px solid rgba(255, 255, 255, 0.9);
  border-radius: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  backdrop-filter: blur(10px);
  text-decoration: none;
}
.video-trigger-btn span{
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.video-trigger-btn:hover{
  background: rgba(0, 0, 0, 0.9);
  transform: scale(1.05);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}
.video-trigger-btn svg{
  width: 24px;
  height: 24px;
  fill: #fff;
}
.mg-fc{
  position: relative;
  width: 100%;
  height: 650px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.mg-fc__bg{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
}
.mg-fc__overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.18) 55%, transparent 100%);
}
.mg-fc__text{
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 0 8vw 60px;
  text-align: center;
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.mg-fc__text.is-visible{
  opacity: 1;
  transform: translateY(0);
}
.mg-fc__heading{
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--mg-text-light);
  margin-bottom: 20px;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}
.mg-fc__heading-big{
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--mg-text-light);
  margin-bottom: 20px;
  max-width: 80%;
  margin-left: auto;
  margin-right: auto;
}
.mg-fc__body{
  font-size: 1.1875rem;
  font-weight: 400;
  line-height: 1.8;
  color: var(--mg-text-muted);
  max-width: 640px;
  margin: 0 auto;
}
.mg-fc__heading--mobile{
  display: none;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--mg-text-light);
  margin-bottom: 0;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}
.mg-fc__body--mobile{
  display: none;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.7;
  color: var(--mg-text-muted);
  max-width: 640px;
  margin: 8px auto 0;
}
.mg-fc--left{
  align-items: center;
}
.mg-fc--left .mg-fc__text{
  text-align: center;
  max-width: 50%;
  padding: 0 0 0 6%;
  margin-right: auto;
}
.mg-fc--right{
  align-items: center;
}
.mg-fc--right .mg-fc__text{
  text-align: center;
  max-width: 50%;
  padding: 0 6% 0 0;
  margin-left: auto;
}
/* [FG 18 Ağu 2026] SİYAH METİN SCRIM'İ — YÖNE DUYARLI.
   Eski hâl beyaz .15 → .05 düz gradyandı: görseli korurdu ama siyah metne zemin VERMEZDİ
   (yoğun/koyu görselde okunmuyordu). Builder önizlemesi ise .85 → .10 ile görselin TAMAMINI
   yakıyordu (kullanıcı: "o kadar beyazlatıyor ki hoş olmuyor") — iki uç da yanlıştı.
   Yeni kural: beyazlık YALNIZ metnin bulunduğu tarafta; %70-72'de tam şeffaflaşır, böylece
   ürünün olduğu taraf hiç dokunulmadan, tam doygunlukta kalır.
   .mg-fc--left/--right kuralları GLOBAL (media query içinde değil) → mobilde de metin %50
   kolonda kaldığı için yatay scrim her kırılımda doğru tarafa düşer.
   ⚠️ PARITY: aynı değerler teccom.tech `admin/builder.php` (~satır 812) önizleme CSS'inde de
   var. Export yalnız class basar, görünümü BU dosya belirler → ikisi BİRLİKTE güncellenir,
   yoksa builder yine yalan gösterir. */
.mg-fc--dark-text .mg-fc__overlay{
  background: linear-gradient(to top, rgba(255, 255, 255, 0.88) 0%, rgba(255, 255, 255, 0.52) 30%, rgba(255, 255, 255, 0) 70%);
}
.mg-fc--dark-text.mg-fc--left .mg-fc__overlay{
  background: linear-gradient(to right, rgba(255, 255, 255, 0.93) 0%, rgba(255, 255, 255, 0.80) 26%, rgba(255, 255, 255, 0.34) 50%, rgba(255, 255, 255, 0) 72%);
}
.mg-fc--dark-text.mg-fc--right .mg-fc__overlay{
  background: linear-gradient(to left, rgba(255, 255, 255, 0.93) 0%, rgba(255, 255, 255, 0.80) 26%, rgba(255, 255, 255, 0.34) 50%, rgba(255, 255, 255, 0) 72%);
}
/* Scrim zemini verdiği için beyaz text-shadow'a gerek kalmadı (hâle/glow etkisi yapıyordu). */
.mg-fc--dark-text .mg-fc__heading{
  color: #1b1b19;
}
.mg-fc--dark-text .mg-fc__body,
.mg-fc--dark-text .mg-fc__body--mobile{
  color: rgba(27, 27, 25, 0.82);
}
.mg-split{
  display: flex;
  min-height: 650px;
  gap: 0;
}
.mg-split__half{
  flex: 1;
  position: relative;
  display: flex;
  align-items: flex-end;
  padding: 50px 5%;
  margin: 0;
  overflow: hidden;
}
.mg-split__half:first-child{
  border-right: 1px solid rgba(255, 255, 255, 0.6);
}
.mg-split__overlay{
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.38);
}
.mg-split__content{
  position: relative;
  z-index: 2;
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.mg-split__content.is-visible{
  opacity: 1;
  transform: translateY(0);
}
.mg-split__content h3{
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mg-text-light);
  margin-bottom: 12px;
}
.mg-split__content p{
  font-size: 1.1875rem;
  line-height: 1.7;
  color: var(--mg-text-muted);
  margin: 0;
}
.mg-split__content p.mobile-only{
  display: none;
}
.mg-grid-3{
  position: relative;
  width: 100%;
  min-height: 950px;
  padding: 350px 4% 80px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
}
.mg-grid-3__bg{
  position: absolute;
  inset: 0;
  z-index: 1;
  background-size: cover;
  background-position: center;
}
.mg-grid-3__overlay{
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.2) 100%);
  pointer-events: none;
}
.mg-grid-3__content{
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}
.mg-grid-3__top{
  display: flex;
  justify-content: flex-end;
  margin-bottom: 60px;
}
.mg-grid-3__top-text{
  max-width: 600px;
  text-align: right;
  color: #fff;
}
.mg-grid-3__heading{
  font-size: 48px;
  font-weight: 700;
  margin-bottom: 20px;
  line-height: 1.2;
}
.mg-grid-3__body{
  font-size: 19px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.85);
}
.mg-grid-3__cards-wrap{
  position: relative;
}
.mg-grid-3__cards{
  display: flex;
  gap: 30px;
  overflow: hidden;
  scroll-behavior: smooth;
}
.mg-grid-3__card{
  flex: 0 0 calc(33.333% - 20px);
  display: flex;
  flex-direction: column;
}
.mg-grid-3__arrow{
  position: absolute;
  top: 35%;
  transform: translateY(-50%);
  z-index: 5;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  border: 2px solid rgba(255, 255, 255, 0.4);
  color: #fff;
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  backdrop-filter: blur(4px);
  transition: background .2s, opacity .2s;
  line-height: 1;
}
.mg-grid-3__arrow:hover{
  background: rgba(0, 0, 0, 0.75);
}
.mg-grid-3__arrow--left{
  left: -22px;
}
.mg-grid-3__arrow--right{
  right: -22px;
}
.mg-grid-3__arrow[disabled]{
  opacity: 0.3;
  cursor: default;
  pointer-events: none;
}
.mg-grid-3__card-img{
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  background-size: cover;
  background-position: center;
  margin-bottom: 24px;
}
.mg-grid-3__card-heading{
  font-size: 23px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 12px;
  line-height: 1.3;
}
.mg-grid-3__card-body{
  font-size: 16px;
  line-height: 1.6;
  color: var(--mg-text-muted);
}
.mg-grid-3--dark-text .mg-grid-3__top-text,
.mg-grid-3--dark-text .mg-grid-3__card-heading,
.mg-grid-3--dark-text .mg-grid-3__heading{
  color: #1b1b19 !important;
}
.mg-grid-3--dark-text .mg-grid-3__body,
.mg-grid-3--dark-text .mg-grid-3__card-body{
  color: rgba(27, 27, 25, 0.82) !important;
}
/* [FG 18 Ağu 2026] mg-fc ile AYNI scrim mantığı, ama burada yön YOK: .mg-grid-3 içeriği
   `justify-content:flex-end` + `padding-top:350px` ile daima ALTTA toplanır (üst metin + kartlar).
   Bu yüzden dikey, alttan yukarı scrim doğrusu; %82'de tam şeffaf → görselin üst kısmı temiz kalır.
   Temel (beyaz metin) overlay'i simetriği: siyah .95 → .20. ⚠️ builder.php ~satır 975 ile eşleştir. */
.mg-grid-3--dark-text .mg-grid-3__overlay{
  background: linear-gradient(to top, rgba(255, 255, 255, 0.93) 0%, rgba(255, 255, 255, 0.80) 30%, rgba(255, 255, 255, 0.40) 55%, rgba(255, 255, 255, 0) 82%) !important;
}
@media (max-width: 992px){.mg-grid-3{
    min-height: 850px;
    padding-top: 350px;
  }
.mg-grid-3__top{
    justify-content: center;
    margin-bottom: 40px;
  }
.mg-grid-3__top-text{
    text-align: center;
    max-width: 100%;
  }
.mg-grid-3__heading{
    font-size: 36px;
  }
.mg-grid-3__body{
    font-size: 16px;
  }
.mg-grid-3__cards{
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 24px;
    padding-inline: 24px;
    padding-bottom: 20px;
    scrollbar-width: none;
    justify-content: flex-start;
  }
.mg-grid-3__cards::-webkit-scrollbar{
    display: none;
  }
.mg-grid-3__arrow{
    display: flex;
    width: 36px;
    height: 36px;
    font-size: 18px;
    top: 30%;
  }
.mg-grid-3__arrow--left{
    left: 5px;
  }
.mg-grid-3__arrow--right{
    right: 5px;
  }
.mg-grid-3__card{
    flex: 0 0 82%;
    max-width: 300px;
    scroll-snap-align: center;
  }
.mg-grid-3__cards.is-static{
    overflow-x: visible;
    scroll-snap-type: none;
    padding-inline: 0;
    justify-content: center;
  }
.mg-grid-3__cards.is-static .mg-grid-3__card{
    flex: 0 1 min(82%, 300px);
    width: min(82%, 300px);
  }
.mg-grid-3__cards.is-static .mg-grid-3__card:only-child{
    width: min(90%, 340px);
    max-width: 340px;
  }
.mg-grid-3__card-heading{
    font-size: 18px;
  }
.mg-grid-3__card-body{
    font-size: 14px;
  }}
.mg-grid-3__cards.is-static-desktop{
  justify-content: center;
}
.mg-image-text{
  display: flex;
  min-height: 500px;
  background-color: #fff;
}
.mg-image-text__image{
  flex: 0 0 50%;
  max-width: 50%;
  aspect-ratio: 1 / 1;
  background-size: cover;
  background-position: center;
}
.mg-image-text__content{
  flex: 0 0 50%;
  max-width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px 4%;
}
.mg-image-text__inner{
  max-width: 500px;
  width: 100%;
}
.mg-image-text__subheading{
  font-size: 19px;
  font-weight: 700;
  color: #115F73;
  margin-bottom: 16px;
  text-align: center;
}
.mg-image-text__heading{
  font-size: 48px;
  font-weight: 700;
  color: #242422;
  margin-bottom: 24px;
  line-height: 1.2;
  text-align: center;
}
.mg-image-text__body{
  font-size: 19px;
  line-height: 1.6;
  color: #242422;
  text-align: center;
  margin: 0;
}
.mg-image-text--img-right{
  flex-direction: row-reverse;
}
.mg-image-text--dark{
  background-color: #071a1e;
}
.mg-image-text--dark .mg-image-text__subheading{
  color: #4ecdc4;
}
.mg-image-text--dark .mg-image-text__heading,
.mg-image-text--dark .mg-image-text__body{
  color: #ffffff;
}
@media (max-width: 992px){.mg-image-text{
    flex-direction: column;
  }
.mg-image-text--img-right{
    flex-direction: column;
  }
.mg-image-text__image{
    flex: none;
    max-width: 100%;
    min-height: 350px;
    width: 100%;
  }
.mg-image-text__content{
    flex: none;
    max-width: 100%;
    width: 100%;
    padding: 40px 5%;
  }
.mg-image-text__heading{
    font-size: 32px;
  }
.mg-image-text__subheading{
    font-size: 16px;
  }
.mg-image-text__body{
    font-size: 16px;
  }}
.mg-text-block{
  padding: 80px 4%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.mg-text-block__heading{
  font-size: 48px;
  font-weight: 700;
  margin-bottom: 24px;
  max-width: 900px;
  line-height: 1.2;
}
.mg-text-block__body{
  font-size: 19px;
  line-height: 1.6;
  max-width: 800px;
  margin: 0;
}
.mg-text-block--light{
  background-color: #ffffff;
}
.mg-text-block--light .mg-text-block__heading,
.mg-text-block--light .mg-text-block__body{
  color: #071a1e;
  /* Lacivert */
}
.mg-text-block--dark{
  background-color: #071a1e;
  /* Lacivert */
}
.mg-text-block--dark .mg-text-block__heading,
.mg-text-block--dark .mg-text-block__body{
  color: #ffffff;
}
@media (max-width: 992px){.mg-text-block{
    padding: 50px 5%;
    text-align: left;
    align-items: flex-start;
  }
.mg-text-block__heading{
    font-size: 32px;
    margin-bottom: 16px;
  }
.mg-text-block__body{
    font-size: 16px;
  }}
.mg-slider-indicators{
  grid-column: 1 !important;
  grid-row: 2 !important;
  position: relative !important;
  display: flex !important;
  justify-content: center !important;
  padding: 8px 0 0 !important;
  margin: 0 !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  z-index: 2 !important;
}
.mg-slider-indicators button{
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  background-color: #ccc !important;
  border: none !important;
  margin: 0 6px !important;
  opacity: 1 !important;
}
.mg-slider-indicators button.active{
  background-color: #559da3 !important;
}
.mg-slider--dark{
  background-color: #0c2b2a !important;
}
.mg-slider--dark .mg-slider-indicators button{
  background-color: rgba(255, 255, 255, 0.5) !important;
}
.mg-slider--dark .mg-slider-indicators button.active{
  background-color: #559da3 !important;
}
.mg-gallery-grid{
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 20px;
}
.mg-gallery-card{
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  min-height: 350px;
  grid-column: span 2;
}
.mg-gallery-card--span-3{
  grid-column: span 3;
}
.mg-gallery-card--span-6{
  grid-column: span 6;
}
.mg-gallery-img{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.4s ease;
}
.mg-gallery-card:hover .mg-gallery-img{
  transform: scale(1.05);
}
.mg-gallery-text{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 24px;
  text-align: center;
  color: #fff;
  font-size: 23px;
  font-weight: 600;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
  pointer-events: none;
}
@media (max-width: 992px){.mg-gallery-grid{
    grid-template-columns: 1fr;
    padding: 0 20px 30px 20px !important;
  }
.mg-gallery-card,
  .mg-gallery-card--span-3,
  .mg-gallery-card--span-6{
    grid-column: span 1;
  }}
.mg-video-gallery{
  position: relative;
  padding: 40px 4%;
}
.mg-video-gallery__track{
  display: flex;
  gap: 20px;
  overflow: hidden;
  scroll-behavior: smooth;
}
.mg-video-gallery__item{
  position: relative;
  flex: 0 0 calc(33.333% - 14px);
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
}
.mg-video-gallery__bg{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.4s ease;
}
.mg-video-gallery__item:hover .mg-video-gallery__bg{
  transform: scale(1.05);
}
.mg-video-gallery__overlay{
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.25);
  pointer-events: none;
}
.mg-video-gallery__title{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 24px;
  text-align: center;
  color: #fff;
  font-size: 23px;
  font-weight: 600;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
  pointer-events: none;
  z-index: 3;
}
.mg-video-gallery__arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  border: 2px solid rgba(255, 255, 255, 0.4);
  color: #fff;
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .2s, opacity .2s;
  backdrop-filter: blur(4px);
  line-height: 1;
}
.mg-video-gallery__arrow:hover{
  background: rgba(0, 0, 0, 0.75);
}
.mg-video-gallery__arrow--left{
  left: calc(4% + 8px);
}
.mg-video-gallery__arrow--right{
  right: calc(4% + 8px);
}
.mg-video-gallery__arrow[disabled]{
  opacity: 0.3;
  cursor: default;
  pointer-events: none;
}
@media (max-width: 992px){.mg-video-gallery{
    padding: 20px 4%;
  }
.mg-video-gallery__track{
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
.mg-video-gallery__track::-webkit-scrollbar{
    display: none;
  }
.mg-video-gallery__item{
    flex: 0 0 82%;
    scroll-snap-align: center;
  }
.mg-video-gallery__arrow{
    display: flex;
    width: 36px;
    height: 36px;
    font-size: 18px;
  }
.mg-video-gallery__arrow--left{
    left: 10px;
  }
.mg-video-gallery__arrow--right{
    right: 10px;
  }
.mg-video-gallery__title{
    font-size: 16px;
    padding: 16px;
  }}
@media (max-width: 768px){.mg-video-banner{
    height: 420px;
  }
.mg-fc{
    height: auto;
    min-height: 300px;
    aspect-ratio: 1 / 1;
  }
.mg-fc__text{
    opacity: 1 !important;
    transform: none !important;
    padding: 0 5vw 7vw;
    text-align: left;
  }
.mg-fc__heading,
  .mg-fc__heading-big{
    font-size: 1.25rem;
    line-height: 1.25;
    text-align: left;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
  }
.mg-fc__body,
  .mg-fc__body--mobile{
    font-size: 0.875rem;
    line-height: 1.7;
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
.mg-split{
    flex-direction: column;
    min-height: unset;
  }
.mg-split__half{
    aspect-ratio: 1 / 1;
    border-right: none !important;
  }
.mg-split__half:first-child{
    border-right: none !important;
    border-bottom: none !important;
  }
.mg-split__content{
    opacity: 1 !important;
    transform: none !important;
    text-align: left;
    width: 100%;
  }
.mg-split__content h3{
    font-size: 1.25rem;
    margin-bottom: 0;
    text-align: left;
  }
.mg-split__content p.desktop-only{
    display: none !important;
  }
.mg-split__content p.mobile-only{
    display: block !important;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--mg-text-muted);
    margin: 6px 0 0;
    text-align: left;
  }
#mgVideoModal .modal-dialog{
    margin: 0;
    max-width: 100%;
  }
#mgVideoModal .modal-content{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 0;
    background: #000;
  }
#mgVideoModal .modal-header{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    width: 100%;
  }
#mgVideoModal .modal-body{
    width: 100%;
    flex: none;
  }
.mg-slider h2{
    font-size: 32px !important;
  }
.mg-slider .carousel-item img{
    height: 300px !important;
    max-height: 300px !important;
    object-fit: cover !important;
  }}
/* ═══ kaynak: htstyle.css.off (508KB → 10KB) ═══ */
:root{
    --global--color-primary: #333;

    --global--color-primary-alt: #000000;

    --global--color-primary-darken: #1471b8;

    --global--color-primary-light: #e6f8fb;

    --global--color-secondary: #11111f;

    --global--color-heading: #11111f;

    --global--color-heading-darken: #435ba1;

    --global--color-heading-light: #1d2a4d;

    --global--color-body: #8e949e;

    --global--color-white: #fff;

    --global--color-black: #000;

    --global--color-border: #e6eaef;

    --global--color-gray: #f9f9f9;

    --global--color-gray-darken: #9aaabb;

    --global--color-gray-light: #e6e8eb;

    --global--color-blue: #27477d;

    --global--color-red: #e30909;


}
*,
:active,
:focus{
    outline: none !important
}
ul:not('.sub-menu'),
ol{
    list-style: none;
    margin: 0;
    padding: 0
}
textarea{
    resize: none
}
::-moz-selection{
    text-shadow: none
}
::selection{
    text-shadow: none
}
::-moz-selection{
    text-shadow: none
}
::-webkit-selection{
    text-shadow: none
}
.form-control{
    -webkit-box-shadow: none;
    box-shadow: none
}
button{
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    outline: none;
}
textarea{
    resize: none
}
/* [FG 10 Eyl 2026] 🔴 SELECTOR'DAN `body` ÇIKARILDI — sticky header'ı öldüren ASIL kural buydu.
   `html{overflow-x:hidden}` viewport'a propagate olur ve yatay kırpmayı TEK BAŞINA yapar; `body`'nin
   de hidden olması body'yi kendi kaydırma kabına çevirip içindeki `position:sticky`yi devre dışı
   bırakıyordu (CDP ile doğrulandı: bu kural yukarıdaki body{clip/visible} kuralını EZİYORDU).
   ⚠️ Buraya `body` geri EKLEME — header sticky'si ve ürün sayfasındaki yapışkan galeri buna bağlı. */
html{
    overflow-x: hidden
}
::-moz-selection{
    background-color: var(--global--color-primary);
    color: var(--global--color-white);
    text-shadow: none
}
::selection{
    background-color: var(--global--color-primary);
    color: var(--global--color-white);
    text-shadow: none
}
a{
    color: #000000;
    -webkit-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    text-decoration: none
}
a:hover{
    text-decoration: none
}
header a,
footer a{
    color: inherit
}
textarea{
    resize: none
}
section{
    background-color: var(--global--color-white);
    /* padding: 60px 0; */
    overflow: hidden;
}
header section,
footer section{
    background-color: inherit;
}
@media only screen and (max-width: 767px){section{
        /* padding: 70px 0 */
    }}
.fgblockquote,
blockquote{
    font-size: 20px;
    font-family: var(--global--font-heading);
    color: var(--global--color-body);
    font-style: normal;
    line-height: 28px;
    font-weight: 500;
    padding: 30px 0 30px 30px;
    position: relative;
    border-left: 6px solid var(--global--color-heading)
}
@-webkit-keyframes animatedBackground{

    from {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }

}
@keyframes animatedBackground{

    from {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }

}
form{
    position: relative
}
form .col-12{
    position: relative
}
.form-control{
    color: var(--global--color-body);
    font-size: 14px;
    font-weight: 400;
    height: 40px;
    line-height: 1;
    border-radius: 4px;
    border: none;
    background-color: transparent;
    border: 2px solid #e6eaef;
    padding-left: 25px;
    margin-bottom: 25px;
    position: relative;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
.form-control:focus{
    border-color: var(--global--color-heading);
    -webkit-box-shadow: none;
    box-shadow: none
}
.form-control::-webkit-input-placeholder{
    font-size: 14px;
    font-family: var(--global--font-body);
    color: var(--global--color-body);
    text-transform: capitalize
}
.form-control:-moz-placeholder{
    font-size: 14px;
    font-family: var(--global--font-body);
    color: var(--global--color-body);
    text-transform: capitalize
}
.form-control::-moz-placeholder{
    font-size: 14px;
    font-family: var(--global--font-body);
    color: var(--global--color-body);
    text-transform: capitalize
}
.form-control:-ms-input-placeholder{
    font-size: 14px;
    font-family: var(--global--font-body);
    color: var(--global--color-body);
    text-transform: capitalize
}
.form-label{
    font-family: var(--global--font-body);
    font-weight: 700;
    font-size: 14px;
    color: #1e4873;
    margin-bottom: 9px
}
textarea.form-control{
    height: 155px;
    padding-top: 18px
}
.form-select{
    position: relative
}
.form-select i{
    position: absolute;
    font-size: 19px;
    font-weight: 400;
    line-height: 49px;
    right: 20px;
    top: 0;
    z-index: 1;
    pointer-events: none;
    cursor: pointer;
    color: var(--global--color-body)
}
.form-select select{
    line-height: 1;
    color: var(--global--color-body);
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}
.tabs .tab-content>.tab-pane{
    font-family: var(--global--font-body);
    font-size: 16px;
    font-weight: 400;
    line-height: 26px
}
.accordion .card,
.accordion .card:first-of-type,
.accordion .card:not(:first-of-type):not(:last-of-type){
    padding: 25px 25px 18px 30px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 2px solid #cdd6e0;
    margin-bottom: 0;
    border-radius: 0;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    text-align: left;
    border-radius: 4px;
    margin-bottom: 30px
}
.accordion .card .card-body,
.accordion .card:first-of-type .card-body,
.accordion .card:not(:first-of-type):not(:last-of-type) .card-body{
    font-family: var(--global--font-body);
    color: var(--global--color-body);
    padding: 7px 0 5px;
    font-size: 15px;
    font-weight: 400;
    line-height: 24px
}
@-webkit-keyframes alertfadein{
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}
@keyframes alertfadein{
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}
#back-to-top{
    z-index: 999;
    width: 38px;
    height: 38px;
    border-radius: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    -webkit-transition: 300ms ease-in-out;
    -o-transition: 300ms ease-in-out;
    transition: 300ms ease-in-out;
    background-color: #032b56
}
#back-to-top:hover{
    background-color: var(--global--color-primary)
}
@-webkit-keyframes sk-rotate{
    100% {
        -webkit-transform: rotate(360deg)
    }
}
@keyframes sk-rotate{
    100% {
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg)
    }
}
@-webkit-keyframes sk-bounce{

    0%,
    100% {
        -webkit-transform: scale(0)
    }

    50% {
        -webkit-transform: scale(1)
    }
}
@keyframes sk-bounce{

    0%,
    100% {
        transform: scale(0);
        -webkit-transform: scale(0)
    }

    50% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }
}
@-webkit-keyframes fadeInDown{
    0% {
        opacity: 0;
        -webkit-transform: translateY(-200px);
        transform: translateY(-200px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
@keyframes fadeInDown{
    0% {
        opacity: 0;
        -webkit-transform: translateY(-200px);
        transform: translateY(-200px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
@-webkit-keyframes pulse{
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    100% {
        -webkit-transform: scale(1.4);
        transform: scale(1.4);
        opacity: 0
    }
}
@keyframes pulse{
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    100% {
        -webkit-transform: scale(1.4);
        transform: scale(1.4);
        opacity: 0
    }
}
figure{
    margin: 0
}
.fgimg,
img{
    max-width: 100%;
    -webkit-transition: all .3s ease-out 0;
    -moz-transition: all .3s ease-out 0;
    -ms-transition: all .3s ease-out 0;
    -o-transition: all .3s ease-out 0;
    transition: all .3s ease-out 0
}
.card{
    position: relative;
    width: 100%;
    border-radius: 5px;
    padding: 30px;
    margin-bottom: 2rem;
    border: 10px solid transparent;
    display: inline-block;
    box-shadow: 0px 0px 20px 0px rgb(62 62 101 / 13%);
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s
}
.card:hover,
.card-active{
    border-bottom: 10px solid var(--global--color-primary)
}
#accordion .card{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: none;
    background: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    margin: 0
}
#accordion .card .card-body{
    background-color: #f4f4f4;
    color: #000;
    border-radius: 0;
    margin-bottom: 5px
}
#accordion .card .card-header{
    background-color: #f4f4f4;
    color: var(--global--color-secondary);
    border-bottom: 1px solid #f4f4f4;
    margin-bottom: 5px
}
#accordion .card .card-header a{
    color: #000000;
    font-weight: 400;
    width: 100%
}
#accordion .card .card-header h5{
    font-weight: 400;
    font-size: 15px
}
@media only screen and (max-width: 767px){section{
        padding: 20px 0 !important
    }}
.flag-usa{
    background-size: cover;
    background-position: center center;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAABhUlEQVQ4T2Ows82PjGixsc4LD2tysC/09Kjw8622tyuICG8u0w/cpGSCBzF4e1VmZkzw9anOzOj38a4KCW4IC22ECHYk1l9tn4gHMeTlTnZxLikvm+XiUpKW2hvgX+vnV5OVOQEoOGfOtv94AYOzU3Fd7XxHh6Lq6rlurqUx0W0J8Z1AnbW18yotonaYuOJBDBXls4A+bGpaBCTz86YEBtQCvVBSPAPIbY0oP1/aiAcxABU1Ny+2tclvbFjo5FgUF9uenNwNDLnmpkWEnV1TPRcY1O1tS4H6i4umA/0MDK2K8tlAwRqHpP1uoXgQKKraWpcClTY3LQZaCLQ5NaUX5OaWJY3++SeTC/AgBmA4AXUClUJs9ver8fKsAAYEUJCws4G21dXNB1oFdD/Qz8DQTk4C+bm2dn6DZ9bRiDQ8iAEYt8CoBpK5YBIYw0AEEZwSXX4oMB4PYoC6gCzAcDqrjGzEsMfen2xEmbMv1rSTjRi26dqRjShz9o2+6WQjBrSShQSkZAIADvW/HLrLY6cAAAAASUVORK5CYII=')
}
/* ═══ kaynak: vvsstyle.css.off (140KB → 12KB) ═══ */
@import url('https://fonts.googleapis.com/css2?family=Darker+Grotesque:wght@300..900&family=Roboto+Flex:opsz,wght@8..144,100..1000&display=swap');
img{
    max-width: 100%
}
a{
    text-decoration: none
}
.input-number-group .input-number,.input-number-group .input-number-decrement,.input-number-group .input-number-increment{
    color: #000
}
.input-number-group .input-number-decrement:hover,.input-number-group .input-number-increment:hover{
    background-color: #f66b5d;
    color: #fff;
    border-color: #f66b5d
}
.input-number-group .input-number-decrement{
    margin-right: .5rem;
    margin-left: 0
}
.input-number-group .input-number-increment{
    margin-left: .5rem
}
.input-number-group .input-number,.input-number-group .input-number-decrement,.input-number-group .input-number-increment{
    line-height: 33px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight: 700;
    font-size: 18px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    color: #333
}
.input-number-group .input-number-decrement,.input-number-group .input-number-increment{
    display: inline-block;
    width: 35px;
    text-align: center;
    cursor: pointer;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 32px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    color: #54565b;
    font-size: 35px;
    margin-top: -7px
}
.input-number-group .input-number{
    padding: 0 12px;
    outline: 0;
    display: block;
    text-align: center
}
.btn{
    font-size: 16px
}
.btn-sm{
    font-size: 10.2px
}
.btn-lg{
    padding: 6px 20px;
    font-size: 15px
}
.btn-group > .btn,.btn-group > .dropdown-menu,.btn-group > .popover{
    font-size: 12px
}
.btn-group > .btn-sm{
    font-size: 10.2px
}
.btn-group > .btn-lg{
    font-size: 15px
}
.btn-block{
    width: auto
}
.btn-default{
    background: var(--fgrootcolor);
    border-color: transparent;
    color: #fff;
    text-transform: capitalize;
    padding: 8px 15px;
    font: 500 14px/22px Muli,Helvetica,sans-serif;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -khtml-border-radius: 25px;
    letter-spacing: 1px
}
.btn-primary{
    background: #000;
    border-color: transparent;
    color: #fff;
    padding: 8px 15px;
    font: 500 14px/22px Muli,Helvetica,sans-serif;
    text-transform: capitalize;
    display: inline-block;
    letter-spacing: 1px;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -khtml-border-radius: 25px
}
.product-details .fa.fa-shopping-cart{
    padding-right: 5px;
    font-size: 17px
}
.btn-primary:hover,.btn-primary:active,.btn-primary.active,.btn-primary.disabled,.btn-primary[disabled]{
    background-position: 0 -15px
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active,.open .dropdown-toggle.btn-primary,#button-login.btn.btn-primary:focus,.btn-primary:active,#button-account.btn.btn-primary:focus,#button-register.btn.btn-primary:focus,#button-shipping-method.btn.btn-primary:focus,#button-payment-address.btn.btn-primary:focus,#button-shipping-address.btn.btn-primary:focus,#button-payment-method.btn.btn-primary:focus,#button-guest.btn.btn-primary:focus,#button-review.btn.btn-primary:focus,#button-coupon.btn.btn-primary:focus,#button-voucher.btn.btn-primary:focus,#button-quote.btn.btn-primary:focus,#button-confirm.btn.btn-primary:focus{
    background: var(--fgrootcolor);
    color: #000;
    border-color: transparent
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary:active:focus,.btn-primary.active,.open .dropdown-toggle.btn-primary,#button-login.btn.btn-primary:focus,.btn-primary:active,#button-account.btn.btn-primary:focus,#button-register.btn.btn-primary:focus,#button-shipping-method.btn.btn-primary:focus,#button-payment-address.btn.btn-primary:focus,#button-shipping-address.btn.btn-primary:focus,#button-payment-method.btn.btn-primary:focus,#button-guest.btn.btn-primary:focus,#button-review.btn.btn-primary:focus,#button-coupon.btn.btn-primary:focus,#button-voucher.btn.btn-primary:focus,#button-quote.btn.btn-primary:focus,#button-confirm.btn.btn-primary:focus,.btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary.focus:active,.btn-primary:active:focus,.btn-primary:active:hover{
    background: var(--fgrootcolor);
    color: #000;
    border-color: transparent
}
.btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary.focus:active,.btn-primary:active:focus,.btn-primary:active:hover,.open > .dropdown-toggle.btn-primary.focus,.open > .dropdown-toggle.btn-primary:focus,.open > .dropdown-toggle.btn-primary:hover{
    background: var(--fgrootcolor);
    color: #000;
    border-color: transparent
}
.btn-primary.disabled,.btn-primary.disabled.active,.btn-primary.disabled.focus,.btn-primary.disabled:active,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled],.btn-primary.active[disabled],.btn-primary.focus[disabled],.btn-primary[disabled]:active,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary,fieldset[disabled] .btn-primary.active,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:active,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover{
    background: var(--fgrootcolor);
    color: #000;
    border-color: transparent
}
.btn-danger{
    color: #fff;
    background-color: #da4f49;
    text-transform: uppercase;
    padding: 10px 12px;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -khtml-border-radius: 25px
}
.btn-info{
    color: #fff;
    background-color: #000;
    border-color: #000;
    padding: 9px 12px;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -khtml-border-radius: 25px
}
.btn-info:hover{
    background: var(--fgrootcolor);
    border-color: var(--fgrootcolor);
    color: #000
}
.btn-info.active,.btn-info:active,.open > .dropdown-toggle.btn-info{
    color: #000;
    background-color: var(--fgrootcolor);
    border-color: var(--fgrootcolor)
}
.btn-info:active:focus,.btn-info:active:hover{
    color: #000;
    background-color: var(--fgrootcolor);
    border-color: var(--fgrootcolor)
}
.btn-info.focus,.btn-info:focus{
    color: #000;
    background-color: var(--fgrootcolor);
    border-color: var(--fgrootcolor)
}
#checkout-cart .input-group .form-control,#checkout-cart .input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group{
    z-index: 1;
    position: static
}
.input-group .form-control{
    height: auto;
    padding: 7px 12px
}
.input-number-group .input-number,.input-number-group .input-number-decrement,.input-number-group .input-number-increment{
    /* border:1px solid #ddd; */
    height: 35px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight: 700;
    font-size: 22px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    color: #333;
}
.input-number-group .input-number-decrement,.input-number-group .input-number-increment{
    display: inline-block;
    width: 35px;
    text-align: center;
    cursor: pointer;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 22px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s
}
.input-number-group .input-number-decrement{
    margin-right: .5rem;
    margin-left: 0
}
.input-number-group .input-number-increment{
    margin-left: .5rem
}
.input-number-group .input-number,.input-number-group .input-number-decrement,.input-number-group .input-number-increment{
    line-height: 33px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight: 700;
    font-size: 18px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    color: #333
}
.input-number-group .input-number-decrement,.input-number-group .input-number-increment{
    display: inline-block;
    width: 35px;
    text-align: center;
    cursor: pointer;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 32px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    color: #54565b;
    font-size: 25px;
    margin-top: -7px
}
.input-number-group .input-number{
    padding: 0 12px;
    outline: 0;
    display: block;
    text-align: center
}
.fg-dec{
    flex: 0 0 3rem;
    max-width: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #54565b
}
.fg-inc{
    flex: 0 0 3rem;
    max-width: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #54565b
}
.fg-quantity{
    flex: 1 0 0;
    max-width: 100%;
    width: 100%;
    height: 100%!important;
    text-align: center;
    outline: 0!important;
    border: unset!important;
    background-color: transparent;
    border: none;
    font-size: 20px!important;
    font-weight: 700!important;
    color: var(--fgrootcolor)!important;
    box-shadow: unset!important;
    padding:0px
}
.fg-qu-cover{
    display: inline-flex!important;
    flex-wrap: wrap;
    border-radius: 10rem;
    border: 2px solid #ececec;
    width: 130px;
    height: 50px;
}
@media(max-width: 768px){.qu-btn{
        flex-direction:column
    }}
.d-flex{
    display: flex!important
}
.pagination{
    margin: 0
}
.breadcrumb>li+li:before{
    content: "|";
    padding: 0 10px 0 5px;
    font-family: 'FontAwesome';
    color: #262626;
}
@keyframes jssorl-009-spin{
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
@keyframes show{
    0%,49.99% {
        opacity: 0;
        z-index: 1
    }

    50%,100% {
        opacity: 1;
        z-index: 5
    }
}
.pagination>li>a,.pagination>li>span{
    position: relative;
    display: inline-block;
    line-height: 38px;
    height: 40px;
    font-size: 16px;
    min-width: 40px;
    color: var(--fgrootcolor);
    font-weight: 400;
    text-align: center;
    background: #f5f8ff;
    border: 2px solid var(--fgrootcolor);
    text-transform: capitalize;
    transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    line-height: unset
}
.pagination>li.active>a,.pagination>li.active>span{
    color: #ffffff;
    border-color: var(--fgrootcolor);
    background-color: var(--fgrootcolor);
}
.pagination>li>a:hover,.pagination>li.active>a:hover,.pagination>li>span:hover,.pagination>li.active>span:hover{
    color: #ffffff;
    border-color: var(--fgrootcolor);
    background-color: var(--fgrootcolor);
}
.pagination>li>a, .pagination>li>span{
    display: flex;
    justify-content: center;
    align-items: center;
}
.text-right{text-align: end;}
.alert{font-size:15px;padding:12px 18px }
.alert button.close{
    margin: 0;
    padding: 0;
    line-height: 25px;
    height: 25px;
    width: 25px;
    text-align: center;
    display: block;
    float:right;
    font-size:1rem;color: #fff;
    background-color: #5bb75b;
    box-shadow: unset!important;
    border:unset!important
}
.alert button.close:hover{background-color: #284f28;}
.breadcrumb{
        padding: 30px 0;
        margin: 0;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
.breadcrumb li{
        font-size: 20px;
        font-weight: 600;
        color: #333;
        display: flex;
        align-items: center;
        margin-bottom: 0;
    }
.breadcrumb li + li::before{
        content: '>';
        font-size:14px;
        margin: 0 0.5rem;
        color: #333;
    }
.breadcrumb li a{
        font-size: 14px;
        font-weight: 400;
        color: #ffffff;
        text-decoration: none;
        transition: color 0.2s ease-in-out;
    }
.breadcrumb a:hover{
        color: #333;
        text-decoration: underline;
    }
.breadcrumb li:last-child a{
        color: #ffffff;
        text-decoration: none;
        pointer-events: none;
        cursor: default;
    }
@media (max-width: 576px){.breadcrumb li{
            font-size: 0.75rem;
        }
.breadcrumb li + li::before{
            margin: 0 0.25rem;
        }}
.form-select{font-size:14px!important}
.carousel-indicators{bottom:0}
.carousel-indicators img[data-bs-target]{width: 80px;height:80px;object-fit: cover;}
.btn-block{
    display: flex;
    width: 100%;
}
.alert{
    width: auto;
    border-radius: 0;
    font-weight: 600;
    border: 1px solid #bfddcf;
    padding: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2px;
}

/* ═══════════════════════════════════════════════════════════════════════
   BÖLÜM 1 — ht01-legacy.css DOSYA SONUNA EKLE
   MG-* LANDING BİLEŞENLERİ — ÖĞE SAYISINA DAYANIKLILIK (v3)
   Landing HTML'i oc4_cecotec_landing tablosunda tutuluyor; HTML'e DOKUNULMAZ.
   Not: mevcut mg-* kurallarıyla eşit specificity'de olan kurallar dosyada
   SONRA geldigi icin kazanir. CSS ic ice yorum desteklemez, tek seviye kullanildi.
   ═══════════════════════════════════════════════════════════════════════ */

/* --- 1.0 GUVENLIK AGI: JS boş kartı gizlerse (remove edemezse) yine de kaybolsun.
       .mg-grid-3__card{display:flex} author kuralı UA [hidden]{display:none}
       kuralını yener, o yüzden !important şart. --- */
.mg-grid-3__card[hidden],
.mg-video-gallery__item[hidden],
.mg-gallery-card[hidden]{
  display: none !important;
}

/* --- 1.1 JS'in isaretledigi durum: kaydiracak bir sey yoksa oklar gizlenir --- */
.mg-grid-3[data-mg-static="1"] .mg-grid-3__arrow,
.mg-video-gallery[data-mg-static="1"] .mg-video-gallery__arrow{
  display: none !important;
}

/* ═══ 1.2  3'LU KART IZGARASI — DESKTOP (>992px) ═══ */
@media (min-width: 993px){

  /* 4+ kart = slider, sola yasli baslar */
  .mg-grid-3__cards{
    justify-content: flex-start;
  }

  /* TAM 1 KART: 1/3 genislikte yalniz kalmasin */
  .mg-grid-3__cards:has(> .mg-grid-3__card:first-child:nth-last-child(1)){
    justify-content: center;
  }
  .mg-grid-3__cards > .mg-grid-3__card:first-child:nth-last-child(1){
    flex: 0 0 min(620px, 60%);
    max-width: 620px;
  }

  /* TAM 2 KART: yariyi paylassinlar, ortali */
  .mg-grid-3__cards:has(> .mg-grid-3__card:first-child:nth-last-child(2)){
    justify-content: center;
  }
  .mg-grid-3__cards:has(> .mg-grid-3__card:first-child:nth-last-child(2)) > .mg-grid-3__card{
    flex: 0 0 calc(50% - 15px);
    max-width: 520px;
  }

  /* TAM 3 KART: mevcut davranis (calc(33.333% - 20px)) aynen korunur */

  /* 4+ KART: kullanici da kaydirabilsin (overflow:hidden bunu engelliyordu) */
  .mg-grid-3__cards:has(> .mg-grid-3__card:nth-child(4)){
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x proximity;
    overscroll-behavior-x: contain;
  }
  .mg-grid-3__cards:has(> .mg-grid-3__card:nth-child(4))::-webkit-scrollbar{
    display: none;
  }
  .mg-grid-3__cards:has(> .mg-grid-3__card:nth-child(4)) > .mg-grid-3__card{
    scroll-snap-align: start;
  }
}

/* ═══ 1.3  3'LU KART IZGARASI — MOBIL (<=992px) ═══ */
@media (max-width: 992px){

  /* is-static (1-2 kart): SIKISTIRMA YOK. 2 kart yan yana sigmiyorsa
     alt satira sarsin. Onceki kural flex:0 1 idi -> 300px kart 180px'e coküyordu. */
  .mg-grid-3__cards.is-static{
    flex-wrap: wrap;
    row-gap: 28px;
    justify-content: center;
    align-items: flex-start;
  }
  .mg-grid-3__cards.is-static > .mg-grid-3__card{
    flex: 0 0 min(88%, 320px);
    width: min(88%, 320px);
    max-width: 320px;
  }
  .mg-grid-3__cards.is-static > .mg-grid-3__card:only-child{
    flex: 0 0 min(92%, 360px);
    width: min(92%, 360px);
    max-width: 360px;
  }
}

/* ═══ 1.4  VIDEO GALERI — ogeyi sayiya gore genislet ═══ */
@media (min-width: 993px){
  .mg-video-gallery__track{
    justify-content: flex-start;
  }
  .mg-video-gallery__track:has(> .mg-video-gallery__item:first-child:nth-last-child(1)),
  .mg-video-gallery__track:has(> .mg-video-gallery__item:first-child:nth-last-child(2)){
    justify-content: center;
  }
  .mg-video-gallery__track > .mg-video-gallery__item:first-child:nth-last-child(1){
    flex: 0 0 min(620px, 55%);
    max-width: 620px;
  }
  .mg-video-gallery__track:has(> .mg-video-gallery__item:first-child:nth-last-child(2)) > .mg-video-gallery__item{
    flex: 0 0 calc(50% - 10px);
    max-width: 520px;
  }
  .mg-video-gallery__track:has(> .mg-video-gallery__item:nth-child(4)){
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }
  .mg-video-gallery__track:has(> .mg-video-gallery__item:nth-child(4))::-webkit-scrollbar{
    display: none;
  }
  .mg-video-gallery__track:has(> .mg-video-gallery__item:nth-child(4)) > .mg-video-gallery__item{
    scroll-snap-align: start;
  }
}

/* ═══ 1.5  GALERI IZGARASI (mg-gallery-grid) — tam-N kurallari ═══ */
@media (min-width: 993px){

  /* TAM 1 KART: ortada, makul genislik */
  .mg-gallery-grid:has(> .mg-gallery-card:first-child:nth-last-child(1)){
    grid-template-columns: minmax(0, 720px);
    justify-content: center;
  }
  /* TAM 2 KART: 2 esit sutun */
  .mg-gallery-grid:has(> .mg-gallery-card:first-child:nth-last-child(2)){
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* TAM 4 KART: 2x2 (3+1 yetim satir yerine) */
  .mg-gallery-grid:has(> .mg-gallery-card:first-child:nth-last-child(4)){
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* 1, 2 ve 4 kartta 'span 2' sifirlanir */
  .mg-gallery-grid:has(> .mg-gallery-card:first-child:nth-last-child(-n+2)) > .mg-gallery-card,
  .mg-gallery-grid:has(> .mg-gallery-card:first-child:nth-last-child(4)) > .mg-gallery-card{
    grid-column: auto;
  }
  /* TAM 5 KART: 3 + 2, ikinci satir ortalanir */
  .mg-gallery-grid:has(> .mg-gallery-card:first-child:nth-last-child(5)) > .mg-gallery-card:nth-child(4){
    grid-column: 2 / span 2;
  }
  .mg-gallery-grid:has(> .mg-gallery-card:first-child:nth-last-child(5)) > .mg-gallery-card:nth-child(5){
    grid-column: 4 / span 2;
  }
}

/* ═══ 1.6  SLIDER (bootstrap carousel) — tek slayt ═══ */
.mg-slider .carousel-indicators:has(> button:first-child:nth-last-child(1)){
  display: none !important;
}
/* Savunma: hicbir slayt 'active' degilse ilkini goster (bos bolum olmasin) */
.mg-slider .carousel-inner:not(:has(> .carousel-item.active)) > .carousel-item:first-child{
  display: block;
}

/* ═══ 1.7  Hareket azaltma tercihi ═══ */
@media (prefers-reduced-motion: reduce){
  .mg-grid-3__cards,
  .mg-video-gallery__track{
    scroll-behavior: auto !important;
  }
}