:root{
  --pc-ink:#191817;
  --pc-muted:#716b62;
  --pc-line:#e6ded2;
  --pc-paper:#f7f4ef;
  --pc-card:#ffffff;
  --pc-accent:#9a7444;
  --pc-accent-2:#2f6f73;
}
body{
  background:var(--pc-paper)!important;
  color:var(--pc-ink);
  font-family:'Segoe UI',Arial,sans-serif!important;
  -webkit-font-smoothing:antialiased;
}
header{
  background:#171717!important;
  letter-spacing:.08em;
  font-weight:800;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 12px 30px rgba(0,0,0,.08);
}
.container{max-width:1180px!important;margin:44px auto 76px!important;align-items:flex-start!important;}
.container>h2{
  font-size:clamp(30px,4vw,48px)!important;
  line-height:1.02!important;
  margin:8px 0 28px!important;
  color:var(--pc-ink);
  position:relative;
}
.container>h2:after{
  content:"";
  display:block;
  width:72px;
  height:3px;
  background:var(--pc-accent);
  margin-top:14px;
}
.products{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))!important;gap:28px!important;}
.product{
  background:var(--pc-card)!important;
  border:1px solid var(--pc-line)!important;
  border-radius:10px!important;
  overflow:hidden!important;
  box-shadow:0 14px 34px rgba(31,31,31,.08)!important;
  color:var(--pc-ink)!important;
  position:relative;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}
.product:after{
  content:"İncele";
  position:absolute;
  right:14px;
  top:14px;
  background:rgba(25,24,23,.82);
  color:#fff;
  font-size:12px;
  font-weight:800;
  padding:7px 10px;
  border-radius:999px;
  opacity:0;
  transform:translateY(-4px);
  transition:.22s ease;
}
.product:hover{transform:translateY(-6px)!important;box-shadow:0 22px 52px rgba(31,31,31,.15)!important;border-color:#cdbb9b!important;}
.product:hover:after{opacity:1;transform:translateY(0);}
.product img{
  width:100%!important;
  height:220px!important;
  display:block;
  background:#f1eee8;
  object-fit:cover!important;
  object-position:center center!important;
  transition:filter .35s ease;
}
.product:hover img{filter:saturate(1.04) contrast(1.02);}
.product h3{
  font-size:19px!important;
  line-height:1.25!important;
  text-align:left!important;
  margin:0!important;
  padding:14px 18px 16px!important;
  min-height:0;
  display:flex;
  align-items:flex-start;
}
.back-btn{
  border-radius:9px!important;
  border:1px solid var(--pc-line)!important;
  box-shadow:0 8px 24px rgba(31,31,31,.08)!important;
  background:#fff!important;
  color:var(--pc-ink)!important;
}
.back-btn:hover{background:#171717!important;color:#fff!important;}
.container:has(.gallery){
  align-items:flex-start!important;
  gap:32px!important;
}
.gallery{gap:16px;}
.main-img{
  width:100%!important;
  height:auto!important;
  max-height:620px!important;
  border-radius:10px!important;
  box-shadow:0 18px 44px rgba(31,31,31,.12);
  background:#f1eee8;
  object-fit:initial!important;
}
.thumbnails{gap:12px!important;}
.thumbnails img{
  border-radius:8px!important;
  background:#fff;
  box-shadow:0 8px 18px rgba(31,31,31,.08);
}
.thumbnails img.active{border-color:var(--pc-accent)!important;}
.details{
  border:1px solid var(--pc-line)!important;
  border-radius:10px!important;
  box-shadow:0 18px 44px rgba(31,31,31,.08)!important;
  align-self:flex-start!important;
  padding:30px!important;
}
.details h2{line-height:1.08;color:var(--pc-ink);font-size:clamp(28px,3.2vw,42px)!important;margin-top:0!important;}
.details p{color:var(--pc-muted)!important;font-size:16px!important;}
.category-title{text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--pc-accent)!important;}
.social-buttons{gap:12px!important;margin-top:26px!important;}
.social-buttons a{border-radius:9px!important;min-height:50px!important;box-shadow:0 12px 24px rgba(31,31,31,.1);}
.empty-state{grid-column:1/-1;background:#fff;border:1px dashed var(--pc-line);border-radius:8px;padding:24px;color:var(--pc-muted);}
.category-list .category{
  min-height:74px!important;
  align-items:center!important;
  padding:22px 24px!important;
  position:relative;
  overflow:hidden;
}
.category-list .category:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--pc-accent);
}
.category-list .category:after{
  content:"→";
  margin-left:auto;
  color:var(--pc-accent);
  font-size:22px;
  transition:transform .22s ease;
}
.category-list .category:hover:after{transform:translateX(4px);}
.welcome h1{font-weight:850!important;}
.welcome p{line-height:1.55!important;}
.slider{border-radius:12px!important;}
.slide{background-size:cover!important;background-position:center center!important;background-color:#f1eee8!important;}
.slide-caption{border-radius:9px!important;backdrop-filter:blur(8px);}
@media screen and (max-width:700px){
  .product img{height:190px!important;}
  .product h3{min-height:auto;}
  .container{width:calc(100% - 32px)!important;}
  .details{padding:22px!important;}
  .category-list .category{min-height:60px!important;}
}

.category-list .category:after{
  content:"→"!important;
}

.slider{
  width:calc(100% - 48px)!important;
  max-width:1240px!important;
  height:640px!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  margin:28px auto 12px!important;
  border-radius:16px!important;
  background:#f1eee8!important;
  box-shadow:0 24px 58px rgba(31,31,31,.16)!important;
}

.slides,
.slide{
  height:100%!important;
}

.slide{
  background:none!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  isolation:isolate;
}

.slide:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.18));
  z-index:2;
  pointer-events:none;
}

