/* ============================================================
   Süblifab Storefront Stylesheet
   Üretici: digixystudio — Yaratıcı Üretici
   Geliştirici: Yasin Volkan Keçecioğlu — 0535 844 88 20
   ============================================================ */
*{box-sizing:border-box}
:root{--u:min(2px,0.13624vw);--navy:#064577;--blue:#087db8;--cyan:#00a6d4;--pink:#e72e91;--orange:#ff7e2b;--ink:#0a4776;--soft:#f3f9fc;--line:#e6eef3}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:#0b4774;font-family:Arial,Helvetica,sans-serif;font-size:calc(9 * var(--u));}
button,input{font:inherit}
button{cursor:pointer}
a{color:inherit}
.site{width:100%;max-width:1468px;margin:0 auto;background:#fff;overflow:hidden;}
.topbar{height:calc(19 * var(--u));background:#06406f;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 calc(10 * var(--u));font-size:calc(7.3 * var(--u));font-weight:600;line-height:1;white-space:nowrap;}
.top-left,.top-mid,.top-right{display:flex;align-items:center;gap:calc(5 * var(--u));}
.topbar .mini{font-size:calc(10 * var(--u));}
.social{display:flex;align-items:center;gap:calc(7 * var(--u));font-weight:700;font-size:calc(9 * var(--u));}
.main-header{height:calc(64 * var(--u));display:flex;align-items:center;gap:calc(11 * var(--u));padding:0 calc(8 * var(--u));background:#fff;}
.brand{display:block;width:calc(197 * var(--u));height:calc(54 * var(--u));object-fit:contain;flex:0 0 auto;}
.search{height:calc(30 * var(--u));border:1px solid #e4ebf0;border-radius:calc(18 * var(--u));display:flex;align-items:center;overflow:hidden;background:#f7f9fb;flex:1;min-width:0;max-width:calc(320 * var(--u));margin-left:calc(2 * var(--u));}
.search input{border:0;outline:0;background:transparent;padding:0 calc(14 * var(--u));width:100%;min-width:0;color:#355d7c;font-size:calc(8 * var(--u));height:100%;}
.search input::placeholder{color:#8a9dac;opacity:1}
.search button{height:100%;width:calc(41 * var(--u));flex:0 0 calc(41 * var(--u));border:0;background:#064577;color:#fff;font-size:calc(15 * var(--u));}
.head-action{display:flex;align-items:center;gap:calc(6 * var(--u));font-size:calc(8 * var(--u));white-space:nowrap;color:#244f72;text-decoration:none;}
.head-action .symbol{font-size:calc(21 * var(--u));line-height:1;color:#144c7b;}
.account{margin-left:auto;}
.cart-head{padding-left:calc(7 * var(--u));}
.cart-bubble{display:inline-flex;align-items:center;justify-content:center;background:#ed3286;color:#fff;border-radius:99px;min-width:calc(12 * var(--u));height:calc(12 * var(--u));font-size:calc(7 * var(--u));margin-left:calc(-9 * var(--u));align-self:flex-start;}
.nav{height:calc(38 * var(--u));display:grid;grid-template-columns:calc(140 * var(--u)) repeat(7,minmax(0,1fr));background:linear-gradient(180deg,#0879b5,#064574);color:#fff;border-radius:calc(7 * var(--u));overflow:hidden;}
.nav a{color:#fff;text-decoration:none;display:flex;justify-content:center;align-items:center;text-align:center;padding:0 calc(4 * var(--u));font-size:calc(7.15 * var(--u));font-weight:700;line-height:1.15;text-transform:uppercase;border-left:1px solid rgba(255,255,255,.14);}
.nav a:hover{background:rgba(255,255,255,.12)}
.nav .allcats{justify-content:flex-start;gap:calc(9 * var(--u));font-size:calc(10 * var(--u));padding-left:calc(14 * var(--u));border-left:0;white-space:nowrap;}
.hamburger{font-size:calc(18 * var(--u));font-weight:400;line-height:1;}
.hero{margin-top:calc(13 * var(--u));width:100%;height:calc(246 * var(--u));overflow:hidden;border-radius:calc(7 * var(--u));}
.hero img{width:100%;height:100%;display:block;object-fit:fill;}
.quick-row{margin-top:calc(17 * var(--u));height:calc(90 * var(--u));border-radius:calc(10 * var(--u));background:linear-gradient(180deg,#f7fbfd,#f0f7fb);display:grid;grid-template-columns:repeat(9,minmax(0,1fr));align-items:center;padding:calc(5 * var(--u)) calc(3 * var(--u));}
.quick-item{text-decoration:none;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(7 * var(--u));height:100%;color:#104b78;text-align:center;}
.quick-icon{width:calc(47 * var(--u));height:calc(47 * var(--u));border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#e3f4fb,#f3f9fd);box-shadow:inset 0 0 0 1px #edf4f8;color:#087fb7;font-size:calc(22 * var(--u));font-weight:700;overflow:hidden;}
.quick-icon img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.quick-label{font-size:calc(7.1 * var(--u));font-weight:600;white-space:nowrap;}
.category-grid{margin-top:calc(15 * var(--u));display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(8 * var(--u));}
.category-card{height:calc(191 * var(--u));min-width:0;border:1px solid #e6eef3;border-radius:calc(7 * var(--u));overflow:hidden;background:#f8fbfd;box-shadow:0 1px 3px rgba(5,67,109,.04);}
.category-card img{display:block;width:100%;height:calc(109 * var(--u));object-fit:cover;}
.category-info{height:calc(82 * var(--u));padding:calc(4 * var(--u)) calc(9 * var(--u));position:relative;}
.category-info h3{font-size:calc(12 * var(--u));line-height:1.08;margin:0 0 calc(3 * var(--u));font-weight:800;color:#064a7b;letter-spacing:-.02em;}
.category-info p{font-size:calc(8 * var(--u));line-height:1.2;color:#6f8798;margin:0;white-space:nowrap;}
.pill-link{position:absolute;left:calc(9 * var(--u));bottom:calc(8 * var(--u));height:calc(21 * var(--u));min-width:calc(61 * var(--u));border:0;border-radius:calc(14 * var(--u));padding:0 calc(9 * var(--u));background:linear-gradient(90deg,#0078b7,#064577);color:#fff;font-weight:700;font-size:calc(7 * var(--u));display:flex;align-items:center;justify-content:center;gap:calc(5 * var(--u));text-decoration:none;}
.round-arrow{position:absolute;right:calc(9 * var(--u));bottom:calc(8 * var(--u));width:calc(18 * var(--u));height:calc(18 * var(--u));border-radius:50%;background:#075587;color:#fff;display:flex;align-items:center;justify-content:center;font-size:calc(12 * var(--u));}
.section-head{height:calc(20 * var(--u));display:flex;align-items:center;justify-content:space-between;}
.section-head h2{font-size:calc(14 * var(--u));line-height:1;margin:0;color:#064a7a;font-weight:800;letter-spacing:-.025em;position:relative;}
.section-head h2:after{content:"";position:absolute;left:0;bottom:calc(-5 * var(--u));width:calc(52 * var(--u));height:calc(3 * var(--u));border-radius:99px;background:linear-gradient(90deg,#00a9db 0 35%,#ec2e91 35% 68%,#ff7e2b 68%);}
.see-all{border:0;background:none;color:#0b527f;font-size:calc(7.3 * var(--u));font-weight:700;padding:0;text-decoration:none;}
.popular{margin-top:calc(13 * var(--u));}
.popular-grid{margin-top:calc(8 * var(--u));display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:calc(7 * var(--u));}
.popular-card{height:calc(103 * var(--u));min-width:0;overflow:hidden;border-radius:calc(6 * var(--u));background:linear-gradient(145deg,#f8fbfd,#f0f6fa);border:1px solid #edf2f6;display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#0b4a78;}
.popular-card img{width:100%;height:calc(63 * var(--u));object-fit:contain;display:block;}
.popular-card span{font-size:calc(7.4 * var(--u));font-weight:700;text-align:center;margin:auto calc(2 * var(--u)) calc(7 * var(--u));white-space:nowrap;}
.products{margin-top:calc(11 * var(--u));}
.products-head{height:calc(24 * var(--u));display:flex;align-items:center;justify-content:space-between;gap:calc(5 * var(--u));}
.products-head h2{font-size:calc(14 * var(--u));line-height:1;margin:0;color:#064a7a;font-weight:800;letter-spacing:-.025em;white-space:nowrap;position:relative;}
.products-head h2:after{content:"";position:absolute;left:0;bottom:calc(-5 * var(--u));width:calc(52 * var(--u));height:calc(3 * var(--u));border-radius:99px;background:linear-gradient(90deg,#00a9db 0 35%,#ec2e91 35% 68%,#ff7e2b 68%);}
.tabs{display:flex;align-items:center;justify-content:flex-end;gap:calc(3 * var(--u));min-width:0;}
.tab{height:calc(18 * var(--u));border:1px solid #e8eef2;border-radius:calc(12 * var(--u));background:#f5f8fa;padding:0 calc(11 * var(--u));color:#68849a;font-size:calc(6.8 * var(--u));white-space:nowrap;}
.tab.active{background:#064577;color:#fff;border-color:#064577;}
.product-grid{margin-top:calc(4 * var(--u));padding:0 calc(3 * var(--u));display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:calc(5 * var(--u));}
.product-card{height:calc(144 * var(--u));position:relative;min-width:0;border:1px solid #e7edf1;border-radius:calc(6 * var(--u));background:#fff;overflow:hidden;padding:0 calc(3 * var(--u));box-shadow:0 1px 3px rgba(10,70,112,.05);}
.product-image{display:block;width:100%;height:calc(74 * var(--u));margin-top:calc(7 * var(--u));object-fit:fill;}
.product-info{position:relative;padding:calc(2 * var(--u)) calc(3 * var(--u)) 0;}
.product-title{height:calc(23 * var(--u));margin:0;color:#315c7c;font-size:calc(7.2 * var(--u));font-weight:600;line-height:1.18;overflow:hidden;}
.rating{height:calc(9 * var(--u));font-size:calc(7.4 * var(--u));line-height:1;color:#f5a61b;white-space:nowrap;letter-spacing:-.05em;}
.rating small{font-size:calc(6 * var(--u));color:#7290a5;letter-spacing:0;}
.price{color:#064a7b;font-size:calc(9.1 * var(--u));font-weight:800;line-height:1.1;margin-top:calc(1 * var(--u));white-space:nowrap;}
.add-cart{position:absolute;right:calc(3 * var(--u));bottom:calc(4 * var(--u));border:0;border-radius:calc(4 * var(--u));background:#075587;color:white;width:calc(17 * var(--u));height:calc(17 * var(--u));font-size:calc(11 * var(--u));line-height:1;display:flex;align-items:center;justify-content:center;text-decoration:none;}
.benefits{margin-top:calc(7 * var(--u));height:calc(54 * var(--u));}
.benefits img{display:block;width:100%;height:100%;object-fit:fill;}
.footer{min-height:calc(37 * var(--u));margin-top:calc(7 * var(--u));background:linear-gradient(100deg,#064777,#073f75 60%,#072f62);display:flex;align-items:center;padding:0 calc(7 * var(--u));color:#fff;gap:calc(13 * var(--u));}
.footer-logo{width:calc(130 * var(--u));height:calc(34 * var(--u));object-fit:contain;flex:0 0 auto;}
.footer-links{display:flex;align-items:center;gap:calc(12 * var(--u));margin:auto;font-size:calc(6.9 * var(--u));white-space:nowrap;flex-wrap:wrap;justify-content:center;}
.footer-links a{color:#dbeaf4;text-decoration:none;}
.footer-social{display:flex;gap:calc(8 * var(--u));align-items:center;font-size:calc(10 * var(--u));font-weight:bold;white-space:nowrap;}
.empty-state{display:none;grid-column:1/-1;padding:24px;text-align:center;color:#668198;font-size:14px;}
/* Mobil uyum kuralları store.css içindedir */
