/* =========================
   References Grid (Widget)
   ========================= */
.widget_references .ref-grid{
  list-style:none;
  padding:0 !important;
  margin:0 !important;

  display:grid;

  /* default: 3 sütun (istersen ref-grid--4-3 ile override edilir) */
  grid-template-columns:repeat(3, 1fr);

  /* Yatay/dikey boşluk eşit */
  gap:5px;
  row-gap:5px;
  column-gap:5px;

  /* tema kaynaklı baseline/line-height boşluklarını azaltır */
  line-height:0;
}

.widget_references .ref-grid > li{
  margin:0 !important;
  padding:0 !important;
}

.widget_references .ref-grid > li::marker{
  content:"";
}

.ref-thumb{
  position:relative;
  width:100%;
  aspect-ratio:1 / 1;

  border:0;
  padding:0;
  cursor:pointer;
  background:transparent;
  overflow:hidden;
  border-radius:0px;

  display:block;
  line-height:0;
}

.ref-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block !important;

  transform:scale(1);
  transition:transform 220ms ease;
}

.ref-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.35);
  opacity:0;
  transition:opacity 220ms ease;
}

.ref-thumb:hover img,
.ref-thumb:focus-visible img{ transform:scale(1.06); }

.ref-thumb:hover::after,
.ref-thumb:focus-visible::after{ opacity:1; }

.ref-thumb:focus-visible{
  outline:3px solid rgba(155, 89, 182, 0.75); /* mor modern */
  outline-offset:2px;
}

/* 4/3 kolon sınıfı (desktop 4, küçükte 3) */
.ref-grid.ref-grid--4-3{
  grid-template-columns: repeat(6, 1fr);
}


.banner-ana-sayfa {
    margin-top: 5px;
    margin-bottom: 44px
}

.banner-ana-sayfa .banner-content {
    padding-top: 1.6rem;
    padding-bottom: 1.6rem
}

.banner-ana-sayfa h2 {
    font-size: 1.275em;
    line-height: 1.2
}

.banner-ana-sayfa h2 small {
    font-size: 80%;
    font-weight: 500;
    opacity: 0.9;
    margin-left:-0.2em
}

.banner-ana-sayfa b {
    position: relative;
    padding: 0.4em 0.6em;
    margin-left: 1px;
    z-index: 1;
	font-weight: 700;
	color: #ffffff !important
}

.banner-ana-sayfa b:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #c51111;
    transform: rotate(-2deg);
    z-index: -1
}

.banner-ana-sayfa .btn {
    letter-spacing: 0.01em;
	padding:0.8em 1.15em;
    font-size:1.4rem 
}







/* =========================
   Modal / Popup (Modern)
   ========================= */
.ref-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
}

.ref-modal.is-open{
  display:block;
}

.ref-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(10, 10, 14, 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.ref-modal__dialog{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:min(1040px, calc(100% - 24px));
  border-radius:18px;
  overflow:hidden;

  background:rgba(18, 18, 22, 0.92);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:0 30px 90px rgba(0,0,0,0.60);

  /* grid yok: nav butonları absolute */
  display:block;
}

.ref-modal__figure{
  margin:0;
  padding:0;
}

.ref-modal__img{
  width:100%;
  height:min(72vh, 680px);
  object-fit:contain;
  background:rgba(0,0,0,0.35);
  display:block;
}

.ref-modal__caption{
  padding:12px 14px;
  border-top:1px solid rgba(255,255,255,0.10);
  background:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));
}

.ref-modal__title{
  font-weight:700;
  font-size:14px;
  margin-bottom:4px;
}

.ref-modal__desc{
  font-size:13px;
  opacity:0.85;
}

/* Close (X) - her zaman en üstte */
.ref-modal__close{
  position:absolute;
  right:12px;
  top:12px;
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.14);
  cursor:pointer;

  background:rgba(255,255,255,0.10);
  color:#fff;
  font-size:22px;
  line-height:1;

  display:grid;
  place-items:center;

  z-index:50;          /* kritik */
}

.ref-modal__close:hover{
  background:rgba(255,255,255,0.16);
}

/* Prev / Next - sadece buton alanı kadar tıklanır */
.ref-modal__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.14);
  cursor:pointer;

  background:rgba(255,255,255,0.10);
  color:#fff;
  font-size:24px;

  display:grid;
  place-items:center;

  z-index:40;
}

.links-2col{
  display: grid;
  grid-template-columns: 1fr 1fr; /* desktop + mobil her zaman 2 kolon */
  gap: 6px 18px;                  /* dikey / yatay boşluk */
}

.links-2col .links{
  margin: 0;
  padding: 0;
}

