:root{
  --dark-olive:#2f4b2f;
  --light-olive:#7aa07a;
  --cream:#f3efe6;
  --white:#ffffff;
  --soil:#a67c52;
  --accent:#e07a2f; /* turuncu vurgusu */
  --max-width:1200px;
}
*{box-sizing:border-box}
body{font-family:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; color:var(--dark-olive); background:var(--cream); line-height:1.5}
.container{max-width:var(--max-width); margin:0 auto; padding:1rem}
.site-header{background:rgba(255,255,255,0.9); backdrop-filter:blur(4px); position:fixed; top:0; left:0; right:0; z-index:1000; box-shadow:0 1px 6px rgba(0,0,0,0.08)}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem}
.brand{font-weight:800; color:var(--dark-olive); font-size:1.5rem; letter-spacing:0.06em; text-transform:none}
.main-nav ul{display:flex; gap:1rem; list-style:none; margin:0; padding:0}
.main-nav a{color:var(--dark-olive); text-decoration:none; padding:1rem; display:block}
.nav-toggle{display:none; background:none; border:none; font-size:1.4rem}

.hero{min-height:70vh; display:flex; align-items:center; justify-content:center; background-image:linear-gradient(rgba(18,30,18,0.45), rgba(18,30,18,0.45)), url('assets/images/hero-placeholder.jpg'); background-size:cover; background-position:center; color:var(--white); margin-top:64px}
.hero-overlay{width:100%; padding:6rem 0}
.hero-content{text-align:center}
.hero h1{font-size:2rem; margin:0 0 .5rem}
.lead{font-size:1.1rem; opacity:0.95}
.btn{display:inline-block; padding:.7rem 1.2rem; border-radius:6px; text-decoration:none; border:2px solid transparent; cursor:pointer}
.btn-primary{background:var(--dark-olive); color:var(--white);}
.btn-secondary{background:transparent; color:var(--white); border-color:var(--white)}

.about{padding:4rem 0}
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:center}
.about-image img{width:100%; border-radius:8px}
.values{list-style:none; padding:0; margin-top:1rem; display:flex; flex-direction:column; align-items:center; text-align:center; gap:0.75rem}
.values li{max-width:420px; width:100%}

.products{padding:4rem 0}
.products-grid{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:3rem 2.25rem}
.product-card{background:var(--white); border-radius:12px; overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,0.06); cursor:pointer; display:flex; flex-direction:column}
.product-image-wrapper{width:100%; height:280px; overflow:hidden; border-radius:12px}
.product-image{width:100%; height:100%; object-fit:cover; transition:transform 0.3s ease}
.product-image-placeholder{width:100%; height:100%; display:flex; align-items:center; justify-content:center; border-radius:12px; background:linear-gradient(180deg,#eaf4ea,#dfeedd); color:var(--dark-olive); font-weight:600}
.product-card-content{padding:1.5rem; display:flex; align-items:center; justify-content:space-between; flex-grow:1}
.product-card h3{margin:0; font-size:1.1rem}
.product-arrow{font-size:1.2rem; transition:transform 0.25s ease}
.product-card:hover .product-image{transform:scale(1.05)}
.product-card:hover .product-arrow{transform:translateX(6px)}

.why{padding:4rem 0}
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem}
.why-card{background:var(--white); padding:1rem; border-radius:8px}

.production{background:linear-gradient(180deg,var(--cream),#efe9df); padding:4rem 0}
.production-gallery img{width:100%; border-radius:8px}

.gallery{padding:4rem 0}
.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0.75rem}
.gallery-item{width:100%; display:block; border-radius:6px; object-fit:cover}

.contact{padding:4rem 0}
.contact-grid{display:grid; grid-template-columns:1fr 320px; gap:2rem}
.contact-form .form-row{margin-bottom:.75rem}
.contact-form input,.contact-form select,.contact-form textarea{width:100%; padding:.6rem; border:1px solid #ddd; border-radius:6px}
.form-actions{margin-top:.5rem}
.form-message{margin-top:.75rem; padding:.6rem; background:rgba(122,160,122,0.12); border-radius:6px}

.contact-float{position:fixed; right:1rem; bottom:1rem; background:var(--accent); color:var(--white); border:none; padding:.9rem 1rem; border-radius:999px; box-shadow:0 6px 18px rgba(0,0,0,0.15); z-index:900}
.whatsapp-float{position:fixed; right:1rem; bottom:5.5rem; background:var(--dark-olive); color:var(--white); border:none; padding:.75rem 1rem; border-radius:999px; box-shadow:0 6px 18px rgba(0,0,0,0.12); font-weight:600; display:flex; align-items:center; gap:0.5rem;}
.whatsapp-icon{display:none}
@media (max-width:600px){
  .whatsapp-text{display:none}
  .whatsapp-icon{display:inline-block}
}

.site-footer{background:#f7f3ec; padding:2rem 0; margin-top:2rem}
.footer-inner{display:flex; gap:2rem; align-items:center; justify-content:space-between}

/* Modal */
.modal{position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.6); z-index:1200}
.modal[aria-hidden="false"]{display:flex}
.modal-dialog{background:var(--white); border-radius:8px; width:90%; max-width:900px; padding:1rem}
.modal-content img{width:100%; max-height:360px; object-fit:cover; border-radius:6px}
.modal-close{position:absolute; right:1rem; top:1rem; background:none; border:none; font-size:1.2rem}

/* Lightbox */
.lightbox{position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.85); z-index:1300}
.lightbox img{max-width:95%; max-height:85%}
.lightbox[aria-hidden="false"]{display:flex}
.lightbox-close{position:fixed; right:1rem; top:1rem; background:none; border:none; color:var(--white); font-size:1.4rem}

/* Responsive */
@media (max-width:900px){
  .products-grid{grid-template-columns:repeat(2,1fr)}
  .about-grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:repeat(2,1fr)}
  .contact-grid{grid-template-columns:1fr}
  .main-nav{position:fixed; right:0; top:64px; background:var(--white); width:260px; transform:translateX(110%); transition:transform .25s ease}
  .main-nav.open{transform:translateX(0)}
  .nav-toggle{display:block}
  .main-nav ul{flex-direction:column}
}
@media (max-width:600px){
  .products-grid{grid-template-columns:1fr}
  .hero h1{font-size:1.4rem}
  .hero-overlay{padding:3rem 0}
  .contact-float{padding:.7rem .9rem}
  .whatsapp-float{right:1rem; bottom:6.8rem}
}
