:root{
  --bg:#fff; --muted:#6f6f6f; --accent:#c98c2e; --dark:#222;
  --container:1200px; --shadow:0 10px 30px rgba(18,18,18,0.06);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial;
}
/* Yanıp sönen metin imlecini (caret) tamamen kapat */
* {
  caret-color: transparent !important;
}

*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--bg);color:var(--dark);-webkit-font-smoothing:antialiased}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}
a{color:inherit;text-decoration:none}
.section{padding:56px 0}
.section-title{ text-align:center;font-size:28px;margin:0 0 20px;font-weight:700;color:var(--dark) }

/* HEADER */
.site-header{position:sticky;top:0;z-index:220;background:rgba(255,255,255,0.98);backdrop-filter: blur(4px);box-shadow:0 2px 8px rgba(0,0,0,0.03)}
.header-inner{max-width:var(--container);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px 20px;gap:12px}
.logo img{max-height:56px; display:block;margin-left:28px}

/* NAV (desktop) */
.main-nav{display:flex;align-items:center;gap:20px}
.nav-list{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.nav-list a{display:inline-block;padding:12px 4px;color:var(--muted);font-weight:600;position:relative}
.nav-list a::after{content:'';position:absolute;left:0;right:0;bottom:2px;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left center;transition:transform .28s cubic-bezier(.2,.9,.3,1)}
.nav-list a:hover::after{transform:scaleX(1)}
.nav-list a.contact-link::after{height:4px;border-radius:4px;}

/* nav socials */
.nav-socials{display:flex;gap:8px}
.nav-social-img{width:36px;height:36px;border-radius:50%;background:#fff;box-shadow:var(--shadow);padding:6px;filter:grayscale(1);transition:filter .22s ease, transform .15s ease}
.nav-socials a:hover .nav-social-img{filter:grayscale(0);transform:translateY(-3px) scale(1.15)}

/* hamburger */
.hamburger{display:none;flex-direction:column;gap:6px;padding:8px;background:transparent;border:0;cursor:pointer;margin-right:12px;z-index:230}
.hamburger span{width:28px;height:3px;background:#222;border-radius:3px;display:block}

/* MOBILE OVERLAY */
.mobile-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.35);display:none;z-index:300}
.mobile-overlay[aria-hidden="false"]{display:block}
.mobile-panel{background:#fff;position:fixed;top:0;right:0;bottom:0;width:320px;box-shadow:-8px 0 30px rgba(0,0,0,0.12);padding:28px;overflow:auto;z-index:320}
.mobile-close{background:none;border:0;font-size:36px;position:absolute;top:6px;right:10px;cursor:pointer}
.mobile-list{list-style:none;padding:60px 0 0 0;display:flex;flex-direction:column;gap:18px}
.mobile-list a{font-size:18px;color:var(--dark)}
.mobile-socials{display:flex;flex-direction:column;gap:8px;margin-top:24px}
.mobile-socials a{display:inline-flex;gap:10px;align-items:center;color:var(--muted);font-weight:600}
.mobile-socials a i{background:#fff;padding:8px;border-radius:8px;box-shadow:var(--shadow);}

/* SLIDER */
.hero{padding:0;margin:0}
.slider{position:relative;overflow:hidden;aspect-ratio:16/9;width:100%;min-height:200px}
.slides{position:relative;height:100%;width:100%;overflow:hidden}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.slide img{width:100%;height:100%;object-fit:cover;display:block}
.slide.active{opacity:1}
/* MASAÜSTÜ SLIDER YÜKSEKLİK AYARI */
@media (min-width: 1024px) {
    .slider {
        height: 600px !important; /* İstersen 350px – 500px arası ayarlayabilirsin */
    }
}

/* slider buttons + dots */
.slider-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,0.92);border:0;padding:10px;border-radius:50%;box-shadow:var(--shadow);cursor:pointer;z-index:210}
.slider-btn.prev{left:14px}
.slider-btn.next{right:14px}
.slider-dots{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:210}
.slider-dots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,0.55);cursor:pointer}
.slider-dots button.active{background:var(--accent)}