.ref-modal__nav:hover{
  background:rgba(255,255,255,0.16);
}

.ref-modal__nav--prev{ left:12px; }
.ref-modal__nav--next{ right:12px; }

@media (max-width:480px){
  .widget_references .ref-grid{
    gap:5px;
    row-gap:8px;
    column-gap:5px;
  }

  .ref-modal__nav{
    width:42px;
    height:42px;
    border-radius:12px;
  }

  .ref-modal__close{
    width:42px;
    height:42px;
    border-radius:12px;
  }
}







    /* =========================
       İZOLE: et-announce
       ========================= */
    .et-announce,
    .et-announce *,
    .et-announce *::before,
    .et-announce *::after { box-sizing: border-box; }

    .et-announce{
      font-family: Roboto, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;

      --et-font: 12px;
      --et-badge-font: 12px;
      --et-gap: 8px;

      --et-min-h: 24px;
      --et-pad-block: 2px;

      --et-badge-py: 5px;
      --et-badge-px: 10px;

      /* Desktop: 350px */
      --et-width: 350px;
    }

	/* Mobile + Tablet: 260px (480'deki değerler 768'e kadar korunur) */
	@media (max-width: 768px){
	  .et-announce{
		--et-width: 260px;

		--et-font: 10px;
		--et-badge-font: 10px;
		--et-gap: 6px;

		--et-min-h: 28px;
		--et-pad-block: 3px;

		--et-badge-px: 8px;
	  }

	  /* Tema !important ile eziyorsa garanti */
	  .et-announce .et-announce__link{ font-size: 10px !important; }
	  .et-announce .et-announce__badge{ font-size: 10px !important; }
	}	
	
    /* Mobile: 220px */
    @media (max-width: 480px){
      .et-announce{
        --et-width: 220px;

        --et-font: 10px;
        --et-badge-font: 10px;
        --et-gap: 6px;

        --et-min-h: 28px;
        --et-pad-block: 3px;

        --et-badge-px: 8px;
      }

      /* Tema !important ile eziyorsa garanti */
      .et-announce .et-announce__link{ font-size: 10px !important; }
      .et-announce .et-announce__badge{ font-size: 10px !important; }
    }

    .et-announce__title{
      margin: 0 !important;
      padding: 0 !important;
      font-size: var(--et-font);
      font-weight: 400;
      line-height: normal;
      display: inline-block;
      vertical-align: middle;
    }

    .et-announce__viewport{
      display: inline-block;
      position: relative;
      overflow: hidden;

      width: var(--et-width);
      min-height: var(--et-min-h);
      padding-block: var(--et-pad-block);

      vertical-align: middle;
      line-height: normal;
      transform: translateZ(0);
    }

    .et-announce__track{
      position: absolute;
      inset: 0;
      will-change: transform;
      transform: translate3d(0,0,0);
    }

    .et-announce__item{
      display: flex;
      align-items: center;
      gap: var(--et-gap);

      min-height: var(--et-min-h);
      padding-block: var(--et-pad-block);

      white-space: nowrap;
      overflow: hidden;
    }

    .et-announce__badge{
      background: #f26c00;
      color: #fff;
      display: inline-flex;
      align-items: center;

      padding: var(--et-badge-py) var(--et-badge-px);
      border-radius: 2px;

      font-size: var(--et-badge-font);
      font-weight: 600;
      line-height: 1;
      white-space: nowrap;
      border: 0;
      flex: 0 0 auto;
    }

    /* Ellipsis */
    .et-announce .et-announce__link{
      color: #bde1f5;
      text-decoration: none;

      font-size: var(--et-font);
      line-height: 1.2;

      display: block;
      flex: 1 1 auto;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .et-announce .et-announce__link:hover{ text-decoration: underline; }

    /* Dikey mod transition */
    .et-announce[data-mode="vertical"] .et-announce__track{
      transition: transform 500ms ease;
    }

    /* Yatay mod */
    .et-announce[data-mode="horizontal"] .et-announce__track{
      position: relative;
      height: 100%;
    }

    .et-announce__layer{
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      gap: var(--et-gap);
      overflow: hidden;
      white-space: nowrap;
      will-change: transform;
      transform: translate3d(0,0,0);
    }

    @media (prefers-reduced-motion: reduce){
      .et-announce__track,
      .et-announce__layer{ transition: none !important; }
    }
	
	
	
	
.products-snap{ position: relative; }

.products-snap__viewport{
  position: relative;
  overflow: hidden;
}

/* Track */
.products-snap__track{
  display: flex;
  gap: 15px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;

  scroll-snap-type: none;

  padding: 0 0 10px 0;

  scrollbar-width: none;
  -ms-overflow-style: none;

  cursor: grab;
}
.products-snap__track::-webkit-scrollbar{ display: none; }

.products-snap__track.is-dragging{
  cursor: grabbing;
  user-select: none;
}

.products-snap__item{
  flex: 0 0 auto;
  min-width: 140px;
}

/* Kartı kare kutu gibi yap */
.products-snap .product-default{
  border: 1px solid #e6e6e6;
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
}

/* Görsel alanı kare */
.products-snap .product-default figure{
  margin: 0;
  width: 100%;
  aspect-ratio: 1 / 1; /* modern tarayıcılar */
  overflow: hidden;
}

/* ===== Fotoğrafa çerçeve içinde boşluk ===== */
.products-snap .product-default figure{
  padding: 10px 10px 0px 10px;
  box-sizing: border-box;
}

/* aspect-ratio desteklemeyenler için fallback */
@supports not (aspect-ratio: 1 / 1){
  .products-snap .product-default figure{ position: relative; }
  .products-snap .product-default figure::before{
    content:"";
    display:block;
    padding-top: 100%;
  }
  .products-snap .product-default figure > a{
    position:absolute; inset:0;
    display:block;
  }
}

/* Resim kareye crop */
.products-snap .product-default figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Detay alanı */
.products-snap .product-details{
  padding: 10px 10px 12px;
}

/* ORTALAMA */
.products-snap .product-default .product-details{ text-align: center !important; }

.products-snap .product-default .product-details .category-list{
  width: 100% !important;
  display: block !important;
  text-align: center !important;
}
.products-snap .product-default .product-details .category-list a,
.products-snap .product-default .product-details .category-list span{
  float: none !important;
  display: inline-block !important;
  margin: 0 auto !important;
}

.products-snap .product-default .product-details .product-title{
  width: 100% !important;
  float: none !important;
  display: block !important;
  margin: 0px 0 0px !important;
  padding: 0 !important;
  text-align: center !important;
}
.products-snap .product-default .product-details .product-title a{
  float: none !important;
  display: inline-block !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.products-snap .product-default .product-details .ratings-container{
  width: 100% !important;
  float: none !important;
  display: block !important;
  text-align: center !important;
}
.products-snap .product-default .product-details .product-ratings{
  float: none !important;
  display: inline-block !important;
  margin: 0 auto !important;
}

/* >=1024 : 4 + yarım */
@media (min-width: 1024px){
  .products-snap__item{ width: calc((100% - (20px * 3)) / 4.5); }
}

/* 768-1023 : 3 + yarım */
@media (min-width: 768px) and (max-width: 1023.98px){
  .products-snap__item{ width: calc((100% - (20px * 2)) / 3.5); }
}

/* 480-767 : 2 + yarım */
@media (min-width: 480px) and (max-width: 767.98px){
  .products-snap__item{ width: calc((100% - 20px) / 2.5); }
}

/* 0-479 : 2 + yarım + BOŞLUK YOK */
@media (max-width: 479.98px){
  .products-snap__track{ gap: 14px; }

  .products-snap__track{
    padding-left: 0;
    padding-right: 0;
  }

  .products-snap__item{
    width: calc((100% - 14px) / 2.5);
    min-width: 120px;
  }
}	
	



	
.home-slider .home-slide{
  position: relative;
  overflow: hidden;
  height: clamp(220px, 45vw, 428px);
}
.home-slider .home-slide .slide-bg{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
.home-slider .home-slide .slide-overlay-link{
  position: absolute;
  inset: 0;
  z-index: 1;
}
.home-slider .home-slide .banner-layer{
  z-index: 2;
}
.home-slider .home-slide .slide-cta{
  position: relative;
  z-index: 3;
}

/* Tavsiye Ürünler: kendi dot/butonlarımız */
.product-media{ position: relative; }
.tavsiye-noktalar{
  position:absolute;
  left:10px;
  bottom:12px;
  display:flex;
  gap:6px;
  z-index: 5;
}
.tavsiye-nokta{
  width:5px;
  height:5px;
  background:#7d7d7d;
  border:0;
  padding:0;
  border-radius:50%;
  cursor:pointer;
  outline:none !important;
  box-shadow:none !important;
}
.tavsiye-nokta.aktif{
  width:20px;
  border-radius:4px;
  background:#ff5561;
}
.tavsiye-nokta:focus,
.tavsiye-nokta:active{
  outline:none !important;
  box-shadow:none !important;
}
.tavsiye-nokta::-moz-focus-inner{
  border:0 !important;
}	
	
	
	