/* Karabıyık Gıda - Minimal, responsive, mobile-first stylesheet */
:root{--bg:#ffffff;--text:#0f172a;--muted:#475569;--primary:#b91c1c;--accent:#ef4444;--light:#fef2f2;--border:#e2e8f0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--text);background:var(--bg);line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--primary);text-decoration:none}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1rem}
.grid{display:grid;gap:1.25rem}
.section{padding:3rem 0}
.button{display:inline-block;background:var(--primary);color:#fff;padding:.75rem 1rem;border-radius:.5rem;font-weight:600;border:1px solid transparent}
.button.secondary{background:#fff;color:var(--primary);border-color:var(--primary)}
.button.ghost{background:transparent;color:var(--primary);border:1px solid var(--border)}
.tag{display:inline-block;padding:.25rem .5rem;border:1px solid var(--border);border-radius:999px;font-size:.75rem;color:var(--muted)}
.badge{background:var(--accent);color:#002244;padding:.25rem .5rem;border-radius:.375rem;font-weight:700;font-size:.75rem}

/* Header */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:.5rem;font-weight:800;color:var(--primary)}
.brand .logo{width:100px;height:100px;border-radius:.5rem;display:block;object-fit:contain}
.menu{display:flex;gap:1rem;align-items:center}
.menu a{color:var(--text);font-weight:600;padding:.5rem .75rem;border-radius:.375rem}
.menu a:hover,.menu a.active{background:var(--light)}
.dropdown{position:relative}
.dropdown > a{display:inline-block}
.dropdown-menu{display:none;position:absolute;top:calc(100% + 8px);left:0;min-width:260px;max-height:60vh;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:.75rem;box-shadow:0 18px 48px rgba(0,0,0,.12);padding:.5rem;z-index:80}
.dropdown-menu a{display:block;color:var(--text);font-weight:600;padding:.5rem .75rem;border-radius:.5rem;white-space:nowrap}
.dropdown-menu a:hover{background:var(--light)}
.dropdown:hover .dropdown-menu,.dropdown:focus-within .dropdown-menu,.dropdown.open .dropdown-menu{display:block}
.nav-actions{display:flex;gap:.5rem;align-items:center}
.burger{display:none;background:transparent;border:0;font-size:1.5rem}

/* Mobile nav */
@media (max-width: 768px){
  .burger{display:block}
  .menu{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);padding:.5rem}
  .menu.open{display:flex;flex-direction:column;gap:.25rem}
  .brand .logo{width:80px;height:80px}
  .menu.open .dropdown{width:100%}
  .menu.open .dropdown-menu{display:block;position:static;top:auto;left:auto;min-width:0;max-height:none;box-shadow:none;border:0;padding:0 0 .25rem 0;margin:0}
  .menu.open .dropdown-menu a{padding:.5rem .75rem .5rem 1.25rem}
}

/* Hero */
.hero{display:grid;align-items:center;min-height:64vh;background:linear-gradient(180deg,#f8fbff,transparent)}
.hero h1{font-size:clamp(2rem,4vw,3rem);line-height:1.2;margin:.25rem 0}
.hero p{color:var(--muted);max-width:60ch}
.hero-cta{display:flex;gap:.75rem;margin-top:1rem;flex-wrap:wrap}

/* Slider (minimal, CSS assisted) */
.slider{position:relative;overflow:hidden;border-radius:1rem;background:#000}
.slides{display:flex;transition:transform .6s ease}
.slide{min-width:100%;position:relative;color:#fff;height:420px}
.slide::after{content:"";position:absolute;inset:0;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:.22;pointer-events:none;z-index:1}
.slides > .slide:nth-child(1)::after{background-image:url("../images/webslider (922 x 420 piksel).png")}
.slides > .slide:nth-child(2)::after{background-image:url("../images/webslider (922 x 420 piksel) (1).png")}
.slide img{position:relative;z-index:0;display:none}
.slide .caption{position:absolute;inset:auto auto 10% 5%;max-width:600px;z-index:2}
@media (max-width: 768px){
  .slides > .slide:nth-child(1)::after{background-image:url("../images/mobilslider.png")}
  .slides > .slide:nth-child(2)::after{background-image:url("../images/mobilslider (1).png")}
}
/* slide visuals come from ::after backgrounds; <img> is hidden */
.slider .dots{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;gap:.5rem}
.slider .dot{width:10px;height:10px;border-radius:999px;background:#ffffff80;border:1px solid #fff;cursor:pointer}
.slider .dot.active{background:#fff}

/* Sections */
.section-title{font-size:1.75rem;margin:0 0 .5rem 0}
.section-sub{color:var(--muted);margin:0 0 1.25rem 0}
.cards{grid-template-columns:repeat(12,1fr)}
.card{grid-column:span 12;background:#fff;border:1px solid var(--border);border-radius:.75rem;overflow:hidden}
.card .body{padding:1rem}
.card h3{margin:.25rem 0}
.card p{color:var(--muted)}

/* Partners */
.partners{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;align-items:center;opacity:.9}
.partner{background:#fff;border:1px solid var(--border);border-radius:.5rem;padding:1rem;text-align:center}

/* Partners slider (marquee) */
.partners-slider{overflow:hidden;border:1px solid var(--border);border-radius:.75rem;background:#fff;padding:.75rem}
.partners-row{display:flex;align-items:center;gap:2.5rem;min-width:max-content;animation:partners-scroll 30s linear infinite}
.partners-row:hover{animation-play-state:paused}
.partner-logo{flex:0 0 auto;opacity:.9;transition:opacity .2s ease}
.partner-logo:hover{opacity:1}
.partner-logo img{height:44px;width:auto;object-fit:contain;filter:grayscale(20%);}
@media (min-width:1024px){.partner-logo img{height:56px}}
@keyframes partners-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)} }

/* Products */
.filters{display:flex;gap:.5rem;flex-wrap:wrap}
.products{grid-template-columns:repeat(1,minmax(0,1fr))}
.product{background:#fff;border:1px solid var(--border);border-radius:.85rem;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;cursor:pointer;position:relative;box-shadow:0 2px 8px rgba(0,0,0,0.06)}
.product:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(0,0,0,0.12);border-color:var(--primary)}
.product img{width:100%;height:160px;object-fit:cover;transition:transform .2s ease}
.product:hover img{transform:scale(1.05)}
.product .body{padding:1rem;background:linear-gradient(to bottom,#ffffff,#fafafa)}
.product h3{font-size:1rem;margin:0 0 .5rem 0;color:var(--text);font-weight:700;line-height:1.25}
.product .muted{color:var(--muted);font-size:.9rem;margin:0;font-weight:500}
.product .meta{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.product .tag{background:var(--light);color:var(--primary);border-color:var(--primary);font-weight:600;transition:all .2s ease}
.product .tag:hover{background:var(--primary);color:#fff}

@media (min-width:640px){
  .products{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product img{height:170px}
}
@media (min-width:1024px){
  .products{grid-template-columns:repeat(4,minmax(0,1fr))}
  .product img{height:180px}
}

/* Search and filter enhancements */
.search-wrapper{position:relative}
.search-wrapper input:focus{outline:none;box-shadow:0 0 0 3px rgba(185,28,28,0.1);border-color:var(--primary)}
.search-wrapper input::placeholder{color:var(--muted)}
#searchResults{animation:fadeIn 0.3s ease}
#resultCount{font-weight:500}

/* Product visibility transitions */
.product[style*="display: none"]{opacity:0;transform:scale(0.9)}
.product[style=""], .product:not([style]){opacity:1;transform:scale(1);transition:opacity 0.3s ease,transform 0.3s ease}

@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}

/* Services page */
.list{display:grid;gap:1rem}
.list-item{background:#fff;border:1px solid var(--border);border-radius:.75rem;padding:1rem}

/* Footer */
.footer{background:#3b0d0d;color:#fde2e2}
.footer a{color:#ffe4e6}
.footer-top{display:grid;gap:1.5rem;grid-template-columns:repeat(12,1fr)}
.footer-col{grid-column:span 12}
.footer-bottom{border-top:1px solid #7f1d1d;margin-top:1rem;padding-top:1rem;font-size:.9rem;color:#fecaca}
.social{display:flex;gap:.5rem}
.social a{width:36px;height:36px;border:1px solid #7f1d1d;border-radius:.5rem;display:grid;place-items:center}

/* Forms */
.input,textarea{width:100%;padding:.75rem;border:1px solid var(--border);border-radius:.5rem;background:#fff}
label{font-weight:600}
.form-grid{display:grid;gap:1rem;grid-template-columns:repeat(12,1fr)}
.form-grid .col-6{grid-column:span 12}

/* Utilities */
.muted{color:var(--muted)}
.center{text-align:center}
.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}
.mb-0{margin-bottom:0}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}
.py-0{padding-top:0;padding-bottom:0}

/* Responsive */
@media (min-width:640px){
  .card{grid-column:span 6}
  .product{grid-column:auto}
  .partners{grid-template-columns:repeat(3,1fr)}
  .form-grid .col-6{grid-column:span 6}
}
@media (min-width:1024px){
  .card{grid-column:span 3}
  .product{grid-column:auto}
  .partners{grid-template-columns:repeat(6,1fr)}
  .footer-col{grid-column:span 4}
}

/* Floating action buttons */
.fab{position:fixed;right:max(16px, env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));z-index:60;display:flex;flex-direction:column;gap:.6rem}
.fab-btn{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.15);border:1px solid #00000010;background:#fff}
.fab-btn svg{width:26px;height:26px}
.fab-btn.wa{background:#25D366;border-color:#1fb157}
.fab-btn.wa svg{fill:#fff}
.fab-btn.call{background:#0ea5e9;border-color:#0284c7}
.fab-btn.call svg{fill:#fff}
.fab-btn:hover{transform:translateY(-2px)}

@media (max-width:640px){
  .fab-btn{width:52px;height:52px}
  .fab{gap:.5rem}
}