.slide-backdrop{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  display:block!important;
}

.slide-backdrop img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.slide-photo,
.main-img,
.slider .slide img {
  width: 100% !important;
  height: 100% !important;
  /* Görselin hiçbir kenarının kesilmemesini sağlar */
  object-fit: contain !important; 
  /* Görseli dikey ve yatayda tam ortaya hizalar */
  object-position: center center !important; 
  display: block !important;
}

.slide-photo {
  position: relative;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  /* contain: Görseli sünmeden veya kırpmadan alanı dolduracak şekilde sığdırır */
  object-fit: contain !important; 
  object-position: center center !important;
  display: block;
}

.slide-caption{
  bottom:28px!important;
  z-index:3;
  border-radius:10px!important;
  background:rgba(25,24,23,.68)!important;
  padding:13px 22px!important;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
  backdrop-filter:blur(10px);
}

.arrow{
  width:48px!important;
  height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  background:rgba(25,24,23,.5)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}

.arrow-left{left:20px!important;}
.arrow-right{right:20px!important;}

.dots{
  margin:16px 0 38px!important;
}

.dot{
  width:10px!important;
  height:10px!important;
  margin:0 7px!important;
  background:#c9c4bc!important;
}

.dot.active{
  background:#2d2c2a!important;
  transform:scale(1.15);
}

@media screen and (max-width:900px){
  .slider{
    width:calc(100% - 28px)!important;
    height:460px!important;
  }
}

@media screen and (max-width:600px){
  .slider{
    height:340px!important;
    border-radius:10px!important;
  }

  .slide-caption{
    width:calc(100% - 84px);
    max-width:320px;
    font-size:18px!important;
  }

  .arrow{
    width:40px!important;
    height:40px!important;
    font-size:24px!important;
  }

  .arrow-left{left:12px!important;}
  .arrow-right{right:12px!important;}
}

.slider .slide .slide-backdrop img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  filter:blur(18px) saturate(.95) brightness(.86)!important;
  transform:scale(1.06)!important;
}

.slider .slide img.slide-photo{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
}

.main-img{
  width:100%!important;
  height:auto!important;
  max-height:620px!important;
  object-fit:initial!important;
}

/* Home hero slider */
.slider{
  width:min(1240px,calc(100% - 48px))!important;
  height:clamp(420px,48vw,620px)!important;
  margin:26px auto 14px!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:#171717!important;
  box-shadow:0 26px 70px rgba(31,31,31,.18)!important;
}

.slides,
.slide{
  height:100%!important;
}

.slide{
  display:block!important;
  position:relative!important;
  overflow:hidden!important;
  background:#171717!important;
}

.slide:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  background:
    linear-gradient(90deg,rgba(12,12,12,.58) 0%,rgba(12,12,12,.26) 38%,rgba(12,12,12,.04) 72%),
    linear-gradient(180deg,rgba(0,0,0,.04) 35%,rgba(0,0,0,.32) 100%)!important;
  pointer-events:none!important;
}

.slider .slide img.slide-photo{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center 68%!important;
  display:block!important;
  transform:scale(1.01);
  transition:transform 5s ease;
}

.slide:hover img.slide-photo{
  transform:scale(1.045);
}

.slide-caption{
  position:absolute!important;
  left:clamp(28px,6vw,76px)!important;
  right:auto!important;
  bottom:clamp(28px,5vw,62px)!important;
  transform:none!important;
  z-index:3!important;
  width:min(430px,calc(100% - 96px))!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:left!important;
  color:#fff!important;
  backdrop-filter:none!important;
}

.slide-caption span{
  display:block;
  margin-bottom:10px;
  color:#d9c3a1;
  font-size:13px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.slide-caption strong{
  display:block;
  color:#fff;
  font-size:clamp(34px,4.5vw,62px);
  line-height:.98;
  letter-spacing:0;
  text-shadow:0 12px 34px rgba(0,0,0,.34);
}

.slide-caption em{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:22px;
  padding:12px 16px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:999px;
  color:#fff;
  font-style:normal;
  font-size:14px;
  font-weight:800;
  background:rgba(255,255,255,.1);
}

.slide-caption em:after{
  content:"→";
  font-size:18px;
  line-height:1;
}

.arrow{
  background:rgba(18,18,18,.48)!important;
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(8px);
}

@media screen and (max-width:900px){
  .slider{
    width:calc(100% - 28px)!important;
    height:440px!important;
  }
  .slider .slide img.slide-photo{
    object-position:center center!important;
  }
}

@media screen and (max-width:600px){
  .slider{
    height:390px!important;
    border-radius:12px!important;
  }
  .slide-caption{
    left:22px!important;
    bottom:28px!important;
    width:calc(100% - 84px)!important;
  }
  .slide-caption strong{
    font-size:32px!important;
  }
  .slide-caption em{
    margin-top:16px;
  }
}
