/* ==========================================================================
   İç sayfalar: İletişim, Blog, Blog Detay, SSS, Ürün listesi, Ürün detay
   roon-header.css'ten SONRA yüklenir.
   ========================================================================== */

:root { --accent: #7c7455; --card-border: rgba(0,0,0,.08); }

/* ---------- Ortak ---------- */
.page-lead { max-width: 640px; margin: 16px 0 0; font-family: var(--roon-sans); font-style: normal; font-size: 17px; line-height: 1.6; color: #555; }
.page-lead a { border-bottom: 1px solid currentColor; }

/* ==========================================================================
   İLETİŞİM
   ========================================================================== */
.contact-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px; align-items: start; }
.contact-info { display: flex; flex-direction: column; gap: 14px; }
.contact-info .find-card small { color: #888; }
.contact-form-card { padding: 38px; background: #fff; border: 1px solid var(--card-border); border-radius: 22px; box-shadow: 0 10px 34px rgba(0,0,0,.04); }
.contact-form-card h2 { margin: 0 0 6px; font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: 26px; text-transform: none; }
.contact-form-lead { margin: 0 0 26px; font-family: var(--roon-sans); font-style: normal; font-size: 15px; color: #666; }
.cf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 26px; }
.cf-full { grid-column: 1 / -1; }
.cf-field { display: block; }
.cf-field span { display: block; margin-bottom: 7px; font-family: var(--roon-sans); font-style: normal; font-size: 13px; font-weight: 600; color: #333; }
.cf-field input, .cf-field textarea {
    display: block; width: 100%; padding: 13px 16px;
    font: 400 15px/1.4 var(--roon-sans); font-style: normal; color: #111;
    background: #faf9f7; border: 1px solid #e0ddd6; border-radius: 12px; outline: none;
    transition: border-color .2s, background .2s, box-shadow .2s;
}
.cf-field textarea { min-height: 150px; resize: vertical; }
.cf-field input:focus, .cf-field textarea:focus { background: #fff; border-color: #111; box-shadow: 0 0 0 3px rgba(17,17,17,.06); }
.cf-submit {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 180px; height: 52px; padding: 0 34px;
    font: 600 15px var(--roon-sans); font-style: normal; color: #fff;
    background: #111; border: 1px solid #111; border-radius: 30px; cursor: pointer;
    transition: background .2s, transform .2s;
}
.cf-submit:hover { background: #333; transform: translateY(-1px); }

.contact-map { margin-top: 64px; }
.contact-map-head { max-width: 760px; margin-bottom: 24px; }
.contact-map-head h2 { margin: 0 0 8px; font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: clamp(24px, 3vw, 34px); text-transform: none; }
.contact-map-head p { margin: 0; font-family: var(--roon-sans); font-style: normal; font-size: 15px; line-height: 1.65; color: #555; }
.contact-map-frame { position: relative; height: 440px; overflow: hidden; border-radius: 22px; border: 1px solid var(--card-border); box-shadow: 0 10px 30px rgba(0,0,0,.06); }
.contact-map-frame iframe { position: absolute; inset: 0; width: 100% !important; height: 100% !important; border: 0; }

/* ==========================================================================
   BLOG LİSTE
   ========================================================================== */
.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.post-card { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid var(--card-border); border-radius: 20px; transition: transform .3s, box-shadow .3s, border-color .3s; }
.post-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(0,0,0,.08); border-color: rgba(0,0,0,.18); }
.post-card-img { margin: 0; border-radius: 0; }
.post-card-img img { aspect-ratio: 16 / 10; }
.post-card h2 { margin: 20px 22px 10px; font-size: 19px; line-height: 1.35; text-transform: none; }
.post-card p { margin: 0 22px 18px; opacity: 1; color: #555; }
.post-card .link-underline { margin: auto 22px 22px; padding: 0; border: 0; font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: 14px; color: var(--accent); }
.post-card .link-underline::after { content: " \2192"; transition: margin-left .2s; }
.post-card:hover .link-underline::after { margin-left: 4px; }

/* ==========================================================================
   BLOG DETAY
   ========================================================================== */
.post-page .page-head, .post-hero, .post-body, .post-foot { max-width: 880px; margin-left: auto; margin-right: auto; }
.post-page .page-title { font-size: clamp(28px, 3.6vw, 44px); }
.post-hero { margin-top: 0; margin-bottom: 30px; }
.post-hero img { display: block; width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: 22px; box-shadow: 0 14px 40px rgba(0,0,0,.1); }
.post-body { padding: 40px 46px; background: #fff; border: 1px solid var(--card-border); border-radius: 22px; box-shadow: 0 10px 34px rgba(0,0,0,.04); }
.post-body .prose { max-width: none; font-size: 17px; line-height: 1.85; color: #2a2a2a; }
.post-body .prose p { margin: 0 0 22px; }
.post-body .prose h2, .post-body .prose h3 { margin: 38px 0 14px; padding-top: 22px; border-top: 1px solid var(--card-border); font-size: 23px !important; }
.post-body .prose ul { list-style: none; margin: 0 0 22px; padding: 0; }
.post-body .prose ul li { position: relative; padding-left: 26px; margin-bottom: 10px; }
.post-body .prose ul li::before { content: ""; position: absolute; left: 4px; top: .72em; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.post-body .prose img { border-radius: 16px; }
.post-foot { margin-top: 24px; }
.post-back { display: inline-flex; align-items: center; gap: 8px; padding: 11px 22px; font-family: var(--roon-sans); font-style: normal; font-size: 14px; font-weight: 500; color: #111; border: 1px solid #111; border-radius: 30px; transition: background .2s, color .2s; }
.post-back:hover { background: #111; color: #fff; }
.post-cta-wrap { padding-top: 0; padding-bottom: 70px; }
.post-cta-wrap .kurumsal-cta { margin-top: 20px; max-width: 880px; margin-left: auto; margin-right: auto; }

/* ==========================================================================
   SSS
   ========================================================================== */
.faq-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 32px; align-items: start; }
.faq { max-width: none; }
.faq.accordion { margin-top: 0; }
.faq .acc-item, .faq .acc-item:first-child, .faq .acc-item:last-child { margin-bottom: 12px; background: #fff; border: 1px solid var(--card-border); border-radius: 16px; transition: border-color .2s, box-shadow .2s; }
.faq .acc-item:hover { border-color: rgba(0,0,0,.2); }
.faq .acc-item.open { border-color: #111; box-shadow: 0 10px 28px rgba(0,0,0,.06); }
.faq .acc-head { width: 100%; padding: 20px 24px; gap: 18px; font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: 17px; line-height: 1.4; text-transform: none; text-align: left; }
.faq .acc-icon { position: relative; flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; background: #f3f1ec; transition: background .2s; }
.faq .acc-icon::before, .faq .acc-icon::after { content: ""; position: absolute; left: 50%; top: 50%; right: auto; width: 12px; height: 1.6px; margin: -.8px 0 0 -6px; background: #111; transition: transform .25s, background .2s; }
.faq .acc-icon::after { transform: rotate(90deg); }
.faq .acc-item.open .acc-icon { background: #111; }
.faq .acc-item.open .acc-icon::before, .faq .acc-item.open .acc-icon::after { background: #fff; }
.faq .acc-item.open .acc-icon::after { transform: rotate(0); }
.faq .acc-body { padding: 0 24px 22px; font-size: 15.5px; line-height: 1.75; color: #444; }
.faq .acc-body, .faq .acc-body * { font-family: var(--roon-sans) !important; font-style: normal !important; }

.faq-help { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 12px; padding: 30px; background: #111; color: #fff; border-radius: 22px; }
.faq-help h2 { margin: 0; font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: 22px; line-height: 1.3; text-transform: none; color: #fff; }
.faq-help p { margin: 0 0 8px; font-family: var(--roon-sans); font-style: normal; font-size: 15px; line-height: 1.6; color: #bbb; }
.faq-help .find-btn { justify-content: center; }
.faq-help .find-btn:not(.find-btn-solid) { border-color: #fff; color: #fff; }
.faq-help .find-btn:not(.find-btn-solid):hover { background: #fff; color: #111; }

/* ==========================================================================
   ÜRÜN LİSTESİ
   ========================================================================== */
.shop.page { padding: 36px var(--gutter) 90px; }
.shop-head { max-width: none; margin-bottom: 40px; }
.shop-title { font-size: clamp(30px, 4vw, 50px); font-weight: 600; line-height: 1.15; }
.shop-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 32px; align-items: start; }
.shop-sidebar { position: sticky; top: 90px; padding: 20px; background: #fff; border: 1px solid var(--card-border); border-radius: 18px; }
.shop-sidebar .side-title { margin: 0 0 10px; padding: 0 12px; border: 0; font-family: var(--roon-sans); font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.shop-sidebar .side-cats { gap: 2px; margin: 0; }
.shop-sidebar .side-cats a { display: block; padding: 10px 14px; border: 0 !important; border-radius: 10px; font-family: var(--roon-sans); font-style: normal; font-size: 15px; color: #222; transition: background .2s, color .2s; }
.shop-sidebar .side-cats a:hover { background: rgba(124,116,85,.1); }
.shop-sidebar .side-cats a.active { background: #111; color: #fff; }
.shop-toolbar { margin-bottom: 18px; }
.shop-toolbar .serif { display: inline-block; padding: 7px 16px; font-family: var(--roon-sans); font-style: normal; font-size: 13px; font-weight: 500; color: #555; background: #fff; border: 1px solid var(--card-border); border-radius: 30px; }

.shop-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.shop-grid .product, .related .product { margin: 0; padding: 10px 10px 16px; background: #fff; border: 1px solid var(--card-border); border-radius: 18px; transition: transform .3s, box-shadow .3s, border-color .3s; }
.shop-grid .product:hover, .related .product:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(0,0,0,.08); border-color: rgba(0,0,0,.18); }
.shop-grid .product-img, .related .product-img { border: 0; border-radius: 12px; background: #f7f6f3; box-shadow: none !important; }
.shop-grid .product-img img { aspect-ratio: 1; object-fit: contain; }
.shop-grid .product:hover .product-img, .related .product:hover .product-img { border: 0; box-shadow: none; }
.shop-grid .product h3, .related .product h3 { margin: 14px 8px 4px; font-family: var(--roon-sans); font-size: 14.5px; font-weight: 600; line-height: 1.35; text-transform: none; }
.shop-grid .product .price, .related .product .price { margin: 0 8px; font-family: var(--roon-sans); font-style: normal; font-size: 13px; color: #888; }
.empty { padding: 50px 0; font-family: var(--roon-sans); font-style: normal; }

/* ==========================================================================
   ÜRÜN DETAY
   ========================================================================== */
.pdp { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 36px; max-width: 1280px; padding: 30px var(--gutter) 70px; }
.pdp-crumbs { margin-bottom: 18px; }
.pdp-main { padding: 18px; background: #fff; border: 1px solid var(--card-border); border-radius: 22px; box-shadow: 0 10px 34px rgba(0,0,0,.04); }
.pdp .pdp-main img { display: block; width: 100%; max-height: 620px; aspect-ratio: 1; object-fit: contain; background: #fff; border: 0; border-radius: 12px; }
.pdp-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 10px; margin-top: 14px; }
.pdp .pdp-thumbs button { width: auto; padding: 4px; background: #fff; border: 1px solid var(--card-border); border-radius: 12px; opacity: .75; transition: opacity .2s, border-color .2s; }
.pdp .pdp-thumbs button.active, .pdp .pdp-thumbs button:hover { opacity: 1; border-color: #111; }
.pdp .pdp-thumbs img { aspect-ratio: 1; object-fit: contain; background: #f7f6f3; border-radius: 8px; }

.pdp-info { position: sticky; top: 100px; padding: 34px; background: #fff; border: 1px solid var(--card-border); border-radius: 22px; box-shadow: 0 10px 34px rgba(0,0,0,.04); }
.pdp-title { margin: 0 0 8px; font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: clamp(26px, 2.8vw, 36px); line-height: 1.2; letter-spacing: -.01em; text-transform: none; overflow-wrap: anywhere; }
.pdp-code { margin: 0 0 22px; padding-bottom: 20px; font-family: var(--roon-sans); font-style: normal; font-size: 14px; color: #777; border-bottom: 1px solid var(--card-border); }
.pdp-code strong { color: #111; font-weight: 600; }
.pdp .pdp-desc { margin-bottom: 26px; font-size: 15px; line-height: 1.7; color: #333; }
.pdp .pdp-desc ul li { margin-bottom: 8px; }
.pdp-actions { display: flex; flex-direction: column; gap: 10px; }
.pdp .pdp-info .btn { height: 52px; width: 100%; border-radius: 30px; font-family: var(--roon-sans); font-style: normal; font-size: 15px; font-weight: 600; transition: background .2s, color .2s, transform .2s; }
.pdp .pdp-info .pdp-wa { background: #25d366; border: 1px solid #25d366; color: #fff; }
.pdp .pdp-info .pdp-wa:hover { background: #1faa55; border-color: #1faa55; transform: translateY(-1px); }
.pdp .pdp-info .pdp-form { margin-top: 10px; }
.pdp-badges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 24px 0 0; padding: 20px 0 0; border-top: 1px solid var(--card-border); list-style: none; }
.pdp-badges li { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; font-family: var(--roon-sans); font-style: normal; font-size: 12.5px; line-height: 1.3; color: #444; }
.pdp-badges i { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #f3f1ec; color: var(--accent); font-size: 16px; }

.related { max-width: 1280px; margin: 0 auto; padding: 20px var(--gutter) 80px; }
.related .h-lg { margin-bottom: 26px; font-family: var(--roon-sans); font-weight: 600; font-size: clamp(22px, 2.6vw, 30px); text-transform: none; letter-spacing: -.01em; }

/* Talep formu penceresi */
.popup { background: #fff !important; border: 0 !important; border-radius: 22px !important; box-shadow: 0 30px 80px rgba(0,0,0,.3); padding: 32px !important; max-height: calc(100vh - 32px); overflow-y: auto; }
.popup h2 { text-transform: none !important; font-size: 24px !important; }
.popup hr { border-top-color: var(--card-border) !important; }
.popup .form-control { padding: 12px 14px !important; background: #faf9f7 !important; border: 1px solid #e0ddd6 !important; border-radius: 12px !important; outline: none; }
.popup .form-control:focus { border-color: #111 !important; background: #fff !important; }
.popup .btn { height: 48px !important; border-radius: 30px !important; }

/* ==========================================================================
   MOBİL
   ========================================================================== */
@media (max-width: 1100px) {
    .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .faq-layout { grid-template-columns: minmax(0, 1fr) 300px; }
}
@media (max-width: 900px) {
    .contact-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .contact-form-card { padding: 26px 20px; border-radius: 18px; }
    .cf-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .cf-submit { width: 100%; }
    .contact-map { margin-top: 40px; }
    .contact-map-frame { height: 320px; border-radius: 18px; }

    .post-body { padding: 26px 20px; border-radius: 18px; }
    .post-hero img { aspect-ratio: 16 / 10; border-radius: 16px; }
    .post-cta-wrap { padding-bottom: 50px; }

    .faq-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .faq-help { position: static; padding: 24px; border-radius: 18px; }
    .faq .acc-head { padding: 16px 18px; font-size: 16px; }
    .faq .acc-body { padding: 0 18px 18px; }

    .shop-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
    .shop-sidebar { position: static; display: block; padding: 10px; border-radius: 14px; }
    .shop-sidebar .side-title { display: none; }
    .shop-sidebar .side-cats { flex-direction: row; gap: 6px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .shop-sidebar .side-cats li { flex: 0 0 auto; }
    .shop-sidebar .side-cats a { white-space: nowrap; padding: 9px 16px; border: 1px solid rgba(0,0,0,.1) !important; }
    .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .shop-grid .product { padding: 8px 8px 14px; border-radius: 14px; }
    .shop-grid .product h3 { margin: 12px 4px 4px; font-size: 13.5px; }
    .shop-grid .product .price { margin: 0 4px; }

    .pdp { padding: 18px 14px 40px; }
    .pdp-main { padding: 10px; border-radius: 16px; }
    .pdp-info { position: static !important; padding: 22px 18px; border-radius: 18px; }
    .related { padding: 10px 14px 60px; }
    .pdp-badges { gap: 6px; }
    .popup { padding: 22px !important; }
}
@media (max-width: 600px) {
    .post-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}

/* ==========================================================================
   ANA SAYFA: Son Eklenen Ürünler
   ========================================================================== */
.latest { max-width: 1400px; margin: 0 auto; padding: 70px var(--gutter) 60px; }
.latest-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 34px; }
.latest-kicker { display: inline-block; margin-bottom: 10px; padding: 5px 14px; font: 600 12px var(--roon-sans); font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); background: rgba(124,116,85,.12); border-radius: 30px; }
.latest-title { margin: 0; font-family: var(--roon-sans); font-style: normal; font-weight: 700; font-size: clamp(28px, 3.8vw, 50px); line-height: 1.1; letter-spacing: -.02em; text-transform: none; }
.latest-lead { margin: 10px 0 0; font-family: var(--roon-sans); font-style: normal; font-size: 16px; color: #666; }
.latest-all { display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; font: 600 14px var(--roon-sans); font-style: normal; color: #111; border: 1px solid #111; border-radius: 30px; transition: background .2s, color .2s; }
.latest-all:hover { background: #111; color: #fff; }

.latest-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.latest-grid .product { position: relative; display: flex; flex-direction: column; margin: 0; padding: 12px 12px 18px; background: #fff; border: 1px solid var(--card-border); border-radius: 20px; transition: transform .3s, box-shadow .3s, border-color .3s; }
.latest-grid .product:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(0,0,0,.09); border-color: rgba(0,0,0,.18); }
.latest-grid .product-img { position: relative; border: 0; border-radius: 14px; background: #f7f6f3; overflow: hidden; box-shadow: none !important; }
.latest-grid .product-img img { aspect-ratio: 1; object-fit: contain; padding: 8px; }
.latest-grid .product:hover .product-img { border: 0; box-shadow: none; }
.badge-new { position: absolute; top: 12px; left: 12px; z-index: 2; padding: 5px 12px; font: 600 11px var(--roon-sans); font-style: normal; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: #111; border-radius: 30px; }
.latest-grid .product h3 { margin: 16px 8px 4px; font-family: var(--roon-sans); font-size: 16px; font-weight: 600; line-height: 1.35; text-transform: none; }
.latest-grid .product .price { margin: 0 8px; font-family: var(--roon-sans); font-style: normal; font-size: 13px; color: #888; }
.product-more { display: inline-flex; align-items: center; gap: 6px; margin: 14px 8px 0; font: 600 13.5px var(--roon-sans); font-style: normal; color: var(--accent); }
.product-more span { transition: transform .25s; }
.latest-grid .product:hover .product-more span { transform: translateX(4px); }

@media (max-width: 1100px) { .latest-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) {
    .latest { padding: 46px 14px 40px; }
    .latest-head { margin-bottom: 22px; }
    .latest-all { padding: 10px 18px; font-size: 13px; }
    .latest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .latest-grid .product { padding: 8px 8px 14px; border-radius: 16px; }
    .latest-grid .product h3 { margin: 12px 4px 4px; font-size: 14px; }
    .latest-grid .product .price { margin: 0 4px; }
    .product-more { margin: 10px 4px 0; font-size: 13px; }
    .badge-new { top: 8px; left: 8px; padding: 4px 10px; font-size: 10px; }
}

/* Ortalanmış açıklamalar (ana sayfa başlıkları) */
.page-lead.center { margin-left: auto; margin-right: auto; text-align: center; }

/* Kategori kartları (mobil): başlık ve buton düzgün sığsın */
@media (max-width: 900px) {
    .category-card { padding: 8px; border-radius: 16px; }
    .category-label { padding: 10px 4px 6px; gap: 8px; }
    .category-name { font-size: 14px; line-height: 1.3; overflow-wrap: anywhere; }
    .category-cta { align-self: flex-start; white-space: nowrap; padding: 6px 12px; font-size: 12.5px; }
}

/* Kategori kenar çubuğu: ürün sayısı */
.shop-sidebar .side-cats a { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.side-count { flex: 0 0 auto; min-width: 28px; padding: 2px 9px; font: 600 12px var(--roon-sans); font-style: normal; text-align: center; color: #666; background: #f1efea; border-radius: 30px; transition: background .2s, color .2s; }
.shop-sidebar .side-cats a:hover .side-count { background: #fff; }
.shop-sidebar .side-cats a.active .side-count { background: rgba(255,255,255,.2); color: #fff; }

/* ==========================================================================
   ANA SAYFA: Banner slider
   ========================================================================== */
.hero-slider { position: relative; overflow: hidden; background: #ebe6df; min-height: 100%; }
.hero-slider .hero-slide { position: absolute; inset: 0; height: auto !important; opacity: 0; visibility: hidden; z-index: 0; transition: opacity .9s ease, visibility .9s; }
.hero-slider .hero-slide.is-active { opacity: 1; visibility: visible; z-index: 1; }
.hero-slider .hero-slide img { transform: scale(1.06); transition: transform 7s ease-out; }
.hero-slider .hero-slide.is-active img { transform: scale(1); }
.hero-slider .hero-caption { opacity: 0; transform: translateY(14px); transition: opacity .7s ease .3s, transform .7s ease .3s; }
.hero-slider .hero-slide.is-active .hero-caption { opacity: 1; transform: none; }
.hero-title { font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: clamp(26px, 2.5vw, 40px); line-height: 1.25; letter-spacing: -0.01em; text-transform: none; color: #fff; margin: 0 0 26px; }

.hero-arrow { position: absolute; top: 50%; z-index: 5; width: 48px; height: 48px; margin-top: -24px; display: flex; align-items: center; justify-content: center; font: 400 20px var(--roon-sans); color: #fff; background: rgba(0,0,0,.28); border: 1px solid rgba(255,255,255,.55); border-radius: 50%; cursor: pointer; backdrop-filter: blur(4px); transition: background .2s, color .2s, opacity .2s; opacity: 0; }
.hero-slider:hover .hero-arrow, .hero-arrow:focus-visible { opacity: 1; }
.hero-arrow:hover { background: #fff; color: #111; }
.hero-arrow.prev { left: 22px; }
.hero-arrow.next { right: 22px; }
.hero-dots { position: absolute; left: 0; right: 0; bottom: 20px; z-index: 5; display: flex; justify-content: center; gap: 9px; }
.hero-dot { width: 9px; height: 9px; padding: 0; background: rgba(255,255,255,.5); border: 0; border-radius: 9px; cursor: pointer; transition: width .3s, background .3s; }
.hero-dot.is-active { width: 28px; background: #fff; }
.hero-slider.is-single .hero-arrow, .hero-slider.is-single .hero-dots { display: none; }

@media (max-width: 900px) {
    .hero-slider { height: clamp(420px, 110vw, 620px); min-height: 0; }
    .hero-arrow { display: none; }
    .hero-slider .hero-caption { left: 20px; right: 20px; bottom: 54px; }
    .hero-dots { bottom: 22px; }
    .hero-title { font-size: clamp(24px, 6.5vw, 36px); margin-bottom: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .hero-slider .hero-slide, .hero-slider .hero-slide img, .hero-slider .hero-caption { transition: none; }
}

/* ==========================================================================
   ÜRÜN DETAY: galeri okları, büyütme, paylaşım, alt şerit
   ========================================================================== */
.pdp-main { position: relative; }
.pdp .pdp-main img { cursor: zoom-in; }
.pdp-nav { position: absolute; top: 50%; z-index: 3; width: 42px; height: 42px; margin-top: -21px; display: flex; align-items: center; justify-content: center; font: 400 18px var(--roon-sans); color: #111; background: rgba(255,255,255,.92); border: 1px solid var(--card-border); border-radius: 50%; box-shadow: 0 4px 14px rgba(0,0,0,.1); cursor: pointer; opacity: 0; transition: opacity .2s, background .2s, color .2s; }
.pdp-main:hover .pdp-nav, .pdp-nav:focus-visible { opacity: 1; }
.pdp-nav:hover { background: #111; color: #fff; }
.pdp-nav.prev { left: 26px; }
.pdp-nav.next { right: 26px; }
.pdp-count { position: absolute; left: 26px; bottom: 26px; z-index: 3; padding: 4px 12px; font: 500 12px var(--roon-sans); font-style: normal; color: #fff; background: rgba(0,0,0,.55); border-radius: 30px; }
.pdp-count:empty { display: none; }
.pdp-zoom { position: absolute; right: 26px; bottom: 26px; z-index: 3; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 15px; color: #111; background: rgba(255,255,255,.92); border: 1px solid var(--card-border); border-radius: 50%; cursor: pointer; transition: background .2s, color .2s; }
.pdp-zoom:hover { background: #111; color: #fff; }

.pdp-sub { margin: 0 0 12px; font-family: var(--roon-sans); font-style: normal; font-weight: 600; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.pdp-share { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--card-border); font-family: var(--roon-sans); font-style: normal; font-size: 13px; color: #666; }
.pdp-share a, .pdp-share button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 12px; font: 500 13px var(--roon-sans); font-style: normal; color: #222; background: #fff; border: 1px solid var(--card-border); border-radius: 30px; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.pdp-share a { width: 36px; padding: 0; }
.pdp-share a:hover, .pdp-share button:hover { background: #111; color: #fff; border-color: #111; }

.pdp-cta-wrap { padding-top: 0; padding-bottom: 50px; }
.pdp-cta-wrap .kurumsal-cta { margin-top: 10px; }

/* Büyütme penceresi */
.pdp-lb { position: fixed; inset: 0; z-index: 10001; display: flex; align-items: center; justify-content: center; padding: 56px 70px; background: rgba(15,14,12,.92); animation: lbFade .2s ease; }
.pdp-lb[hidden] { display: none; }
@keyframes lbFade { from { opacity: 0; } to { opacity: 1; } }
.pdp-lb img { max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.lb-close, .lb-arrow { position: absolute; display: flex; align-items: center; justify-content: center; color: #fff; background: transparent; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; cursor: pointer; transition: background .2s, color .2s; }
.lb-close:hover, .lb-arrow:hover { background: #fff; color: #111; }
.lb-close { top: 18px; right: 18px; width: 44px; height: 44px; font-size: 26px; line-height: 1; }
.lb-arrow { top: 50%; width: 48px; height: 48px; margin-top: -24px; font-size: 20px; }
.lb-prev { left: 16px; }
.lb-next { right: 16px; }

@media (max-width: 900px) {
    .pdp-nav { opacity: 1; width: 36px; height: 36px; margin-top: -18px; font-size: 16px; }
    .pdp-nav.prev { left: 16px; }
    .pdp-nav.next { right: 16px; }
    .pdp-count { left: 16px; bottom: 16px; }
    .pdp-zoom { right: 16px; bottom: 16px; }
    .pdp-cta-wrap { padding: 0 14px 40px; }
    .pdp-lb { padding: 64px 12px 24px; }
    .lb-arrow { top: auto; bottom: 14px; margin: 0; }
    .lb-prev { left: calc(50% - 56px); }
    .lb-next { right: calc(50% - 56px); }
}

/* ==========================================================================
   Banner: dikey vektör logo (Sahõra ÇANTA)
   ========================================================================== */
.hero-brand { position: relative; }
.hero-brand .hero-wordmark {
    flex: none;
    display: block;
    width: min(46vw, 82vh);
    max-width: none;
    height: auto;
    transform: rotate(90deg);
}
@media (max-width: 900px) {
    .hero-brand { padding: 26px 0 12px; }
    .hero-brand .hero-wordmark { width: min(74vw, 340px); transform: none; margin: 0 auto; }
}

/* ==========================================================================
   Footer: sosyal medya kartları (temaya uyumlu, okunaklı)
   ========================================================================== */
footer.footer .footer-social-card {
    display: grid;
    grid-template-columns: 46px 1px minmax(0, 1fr) 34px;
    align-items: center;
    column-gap: 14px;
    width: 100%;
    min-height: 66px;
    margin-bottom: 12px;
    padding: 10px 14px;
    background: #fff !important;
    border: 1px solid rgba(0,0,0,.1) !important;
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(0,0,0,.04) !important;
    color: #111;
    transition: transform .25s, box-shadow .25s, border-color .25s;
}
footer.footer .footer-social-card:hover { transform: translateY(-2px); border-color: #111 !important; box-shadow: 0 12px 28px rgba(0,0,0,.1) !important; }
footer.footer .footer-social-card .footer-social-card__icon {
    width: 46px; height: 46px; border-radius: 13px; font-size: 22px; color: #fff !important;
    display: inline-flex; align-items: center; justify-content: center;
}
footer.footer .footer-social-card--youtube .footer-social-card__icon { background: #e62117 !important; }
footer.footer .footer-social-card--instagram .footer-social-card__icon { background: linear-gradient(135deg, #f7ad3f 0%, #e1306c 50%, #833ab4 100%) !important; }
footer.footer .footer-social-card--facebook .footer-social-card__icon { background: #1877f2 !important; }
footer.footer .footer-social-card .footer-social-card__divider { height: 34px; background: rgba(0,0,0,.12) !important; }
footer.footer .footer-social-card .footer-social-card__text strong {
    display: block; margin: 0 0 2px;
    font-family: var(--roon-sans); font-size: 14px; font-weight: 700; letter-spacing: .06em; line-height: 1.2;
    color: #111 !important;
}
footer.footer .footer-social-card .footer-social-card__text > span {
    display: block; font-family: var(--roon-sans); font-size: 13px; line-height: 1.3; color: #555 !important;
}
footer.footer .footer-social-card .footer-social-card__arrow {
    width: 34px; height: 34px; border: 1px solid rgba(0,0,0,.2) !important; color: #111 !important; font-size: 16px;
    transition: background .2s, color .2s, border-color .2s;
}
footer.footer .footer-social-card:hover .footer-social-card__arrow { background: #111; color: #fff !important; border-color: #111 !important; }

/* ==========================================================================
   Arama önerileri
   ========================================================================== */
.nav-search { position: relative; }
.sg-box {
    position: absolute; top: calc(100% + 12px); right: 0; z-index: 90;
    width: 380px; max-width: calc(100vw - 28px); max-height: 70vh; overflow-y: auto;
    padding: 8px; background: #fff; border: 1px solid rgba(0,0,0,.1); border-radius: 16px;
    box-shadow: 0 20px 50px rgba(0,0,0,.16);
}
.sg-box[hidden] { display: none; }
.sg-item { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; color: #111; transition: background .15s; }
.sg-item:hover, .sg-item.is-active { background: #f3f1ec; }
.sg-item img { flex: 0 0 52px; width: 52px; height: 52px; object-fit: contain; background: #f7f6f3; border-radius: 10px; }
.sg-txt { min-width: 0; display: flex; flex-direction: column; gap: 2px; font-family: var(--roon-sans); font-style: normal; }
.sg-txt b { font-size: 15px; font-weight: 700; letter-spacing: .02em; color: #111; }
.sg-txt small { font-size: 13px; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sg-txt mark { padding: 0; color: #7c7455; background: rgba(124,116,85,.18); border-radius: 3px; }
.sg-empty { padding: 18px 12px; text-align: center; font: 14px var(--roon-sans); font-style: normal; color: #666; }
.sg-all { display: block; margin-top: 4px; padding: 11px 12px; text-align: center; font: 600 13px var(--roon-sans); font-style: normal; color: #111; border-top: 1px solid rgba(0,0,0,.08); border-radius: 0 0 10px 10px; }
.sg-all:hover { color: #7c7455; }
@media (max-width: 900px) { .sg-box { position: fixed; top: 64px; left: 14px; right: 14px; width: auto; max-width: none; } }

/* ==========================================================================
   Sipariş / Bilgi formu penceresi
   ========================================================================== */
.overlay { background: rgba(15,14,12,.6) !important; backdrop-filter: blur(3px); }
.popup { width: min(540px, calc(100% - 28px)) !important; padding: 34px 34px 30px !important; }
.popup h2 { margin: 0 0 6px; padding-right: 36px; font-family: var(--roon-sans); font-style: normal; font-weight: 700; font-size: 24px !important; line-height: 1.2; letter-spacing: -.01em; }
.popup-lead { margin: 0 0 18px; font: 14.5px/1.55 var(--roon-sans); font-style: normal; color: #666; }
.popup-x { position: absolute; top: 16px; right: 16px; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; font-size: 24px; line-height: 1; color: #111; background: #f3f1ec; border: 0; border-radius: 50%; cursor: pointer; transition: background .2s, color .2s; }
.popup-x:hover { background: #111; color: #fff; }
.popup-product { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; padding: 12px 14px; background: #f7f6f3; border: 1px solid rgba(0,0,0,.07); border-radius: 14px; }
.popup-product i { flex: 0 0 38px; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; color: #fff; background: #111; border-radius: 10px; }
.popup-product span { display: flex; flex-direction: column; min-width: 0; font-family: var(--roon-sans); font-style: normal; }
.popup-product strong { font-size: 15px; font-weight: 600; color: #111; overflow-wrap: anywhere; }
.popup-product small { font-size: 12.5px; color: #777; }
.popup-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 22px; }
.pf { display: block; }
.pf-full { grid-column: 1 / -1; }
.pf > span { display: block; margin-bottom: 6px; font: 600 13px var(--roon-sans); font-style: normal; color: #333; }
.popup .pf .form-control { display: block; width: 100%; height: auto; padding: 12px 14px !important; font: 400 15px/1.4 var(--roon-sans); font-style: normal; color: #111; box-shadow: none; }
.popup .pf textarea.form-control { min-height: 104px; resize: vertical; }
.popup-actions { display: flex; gap: 10px; }
.popup-send, .popup-cancel { height: 50px; padding: 0 26px; font: 600 15px var(--roon-sans); font-style: normal; border-radius: 30px; cursor: pointer; transition: background .2s, color .2s, transform .2s; }
.popup-send { flex: 1 1 auto; color: #fff; background: #111; border: 1px solid #111; }
.popup-send:hover { background: #333; transform: translateY(-1px); }
.popup-cancel { flex: 0 0 auto; color: #111; background: transparent; border: 1px solid rgba(0,0,0,.25); }
.popup-cancel:hover { border-color: #111; background: #f3f1ec; }
@media (max-width: 560px) {
    .popup { padding: 24px 18px 20px !important; }
    .popup-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .popup-actions { flex-direction: column-reverse; }
    .popup-send, .popup-cancel { width: 100%; }
}

/* ==========================================================================
   KVKK / Çerez bilgilendirme penceresi
   ========================================================================== */
.ck { position: fixed; left: 20px; bottom: 20px; z-index: 10000000; width: min(420px, calc(100vw - 40px)); padding: 22px 22px 16px; background: #fff; color: #111; border: 1px solid rgba(0,0,0,.1); border-radius: 20px; box-shadow: 0 24px 60px rgba(0,0,0,.2); font-family: var(--roon-sans); font-style: normal; animation: ckUp .45s ease; }
.ck[hidden], .ck-open[hidden] { display: none; }
@keyframes ckUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
.ck-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.ck-ico { flex: 0 0 38px; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; font-size: 17px; color: #fff; background: #111; border-radius: 12px; }
.ck-head strong { font-size: 15.5px; font-weight: 700; line-height: 1.3; }
.ck-text { margin: 0 0 14px; font-size: 13.5px; line-height: 1.6; color: #444; }
.ck-text a { color: #111; font-weight: 600; border-bottom: 1px solid currentColor; }
.ck-text a:hover { color: #7c7455; }
.ck-prefs { margin: 0 0 14px; padding: 4px 14px; background: #f7f6f3; border: 1px solid rgba(0,0,0,.07); border-radius: 14px; }
.ck-prefs[hidden] { display: none; }
.ck-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid rgba(0,0,0,.07); cursor: pointer; }
.ck-row:last-child { border-bottom: 0; }
.ck-row span { display: flex; flex-direction: column; gap: 2px; }
.ck-row b { font-size: 13.5px; font-weight: 600; }
.ck-row small { font-size: 12px; line-height: 1.4; color: #777; }
.ck-row input { appearance: none; -webkit-appearance: none; flex: 0 0 42px; width: 42px; height: 24px; margin: 0; position: relative; background: #cfccc4; border-radius: 24px; cursor: pointer; transition: background .2s; }
.ck-row input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; background: #fff; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .2s; }
.ck-row input:checked { background: #111; }
.ck-row input:checked::after { transform: translateX(18px); }
.ck-row input:disabled { opacity: .55; cursor: not-allowed; }
.ck-actions { display: flex; gap: 8px; }
.ck-btn { flex: 1 1 0; height: 44px; padding: 0 12px; font: 600 14px var(--roon-sans); font-style: normal; border-radius: 30px; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.ck-accept { color: #fff; background: #111; border: 1px solid #111; }
.ck-accept:hover { background: #333; }
.ck-reject { color: #111; background: transparent; border: 1px solid rgba(0,0,0,.25); }
.ck-reject:hover { border-color: #111; background: #f3f1ec; }
.ck-link { display: block; margin: 12px auto 2px; padding: 4px 8px; font: 500 13px var(--roon-sans); font-style: normal; color: #666; background: none; border: 0; border-bottom: 1px solid transparent; cursor: pointer; }
.ck-link:hover { color: #111; border-bottom-color: #111; }
.ck-open { position: fixed; left: 16px; bottom: 16px; z-index: 9999990; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 16px; color: #111; background: #fff; border: 1px solid rgba(0,0,0,.15); border-radius: 50%; box-shadow: 0 6px 18px rgba(0,0,0,.12); cursor: pointer; transition: background .2s, color .2s; }
.ck-open:hover { background: #111; color: #fff; }
@media (max-width: 767px) {
    /* alttaki sabit iletişim çubuğunun üstünde dursun */
    .ck { left: 12px; right: 12px; bottom: 78px; width: auto; padding: 18px 16px 12px; max-height: calc(100vh - 100px); overflow-y: auto; }
    .ck-open { left: 12px; bottom: 80px; width: 36px; height: 36px; font-size: 14px; }
    .ck-actions { flex-direction: column; }
}

/* ==========================================================================
   ARAMA SAYFASI
   ========================================================================== */
.search-page { max-width: 1400px; }
.sx-box { position: relative; display: flex; align-items: center; gap: 10px; max-width: 820px; height: 68px; padding: 0 10px 0 22px; background: #fff; border: 1.5px solid #111; border-radius: 40px; box-shadow: 0 12px 34px rgba(0,0,0,.07); transition: box-shadow .2s; }
.sx-box:focus-within { box-shadow: 0 16px 40px rgba(0,0,0,.12); }
.sx-ico { flex: 0 0 auto; font-size: 20px; color: #7c7455; }
.sx-box input[type="text"] { flex: 1 1 auto; min-width: 0; height: 100%; padding: 0; font: 400 18px var(--roon-sans); font-style: normal; color: #111; background: transparent; border: 0; outline: 0; }
.sx-box input[type="text"]::placeholder { color: #999; font-size: 16px; }
.sx-clear { flex: 0 0 auto; width: 34px; height: 34px; font-size: 22px; line-height: 1; color: #555; background: #f3f1ec; border: 0; border-radius: 50%; cursor: pointer; transition: background .2s, color .2s; }
.sx-clear:hover { background: #111; color: #fff; }
.sx-clear[hidden] { display: none; }
.sx-go { flex: 0 0 auto; height: 50px; padding: 0 30px; font: 600 15px var(--roon-sans); font-style: normal; color: #fff; background: #111; border: 0; border-radius: 30px; cursor: pointer; transition: background .2s; }
.sx-go:hover { background: #333; }
.sx-hint { margin: 12px 0 0 22px; font: 13.5px var(--roon-sans); font-style: normal; color: #888; }

.sx-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; margin: 34px 0 22px; }
.sx-info { margin: 0; font: 600 15px var(--roon-sans); font-style: normal; color: #333; }
.sx-info:empty { display: none; }
.sx-cats { display: flex; flex-wrap: wrap; gap: 8px; }
.sx-chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; font: 500 13.5px var(--roon-sans); font-style: normal; color: #222; background: #fff; border: 1px solid rgba(0,0,0,.14); border-radius: 30px; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.sx-chip b { padding: 1px 8px; font-size: 12px; font-weight: 600; color: #666; background: #f1efea; border-radius: 20px; }
.sx-chip:hover { border-color: #111; }
.sx-chip.is-on { color: #fff; background: #111; border-color: #111; }
.sx-chip.is-on b { color: #fff; background: rgba(255,255,255,.2); }

.search-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.search-grid[hidden], .search-empty[hidden] { display: none; }
.search-grid .product { position: relative; }
.search-grid .price b { font-weight: 700; color: #111; }
.search-grid mark { padding: 0; color: #7c7455; background: rgba(124,116,85,.2); border-radius: 3px; }
.sx-tag { display: inline-block; align-self: flex-start; margin: 8px 8px 2px; padding: 3px 10px; font: 500 11.5px var(--roon-sans); font-style: normal; color: #7c7455; background: rgba(124,116,85,.12); border-radius: 20px; }

.search-empty { max-width: 720px; margin: 20px auto 0; padding: 40px 20px; text-align: center; background: #fff; border: 1px solid var(--card-border); border-radius: 22px; }
.sx-empty-title { margin: 0 0 6px; font: 700 22px var(--roon-sans); font-style: normal; overflow-wrap: anywhere; }
.sx-empty-sub { margin: 0 0 20px; font: 15px var(--roon-sans); font-style: normal; color: #777; }
.search-empty .chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.search-empty .chips a { padding: 9px 18px; font: 500 14px var(--roon-sans); font-style: normal; color: #222; border: 1px solid rgba(0,0,0,.18); border-radius: 30px; transition: background .2s, color .2s; }
.search-empty .chips a:hover { background: #111; color: #fff; border-color: #111; }

@media (max-width: 1100px) { .search-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) {
    .sx-box { height: 58px; padding: 0 8px 0 16px; }
    .sx-box input[type="text"] { font-size: 16px; }
    .sx-box input[type="text"]::placeholder { font-size: 14px; }
    .sx-go { height: 42px; padding: 0 20px; }
    .sx-hint { margin-left: 8px; font-size: 12.5px; }
    .sx-bar { margin: 24px 0 16px; }
    .sx-cats { flex-wrap: nowrap; overflow-x: auto; width: 100%; padding-bottom: 4px; -webkit-overflow-scrolling: touch; }
    .sx-chip { flex: 0 0 auto; white-space: nowrap; }
    .search-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .search-empty { padding: 28px 16px; border-radius: 18px; }
}

/* ==========================================================================
   Üst menü: logo belirgin olsun
   ========================================================================== */
.site-header .navbar { height: 86px; }
.site-header .logo { min-width: 160px; }
.site-header .logo img { height: 66px !important; max-width: 270px !important; }
/* Yapışkan yan menüler yeni header yüksekliğinin altında kalmasın */
.kurumsal-side, .shop-sidebar, .faq-help { top: 150px; }
.pdp-info { top: 160px; }
@media (max-width: 900px) {
    .site-header .navbar { height: 68px; }
    .site-header .logo { min-width: 0; }
    .site-header .logo img { height: 52px !important; max-width: 200px !important; }
    .sg-box { top: 74px; }
}
@media (max-width: 420px) {
    .site-header .logo img { height: 46px !important; max-width: 170px !important; }
}

/* ==========================================================================
   MOBİL: kategoriler ve ürünler tek sütun (Emira Çanta düzeni)
   ========================================================================== */
@media (max-width: 600px) {
    .category-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 18px !important; }
    .category-card { padding: 10px; border-radius: 18px; }
    .category-name { font-size: 18px; }
    .category-cta { font-size: 13.5px; padding: 8px 16px; }

    .product-grid.shop-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
    .product-grid.shop-grid .product { padding: 10px 10px 16px; border-radius: 18px; }
    .product-grid.shop-grid .product h3 { margin: 14px 6px 4px; font-size: 16px; }
    .product-grid.shop-grid .product .price { margin: 0 6px; font-size: 13.5px; }
}

/* ==========================================================================
   KURUMSAL / ÜRETİM: video banner (içerik genişliğinde, 16:9)
   ========================================================================== */
.kurumsal-content .prose { max-width: none; }
.kurumsal-content .prose video,
.kurumsal-content .prose iframe {
    display: block;
    width: 100% !important;
    max-width: 100%;
    height: auto !important;
    aspect-ratio: 16 / 9;
    margin: 0 0 28px;
    border: 0;
    border-radius: 18px;
    background: #000;
    object-fit: cover;
}
.kurumsal-content .prose .video-banner,
.kurumsal-content .prose figure:has(video),
.kurumsal-content .prose p:has(> video),
.kurumsal-content .prose p:has(> iframe) { margin: 0 0 28px; }
@media (max-width: 900px) {
    .kurumsal-content .prose video,
    .kurumsal-content .prose iframe { border-radius: 14px; margin-bottom: 20px; }
}


/* ==========================================================================
   MOBİL: üst bar (telefon + WhatsApp + e-posta) görünsün
   ========================================================================== */
@media (max-width: 767px) {
    .site-header .announcement {
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0;
        min-height: 0;
        padding: 7px 12px;
    }
    .site-header .topbar-contact {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px 16px;
        width: 100%;
    }
    .site-header .topbar-contact-item { font-size: 12.5px; white-space: nowrap; }
    .site-header .topbar-phone { order: 1; }
    .site-header .topbar-whatsapp { order: 2; border-left: 0; padding-left: 0; }
    .site-header .topbar-email { display: inline-flex !important; order: 3; flex: 0 0 100%; justify-content: center; }
    .site-header .topbar-right { display: none !important; }
}

/* ==========================================================================
   ANA SAYFA: Blog (en güncel 3 yazı)
   ========================================================================== */
.home-blog .post-card h3 { margin: 20px 22px 10px; font-family: var(--roon-sans); font-size: 19px; font-weight: 600; line-height: 1.35; text-transform: none; }
.home-blog .post-card p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 1100px) {
    .home-blog .post-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
}
@media (max-width: 800px) {
    .home-blog .post-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}

/* ==========================================================================
   REFERANSLAR: canlı kartlar (belirme animasyonu, hover'da parlama + firma adı)
   ========================================================================== */
.ref-live .ref-item { position: relative; margin: 0; overflow: hidden; }
.ref-live .ref-item img { transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.ref-live .ref-item:hover img { transform: scale(1.08); }
.ref-live .ref-item::after {
    content: ""; position: absolute; top: 0; left: -80%; width: 50%; height: 100%;
    background: linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.75) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-18deg); pointer-events: none; transition: left .7s ease;
}
.ref-live .ref-item:hover::after { left: 130%; }
.ref-live .ref-name {
    position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 10px 9px;
    font: 600 13px var(--roon-sans); font-style: normal; text-align: center; color: #111;
    background: linear-gradient(to top, rgba(255,255,255,.97) 60%, rgba(255,255,255,0));
    transform: translateY(100%); transition: transform .35s ease;
}
.ref-live .ref-item:hover .ref-name { transform: translateY(0); }
@media (hover: none) {
    .ref-live .ref-name { transform: none; font-size: 12px; padding-top: 14px; }
}

@keyframes refIn {
    from { opacity: 0; transform: translateY(28px) scale(.95); }
    to   { opacity: 1; transform: none; }
}
.ref-anim .ref-item { opacity: 0; }
.ref-anim .ref-item.is-in { opacity: 1; animation: refIn .65s cubic-bezier(.2, .7, .2, 1) backwards; animation-delay: calc(var(--i, 0) * 90ms); }
@media (prefers-reduced-motion: reduce) {
    .ref-anim .ref-item { opacity: 1; }
    .ref-anim .ref-item.is-in { animation: none; }
}

/* ==========================================================================
   FOOTER: ülke bayrakları (şerit şeklinde sürekli dönen)
   ========================================================================== */
.flag-strip {
    position: relative;
    overflow: hidden;
    margin-top: 22px;
    padding: 12px 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
.flag-track {
    display: flex;
    align-items: center;
    gap: 22px;
    width: max-content;
    animation: flagScroll 60s linear infinite;
    will-change: transform;
}
.flag-strip:hover .flag-track { animation-play-state: paused; }
.flag-item {
    flex: 0 0 auto;
    display: block;
    width: 60px;
    height: 40px;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
    transition: transform .25s ease, box-shadow .25s ease;
}
.flag-item img { display: block; width: 100%; height: 100%; object-fit: cover; }
.flag-item:hover { transform: translateY(-4px) scale(1.12); box-shadow: 0 8px 18px rgba(0, 0, 0, .25); }
@keyframes flagScroll {
    from { transform: translateX(0); }
    to   { transform: translateX(calc(-50% - 11px)); } /* iki tur yan yana; yarısı + gap/2 kadar kayınca başa döner */
}
@media (max-width: 767px) {
    .flag-item { width: 48px; height: 32px; border-radius: 5px; }
    .flag-track { gap: 16px; animation-duration: 45s; }
    @keyframes flagScroll { from { transform: translateX(0); } to { transform: translateX(calc(-50% - 8px)); } }
}
@media (prefers-reduced-motion: reduce) {
    .flag-track { animation: none; flex-wrap: wrap; justify-content: center; width: auto; }
    .flag-item[aria-hidden="true"] { display: none; }
}

/* ==========================================================================
   MOBİL: ürün listesi önde, kategori listesi altta
   ========================================================================== */
@media (max-width: 900px) {
    .shop-layout { display: flex; flex-direction: column; gap: 0; }
    .shop-main { order: 1; width: 100%; }
    .shop-sidebar { order: 2; position: static; width: 100%; margin-top: 40px; padding: 18px 16px; border-radius: 18px; }
    .shop-sidebar .side-title { display: block; margin: 0 0 14px; padding: 0 4px; font-size: 13px; }
    .shop-sidebar .side-cats { flex-direction: row; flex-wrap: wrap; overflow: visible; gap: 8px; }
    .shop-sidebar .side-cats li { flex: 0 0 auto; max-width: 100%; }
}

/* ==========================================================================
   REFERANSLAR SAYFASI: canlı sürüm (öne çıkan markalar, renkli hover, 3D eğilme,
   süzülen kartlar, sayaç ve arka planda hareket eden renk lekeleri)
   ========================================================================== */
.ref-page .ref-count {
    display: inline-flex; align-items: center; gap: 10px;
    margin: 20px 0 0; padding: 9px 20px;
    font: 500 15px var(--roon-sans); font-style: normal; color: #333;
    background: #fff; border: 1px solid var(--card-border); border-radius: 999px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
}
.ref-page .ref-count b {
    font-size: 21px; font-weight: 800; font-variant-numeric: tabular-nums;
    background: linear-gradient(90deg, #ff6b6b, #feca57, #1dd1a1, #48dbfb, #ff6b6b);
    background-size: 250% 100%;
    -webkit-background-clip: text; background-clip: text; color: transparent;
    animation: refHue 5s linear infinite;
}
.ref-count-dot { width: 9px; height: 9px; border-radius: 50%; background: #1dd1a1; animation: refPulse 1.8s ease-out infinite; }

.ref-page { position: relative; overflow: hidden; }
.ref-stage { position: relative; isolation: isolate; padding: 14px 6px 40px; }
.ref-blob { position: absolute; z-index: -1; border-radius: 50%; filter: blur(72px); opacity: .42; pointer-events: none; animation: refDrift 18s ease-in-out infinite alternate; }
.ref-blob-1 { width: 380px; height: 380px; background: #ffd6a5; top: -70px; left: -90px; }
.ref-blob-2 { width: 340px; height: 340px; background: #a0e7e5; top: 32%; right: -70px; animation-delay: -6s; }
.ref-blob-3 { width: 320px; height: 320px; background: #cdb4db; bottom: 4%; left: 28%; animation-delay: -11s; }

.ref-page .ref-grid { grid-template-columns: repeat(60, minmax(0, 1fr)); gap: 20px; }
.ref-page .ref-item {
    --c1: #ff7e5f; --c2: #feb47b; --rgb: 255, 126, 95;
    grid-column: span 12;
    position: relative; display: block; margin: 0; padding: 0; aspect-ratio: 4 / 3;
    background: #fff; border: 1px solid rgba(0, 0, 0, .08); border-radius: 20px; overflow: hidden;
    transform: perspective(800px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
    transition: transform .25s ease, box-shadow .35s ease, border-color .35s ease;
    animation: refFloat 7s ease-in-out var(--f, 0s) infinite;
    will-change: transform;
}
.ref-page .ref-item.ref-featured { grid-column: span 15; aspect-ratio: auto; display: flex; flex-direction: column; min-height: 230px; }
.ref-page .ref-item:nth-of-type(6n+2) { --c1: #36d1dc; --c2: #5b86e5; --rgb: 54, 209, 220; }
.ref-page .ref-item:nth-of-type(6n+3) { --c1: #43e97b; --c2: #38f9d7; --rgb: 67, 233, 123; }
.ref-page .ref-item:nth-of-type(6n+4) { --c1: #a18cd1; --c2: #fbc2eb; --rgb: 161, 140, 209; }
.ref-page .ref-item:nth-of-type(6n+5) { --c1: #f6d365; --c2: #fda085; --rgb: 246, 211, 101; }
.ref-page .ref-item:nth-of-type(6n)   { --c1: #ff5e62; --c2: #ff9966; --rgb: 255, 94, 98; }

/* Hover'da parlayan degrade çerçeve */
.ref-page .ref-item::before {
    content: ""; position: absolute; inset: 0; z-index: 3; padding: 2px; border-radius: inherit; pointer-events: none;
    background: linear-gradient(135deg, var(--c1), var(--c2));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    opacity: 0; transition: opacity .3s ease;
}
.ref-page .ref-item:hover { border-color: transparent; z-index: 2; box-shadow: 0 22px 44px rgba(var(--rgb), .32), 0 6px 14px rgba(0, 0, 0, .08); }
.ref-page .ref-item:hover::before { opacity: 1; }

.ref-card-in { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; flex: 1 1 auto; padding: 9%; transition: background .3s ease; }
.ref-page .ref-item:hover .ref-card-in { background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), rgba(var(--rgb), .18), transparent 72%); }
.ref-page .ref-item img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; filter: none; opacity: 1; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.ref-page .ref-item:hover img { transform: scale(1.1) translateZ(30px); }

/* Öne çıkan markalarda firma adı her zaman görünür */
.ref-page .ref-item.ref-featured .ref-name {
    position: static; transform: none; padding: 11px 12px 14px;
    font: 700 14.5px var(--roon-sans); font-style: normal; letter-spacing: .01em; text-align: center; color: #111;
    background: transparent; border-top: 1px solid rgba(0, 0, 0, .07);
}
.ref-page .ref-item.ref-featured .ref-card-in { padding: 7% 9% 4%; }

/* "Diğer Referanslarımız" ayırıcı */
.ref-divider {
    grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; margin: 28px 0 4px;
    font: 700 22px var(--roon-sans); font-style: normal; text-transform: none; color: #111;
}
.ref-divider::before, .ref-divider::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(0, 0, 0, .28), transparent); }

/* Belirme animasyonu: belirir, sonra süzülmeye devam eder */
.ref-anim .ref-item.is-in {
    animation: refIn .7s cubic-bezier(.2, .7, .2, 1) backwards, refFloat 7s ease-in-out infinite;
    animation-delay: calc(var(--i, 0) * 90ms), calc(.7s + var(--i, 0) * 90ms);
}

@keyframes refFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
@keyframes refHue { from { background-position: 0% 0; } to { background-position: 250% 0; } }
@keyframes refPulse { 0% { box-shadow: 0 0 0 0 rgba(29, 209, 161, .65); } 80%, 100% { box-shadow: 0 0 0 11px rgba(29, 209, 161, 0); } }
@keyframes refDrift { from { transform: translate(0, 0) scale(1); } to { transform: translate(70px, 40px) scale(1.18); } }

@media (max-width: 1100px) {
    .ref-page .ref-item { grid-column: span 15; }
    .ref-page .ref-item.ref-featured { grid-column: span 20; }
}
@media (max-width: 640px) {
    .ref-page .ref-grid { gap: 12px; }
    .ref-page .ref-item, .ref-page .ref-item.ref-featured { grid-column: span 30; }
    .ref-page .ref-item.ref-featured { min-height: 190px; }
    .ref-divider { font-size: 18px; }
    .ref-blob { opacity: .3; }
}
@media (prefers-reduced-motion: reduce) {
    .ref-page .ref-item, .ref-page .ref-count b, .ref-count-dot, .ref-blob { animation: none !important; }
}

/* ==========================================================================
   MOBIL: hero'daki buyuk marka yazisi gizli, arama dugmesi belirgin,
   hamburger menu = tema renklerinde sagdan acilan cekmece
   ========================================================================== */
.drawer-head, .drawer-foot { display: none; }

@media (max-width: 900px) {
    /* Banner ustundeki buyuk "Sahora CANTA" yazisi mobilde gizli (logo zaten basliktadir) */
    .hero-brand { display: none !important; }

    /* Arama dugmesi: belirgin yuvarlak simge + yazi */
    .site-header .nav-right { display: flex !important; align-items: center; }
    .site-header .nav-search { display: flex !important; align-items: center; gap: 8px; }
    .site-header .nav-search input[type="submit"] { width: 36px; height: 36px; min-width: 36px; background-size: 17px 17px; box-shadow: 0 4px 12px rgba(0, 0, 0, .18); }
    .site-header .nav-search input[type="text"] { width: 74px; font-size: 13px; }

    /* ---- Cekmece ---- */
    body .site-header .navbar .nav-links {
        display: flex !important;
        flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0;
        position: fixed; top: 0; right: 0; bottom: 0; left: auto;
        width: min(88vw, 400px); height: 100%; max-height: none;
        margin: 0; padding: 0 0 24px;
        background: var(--bg, #f4f2ee);
        border: 0; border-radius: 26px 0 0 26px;
        box-shadow: -24px 0 60px rgba(0, 0, 0, .22);
        overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
        transform: translateX(108%); visibility: hidden;
        transition: transform .42s cubic-bezier(.22, .9, .3, 1), visibility 0s linear .42s;
        z-index: 3;
    }
    body.nav-open .site-header .navbar .nav-links {
        transform: none; visibility: visible;
        transition: transform .42s cubic-bezier(.22, .9, .3, 1), visibility 0s;
    }

    /* Karartı (menü dışına tıklayınca kapanır) */
    .site-header::before {
        content: ""; position: fixed; inset: 0; z-index: 2;
        background: rgba(15, 14, 12, .55);
        -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
        opacity: 0; pointer-events: none; transition: opacity .35s ease;
    }
    body.nav-open .site-header::before { opacity: 1; pointer-events: auto; }
    body.nav-open { overflow: hidden; }
    body.nav-open .site-header { z-index: 100000; }
    body.nav-open #custom-contact-wrapper { display: none !important; }

    /* Ust: logo + kapat */
    .nav-links .drawer-head {
        display: flex; align-items: center; justify-content: space-between;
        position: sticky; top: 0; z-index: 2;
        padding: 18px 20px 16px; margin: 0;
        background: var(--bg, #f4f2ee);
        border-bottom: 1px solid rgba(0, 0, 0, .1);
    }
    .nav-links .drawer-head .drawer-logo { display: block; width: auto; padding: 0; border: 0; }
    .nav-links .drawer-head .drawer-logo img { display: block; height: 40px; width: auto; max-width: 190px; }
    .nav-links .drawer-close {
        width: 42px; height: 42px; display: flex; align-items: center; justify-content: center;
        font: 300 28px/1 var(--roon-sans, sans-serif); color: #111;
        background: #fff; border: 1px solid rgba(0, 0, 0, .14); border-radius: 50%; cursor: pointer;
        transition: background .2s, color .2s, transform .25s;
    }
    .nav-links .drawer-close:hover, .nav-links .drawer-close:active { background: #111; color: #fff; transform: rotate(90deg); }

    /* Baglantilar */
    .site-header .nav-links > li { display: block; width: 100%; height: auto; border-bottom: 1px solid rgba(0, 0, 0, .08); }
    .site-header .nav-links > li.drawer-head { border-bottom: 1px solid rgba(0, 0, 0, .1); }
    body .site-header .nav-links > li > a {
        display: flex; align-items: center; justify-content: space-between;
        padding: 18px 24px; font-size: 18px; font-weight: 600 !important; letter-spacing: .01em;
        text-transform: none !important; color: #111 !important; white-space: normal;
        transition: background .2s, padding-left .25s ease, color .2s;
    }
    body .site-header .nav-links > li > a:hover,
    body .site-header .nav-links > li > a:active { background: rgba(0, 0, 0, .04); padding-left: 30px; color: #7c7455 !important; }

    /* Alt menu oku */
    .site-header .nav-links > li.has-dropdown > a::after {
        content: ""; flex: 0 0 auto; width: 9px; height: 9px; margin-left: 12px;
        border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
        transform: rotate(45deg) translateY(-2px); transition: transform .3s ease;
    }
    .site-header .nav-links > li.has-dropdown.open > a::after { transform: rotate(-135deg) translateY(-2px); }
    .site-header .nav-links > li.has-dropdown.open > a { color: #7c7455 !important; }

    /* Acilan alt menuler */
    body .site-header .nav-links .dropdown,
    body .site-header .nav-links .megamenu {
        position: static; display: none; width: 100%; min-width: 0;
        margin: 0; padding: 4px 0 12px; border: 0; border-radius: 0; box-shadow: none; transform: none;
        background: rgba(0, 0, 0, .035);
    }
    body .site-header .nav-links li.has-dropdown.open > .dropdown,
    body .site-header .nav-links li.has-dropdown.open > .megamenu { display: block; animation: drawerSub .3s ease; }
    body .site-header .nav-links .megamenu ul { columns: 1 !important; min-width: 0 !important; margin: 0; padding: 0; list-style: none; }
    body .site-header .nav-links .dropdown li,
    body .site-header .nav-links .megamenu li { display: block; width: 100%; }
    body .site-header .nav-links .dropdown a,
    body .site-header .nav-links .megamenu a {
        display: block; padding: 12px 24px 12px 38px; font-size: 15.5px; font-weight: 500;
        color: #333 !important; text-transform: none; border: 0; background: none;
        position: relative; transition: background .2s, color .2s, padding-left .25s ease;
    }
    body .site-header .nav-links .dropdown a::before,
    body .site-header .nav-links .megamenu a::before {
        content: ""; position: absolute; left: 24px; top: 50%; width: 6px; height: 6px;
        margin-top: -3px; border-radius: 50%; background: #7c7455; opacity: .55;
    }
    body .site-header .nav-links .dropdown a:hover,
    body .site-header .nav-links .megamenu a:hover { background: rgba(124, 116, 85, .12); padding-left: 42px; color: #111 !important; }

    /* Alt: iletisim dugmeleri */
    .nav-links .drawer-foot {
        display: flex; flex-direction: column; gap: 10px;
        padding: 22px 20px 6px; border-bottom: 0 !important; margin-top: auto;
    }
    .nav-links .drawer-btn {
        display: flex !important; align-items: center; justify-content: center; gap: 10px;
        padding: 14px 18px !important; border-radius: 40px; font: 600 15.5px var(--roon-sans, sans-serif) !important;
        text-transform: none !important; letter-spacing: 0 !important; text-decoration: none; color: #fff !important;
        transition: transform .2s, box-shadow .2s;
    }
    .nav-links .drawer-btn:active { transform: scale(.98); }
    .nav-links .drawer-btn--wa { background: #25d366; box-shadow: 0 8px 20px rgba(37, 211, 102, .32); }
    .nav-links .drawer-btn--tel { background: #111; }
    .nav-links .drawer-mail {
        display: flex !important; align-items: center; justify-content: center; gap: 8px;
        padding: 8px 0 4px !important; font: 500 14px var(--roon-sans, sans-serif) !important;
        text-transform: none !important; color: #555 !important;
    }

    /* Acilirken satirlar sirayla gelsin */
    body.nav-open .site-header .nav-links > li:not(.drawer-head) { animation: drawerItem .45s cubic-bezier(.2, .8, .3, 1) both; }
    body.nav-open .site-header .nav-links > li:nth-child(2) { animation-delay: .06s; }
    body.nav-open .site-header .nav-links > li:nth-child(3) { animation-delay: .10s; }
    body.nav-open .site-header .nav-links > li:nth-child(4) { animation-delay: .14s; }
    body.nav-open .site-header .nav-links > li:nth-child(5) { animation-delay: .18s; }
    body.nav-open .site-header .nav-links > li:nth-child(6) { animation-delay: .22s; }
    body.nav-open .site-header .nav-links > li:nth-child(7) { animation-delay: .26s; }
    body.nav-open .site-header .nav-links > li:nth-child(8) { animation-delay: .30s; }
    body.nav-open .site-header .nav-links > li:nth-child(9) { animation-delay: .34s; }
    body.nav-open .site-header .nav-links > li:nth-child(10) { animation-delay: .38s; }
}
@keyframes drawerItem { from { opacity: 0; transform: translateX(26px); } to { opacity: 1; transform: none; } }
@keyframes drawerSub { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
    body .site-header .nav-links, .site-header::before { transition: none !important; }
    body.nav-open .site-header .nav-links > li { animation: none !important; }
}

/* Mobil cekmecede alt menu sadece tiklayinca (.open) acilsin; dokunmatik :hover acik birakmasin */
@media (max-width: 900px) {
    body .site-header .nav-links li.has-dropdown:not(.open) > .dropdown,
    body .site-header .nav-links li.has-dropdown:not(.open) > .megamenu { display: none !important; }
}

/* Cekmece: baslik ve alt iletisim alanlari icin netlestirme (ust kurallari ezmek icin yuksek ozgullukte) */
@media (max-width: 900px) {
    body .site-header .nav-links > li.drawer-head { display: flex !important; align-items: center; justify-content: space-between; width: 100%; padding: 16px 18px 14px 20px; }
    body .site-header .nav-links > li.drawer-head > a.drawer-logo { display: block !important; width: auto !important; padding: 0 !important; background: none !important; }
    body .site-header .nav-links > li.drawer-head > a.drawer-logo:hover { padding: 0 !important; }
    body .site-header .nav-links > li.drawer-head > .drawer-close { flex: 0 0 auto; margin: 0; }

    body .site-header .nav-links > li.drawer-foot { display: flex !important; flex-direction: column; gap: 10px; padding: 22px 20px 8px; }
    body .site-header .nav-links > li.drawer-foot > a.drawer-btn {
        display: flex !important; align-items: center; justify-content: center !important; gap: 10px;
        width: 100%; padding: 15px 18px !important; border-radius: 40px;
        font-size: 15.5px; font-weight: 600 !important; color: #fff !important; background: #111;
    }
    body .site-header .nav-links > li.drawer-foot > a.drawer-btn:hover { padding-left: 18px !important; color: #fff !important; background: #111; }
    body .site-header .nav-links > li.drawer-foot > a.drawer-btn--wa { background: #25d366; }
    body .site-header .nav-links > li.drawer-foot > a.drawer-btn--wa:hover { background: #1faa55; }
    body .site-header .nav-links > li.drawer-foot > a.drawer-mail {
        display: flex !important; align-items: center; justify-content: center !important; gap: 8px;
        padding: 10px 0 4px !important; font-size: 14px; font-weight: 500 !important; color: #555 !important; background: none;
    }
    body .site-header .nav-links > li.drawer-foot > a.drawer-mail:hover { padding-left: 0 !important; background: none; color: #111 !important; }
}

@media (max-width: 900px) {
    body .site-header .nav-links .dropdown a,
    body .site-header .nav-links .megamenu a { text-transform: none !important; font-weight: 500 !important; letter-spacing: 0 !important; font-size: 15.5px !important; }
}

/* Cekmece ogeleri masaustu menusunde GIZLI kalsin (sadece mobilde gorunur) */
.site-header .nav-links > li.drawer-head,
.site-header .nav-links > li.drawer-foot { display: none !important; }

/* Son Eklenen Urunler: telefonda tek sutun */
@media (max-width: 600px) {
    .latest-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
    .latest-grid .product { padding: 10px 10px 16px; border-radius: 18px; }
    .latest-grid .product h3 { margin: 14px 6px 4px; font-size: 16px; }
    .latest-grid .product .price { margin: 0 6px; font-size: 13.5px; }
}