/* PRODUCT GRID */
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:start}
.product-item{background:#fff;border-radius:12px;padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:260px;transition:transform .18s}
.product-item:hover{transform:translateY(-6px)}
.product-thumb{width:100%;max-width:320px;margin:0 auto}
.product-thumb img{width:100%;height:160px;object-fit:cover;border-radius:8px;display:block}
.product-title{text-align:center;margin:12px 0 8px;font-size:18px;font-weight:700}
.product-desc{color:var(--muted);text-align:center;font-size:14px;line-height:1.3;flex:1 1 auto;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* BRANDS */
.brands-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:center}
.brand-card{background:#fff;padding:18px;border-radius:12px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);min-height:84px}
.brand-card img{max-width:90%;max-height:64px;object-fit:contain;filter:grayscale(1);transition:filter .22s ease, transform .12s ease}
.brand-card:hover img{filter:grayscale(0);transform:translateY(-4px)}

/* ABOUT */
.about-inner{display:flex;gap:28px;align-items:center}
.about-thumb img{width:300px;height:220px;object-fit:cover;border-radius:10px}
.about-content h2{margin:0 0 8px}
.about-content .accent{color:var(--accent);margin-bottom:12px}

/* FOOTER */
.site-footer{background:#fff;border-top:1px solid #eee;padding:36px 0}
.footer-inner{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;max-width:var(--container);margin:0 auto;padding:0 20px}
.footer-left{max-width:320px}
.footer-logo{height:56px}
.footer-desc{color:var(--muted);margin-top:8px}
.footer-center h4,.footer-right h4{margin-bottom:8px}
.footer-menu{list-style:none;padding:0}
.footer-menu li{margin:8px 0}
.footer-menu a{color:var(--muted)}
.footer-socials{display:flex;gap:12px;margin-top:10px}
.footer-social-img{width:36px;height:36px;filter:grayscale(1);transition:filter .2s ease, transform .12s ease}
.footer-social:hover .footer-social-img{filter:grayscale(0);transform:translateY(-3px) scale(1.15)}

/* FOOTER İLETİŞİM - Adres, Telefon, Mail linkleri */
.footer-right p,
.footer-right a {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-weight: 500;
  transition: color .22s ease, transform .15s ease;
  text-decoration: none;
}

.footer-right p a,
.footer-right a {
  color: inherit;
}

.footer-right p a:hover,
.footer-right a:hover {
  color: var(--accent);
  transform: translateY(-2px);
}
/* FOOTER (beyaz arka plan + modern) */
.site-footer {
  background: #ffffff;
  color: #333;
  padding: 60px 0 30px;
  margin-top: 60px;
  font-size: 15px;
  border-top: 1px solid #e5e5e5;
border-top: 1px solid #dcdcdc !important;
  margin-top: 40px;
}

.footer-inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  align-items: flex-start;
}

/* SOL */
.footer-left {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-logo {
  width: 160px;
  margin-bottom: 10px;
}

.footer-desc {
  color: #666;
  font-size: 14px;
}

/* Sosyal ikonlar */
.contact-icons a {
  font-size: 22px;
  margin-right: 15px;
  color: #333;
  transition: .3s;
}

.contact-icons a:hover {
  color: #d4a017; /* gold */
}

/* ORTA */
.footer-center h4,
.footer-right h4 {
  font-size: 18px;
  margin-bottom: 10px;
  color: #222;
}

.footer-menu li {
  margin: 6px 0;
}

.footer-menu a {
  color: #333;
  transition: .3s;
}

.footer-menu a:hover {
  padding-left: 5px;
  color: #d4a017;
}

/* SAĞ (adres–telefon–mail tümü aynı hizada) */
.footer-right p, 
.footer-right a {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #333;
  margin: 6px 0;
  transition: .3s;
}

.footer-right a:hover {
  color: #d4a017;
}

/* ikonlar */
.footer-right i {
  color: #d4a017;
}

/* Alt copyright */
.copyright {
  text-align: center;
  margin-top: 40px;
  font-size: 14px;
  color: #666;
}

.powered-link {
  color: #333;
  transition: .3s;
}

.powered-link:hover {
  color: #d4a017;
}

/* MOBİL */
@media (max-width: 900px) {
  .footer-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .footer-right p, .footer-right a {
    justify-content: center;
  }

  .contact-icons a {
    margin-right: 8px;
  }
}


/* CONTACT ICONS + HOVER ANIMATION */
.contact-icons{
  display:flex;
  gap:12px;
  margin-top:12px;
}

.contact-icons a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:50%;
  background:#fff;
  box-shadow:var(--shadow);
  color:var(--muted);
  font-size:18px;
  transition: transform .15s ease, color .22s ease;
}

.contact-icons a:hover{
  transform:translateY(-2px) scale(1.15);
  color:var(--accent);
}
/* ================================
   MOBİL İLETİŞİM + FOOTER GÜNCELLEME
   ================================ */
@media (max-width: 820px){

  /* Footer genel düzen */
  .site-footer{
    text-align:center;
    padding:40px 20px;
  }

  .footer-inner{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:32px;
  }

  /* Sol blok (logo + sosyal medya) */
  .footer-left{
    align-items:center;
    text-align:center;
  }

  .footer-left .contact-icons{
    justify-content:center;
    margin-top:10px;
    gap:20px;
  }

  .footer-left .contact-icons a i{
    font-size:22px;
  }

  /* Menü */
  .footer-center{
    text-align:center;
  }

  .footer-center ul{
    padding:0;
  }

  .footer-center ul li{
    margin:6px 0;
  }

  /* İletişim bloğu */
  .footer-right{
    text-align:center;
  }

  .footer-right p,
  .footer-right a{
    display:block;
    margin:10px 0;
    font-size:16px;
  }

  .footer-right a i{
    margin-right:6px;
  }

  /* Copyright */
  .copyright{
    text-align:center;
    margin-top:30px;
    font-size:15px !important;
  }

}

/* Footer/İletişim ikonları hover efekti ile uyumlu nav bar */
.footer-center ul li a{
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--muted);
  transition: color .22s ease;
}

.footer-center ul li a:hover{
  color:var(--accent);
  text-decoration:none;
}

.powered-link{
  color:var(--accent);
  font-weight:700;
  font-size:16px;
  text-decoration:none;
  transition: transform .15s ease, text-shadow .22s ease, color .22s ease;
}

.powered-link:hover{
  transform:translateY(-2px) scale(1.15);
  text-shadow:0 2px 10px rgba(0,0,0,0.25);
  color:var(--dark);
}
/* Tüm footer iletişim linkleri (adres, telefon, mail) */
.footer-right a {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-weight: 400; /* normal kalınlık */
  text-decoration: none;
  transition: color .22s ease, transform .15s ease;
}

.footer-right a:hover {
  color: var(--accent);
  transform: translateY(-2px);
}

/* Footer copyright yazısını da biraz büyütelim */
.copyright{
  display:block;
  text-align:center;
  color:var(--muted);
  font-size:15px;
  padding:12px 0;
  line-height:1.5;
}

/* RESPONSIVE */
@media (max-width:1100px){
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .brands-grid{grid-template-columns:repeat(2,1fr)}
  .about-inner{flex-direction:column;align-items:flex-start}
  .about-thumb img{width:220px;height:170px}
}

@media (max-width:820px){
  .nav-list{display:none}
  .nav-socials{display:none}
  .hamburger{display:flex}
  body.nav-open{overflow:hidden}
  .product-grid{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory;align-items:stretch}
  .product-item{min-width:78%;flex:0 0 78%;scroll-snap-align:center;display:flex;flex-direction:column;min-height:260px}
  .brands-grid{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
  .brand-card{min-width:46%;flex:0 0 46%;scroll-snap-align:center}
  .slider-btn{display:none}
  .header-inner{padding:10px}
  .logo img{max-height:48px;margin-left:8px}
  .about-inner{gap:18px;padding:18px 0;text-align:center;align-items:center}
  .about-thumb img{width:80%;max-width:300px;height:auto;object-fit:cover;border-radius:10px}
  .about-content h2,
  .about-content h3,
  .about-content p{text-align:center}
  .footer-inner{flex-direction:column;gap:16px}
}

@media (max-width:420px){
  .product-item{min-width:86%}
  .section{padding:36px 0}
  .section-title{font-size:22px}
}

/* Ortak hover animasyonu */
a, .nav-social-img, .footer-social-img, .footer-right {
  transition: color .25s ease, transform .15s ease, filter .2s ease;
}

/* Menü ve footer link hover efekti */
.nav-list a:hover,
.footer-menu a:hover,
.contact-link:hover {
  color: var(--accent);
  transform: translateY(-2px);
}

/* Sosyal ikon hover efekti */
.nav-social-img:hover,
.footer-social-img:hover {
  filter: grayscale(0);
  transform: translateY(-2px);
}
/* Marka kutularını büyüt (fotoğraflara dokunmadan) */
.brands-grid .brand-card{
  min-height:120px;     /* önce 84px idi, kutu büyüdü */
  padding:28px;         /* iç boşluk arttı */
  border-radius:14px;   /* daha şık */
  transition:transform .15s ease;
}

@media (max-width:820px){
  .brands-grid .brand-card{
    min-width:52%;
    min-height:110px;   /* mobilde de büyük olsun */
    padding:24px;
  }
}

/* focus */
a:focus, button:focus{outline:3px solid rgba(201,140,46,0.18);outline-offset:3px}
