{"product_id":"nubretto-atlas-deri-kartlik","title":"Nubretto Atlas Deri Kartlık","description":"\u003c!-- =========================================================\n NUBRETTO ATLAS — PREMIUM PRODUCT LANDING BLOCK\n Shopify Dawn uyumlu\n Mobile-first \/ Swipe Cards \/ Responsive\n Tek parça HTML + CSS + JS\n ========================================================= --\u003e\n\u003cstyle\u003e\n    \/* =====================================================\n       ROOT\n       ===================================================== *\/\n\n    .nubretto-atlas-product {\n      --na-text: #22211e;\n      --na-muted: #6f6b64;\n      --na-border: #e9e5df;\n      --na-bg: #ffffff;\n      --na-soft: #faf9f7;\n      --na-shadow: 0 10px 30px rgba(35, 31, 27, 0.07);\n      --na-radius: 20px;\n      --na-max: 1120px;\n\n      width: 100%;\n      max-width: var(--na-max);\n      margin: 0 auto;\n      color: var(--na-text);\n      font-family: inherit;\n      box-sizing: border-box;\n      line-height: 1.6;\n    }\n\n    .nubretto-atlas-product *,\n    .nubretto-atlas-product *::before,\n    .nubretto-atlas-product *::after {\n      box-sizing: border-box;\n    }\n\n    \/* =====================================================\n       INTRO\n       ===================================================== *\/\n\n    .na-hero {\n      padding: 8px 0 28px;\n    }\n\n    .na-eyebrow {\n      display: inline-block;\n      margin-bottom: 10px;\n      font-size: 11px;\n      line-height: 1.3;\n      letter-spacing: 0.16em;\n      text-transform: uppercase;\n      font-weight: 600;\n      color: #817b72;\n    }\n\n    .na-hook {\n      margin: 0;\n      max-width: 760px;\n      font-size: clamp(28px, 6vw, 48px);\n      line-height: 1.12;\n      letter-spacing: -0.035em;\n      font-weight: 600;\n      color: var(--na-text);\n    }\n\n    .na-intro {\n      max-width: 760px;\n      margin: 17px 0 0;\n      color: var(--na-muted);\n      font-size: 15px;\n      line-height: 1.75;\n    }\n\n    \/* =====================================================\n       SECTION\n       ===================================================== *\/\n\n    .na-section {\n      margin-top: 34px;\n    }\n\n    .na-section-title {\n      margin: 0 0 15px;\n      font-size: 20px;\n      line-height: 1.3;\n      letter-spacing: -0.015em;\n      font-weight: 600;\n    }\n\n    \/* =====================================================\n       FEATURE CARDS\n       ===================================================== *\/\n\n    .na-cards-wrap {\n      position: relative;\n      width: 100%;\n    }\n\n    .na-cards {\n      display: flex;\n      gap: 12px;\n      overflow-x: auto;\n      overflow-y: hidden;\n      padding: 4px 2px 15px;\n      margin: 0;\n      scroll-snap-type: x mandatory;\n      -webkit-overflow-scrolling: touch;\n      scrollbar-width: none;\n      overscroll-behavior-x: contain;\n    }\n\n    .na-cards::-webkit-scrollbar {\n      display: none;\n    }\n\n    .na-card {\n      flex: 0 0 82%;\n      min-width: 0;\n      scroll-snap-align: start;\n      background: var(--na-bg);\n      border: 1px solid var(--na-border);\n      border-radius: var(--na-radius);\n      padding: 22px 19px;\n      box-shadow: var(--na-shadow);\n      display: flex;\n      flex-direction: column;\n      min-height: 205px;\n    }\n\n    .na-card-icon {\n      width: 42px;\n      height: 42px;\n      border-radius: 13px;\n      background: var(--na-soft);\n      border: 1px solid var(--na-border);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      margin-bottom: 18px;\n      color: #403c36;\n      flex-shrink: 0;\n    }\n\n    .na-card-icon svg {\n      width: 21px;\n      height: 21px;\n      stroke: currentColor;\n      fill: none;\n      stroke-width: 1.6;\n      stroke-linecap: round;\n      stroke-linejoin: round;\n    }\n\n    .na-card-title {\n      margin: 0 0 7px;\n      font-size: 17px;\n      line-height: 1.35;\n      font-weight: 600;\n      letter-spacing: -0.01em;\n    }\n\n    .na-card-text {\n      margin: 0;\n      color: var(--na-muted);\n      font-size: 14px;\n      line-height: 1.65;\n    }\n\n    .na-swipe-hint {\n      display: flex;\n      align-items: center;\n      gap: 7px;\n      margin-top: 2px;\n      color: #918b83;\n      font-size: 11px;\n      letter-spacing: 0.02em;\n    }\n\n    .na-swipe-arrow {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: 22px;\n      height: 22px;\n      border: 1px solid var(--na-border);\n      border-radius: 50%;\n      background: #fff;\n    }\n\n    .na-swipe-arrow svg {\n      width: 12px;\n      height: 12px;\n      stroke: currentColor;\n      fill: none;\n      stroke-width: 1.5;\n    }\n\n    \/* =====================================================\n       DESCRIPTION\n       ===================================================== *\/\n\n    .na-description {\n      background: #fff;\n      border: 1px solid var(--na-border);\n      border-radius: var(--na-radius);\n      padding: 23px 20px;\n      box-shadow: var(--na-shadow);\n    }\n\n    .na-description-title {\n      margin: 0 0 12px;\n      font-size: 19px;\n      line-height: 1.35;\n      font-weight: 600;\n    }\n\n    .na-description p {\n      margin: 0;\n      color: var(--na-muted);\n      font-size: 14px;\n      line-height: 1.75;\n    }\n\n    \/* =====================================================\n       TECHNICAL GRID\n       ===================================================== *\/\n\n    .na-tech-grid {\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 10px;\n    }\n\n    .na-tech-item {\n      background: #fff;\n      border: 1px solid var(--na-border);\n      border-radius: 16px;\n      padding: 16px 15px;\n      min-width: 0;\n    }\n\n    .na-tech-label {\n      display: block;\n      margin-bottom: 4px;\n      color: #888177;\n      font-size: 11px;\n      line-height: 1.35;\n      text-transform: uppercase;\n      letter-spacing: 0.08em;\n    }\n\n    .na-tech-value {\n      display: block;\n      color: var(--na-text);\n      font-size: 14px;\n      line-height: 1.45;\n      font-weight: 600;\n    }\n\n    \/* =====================================================\n       TRUST \/ WARNING\n       ===================================================== *\/\n\n    .na-trust {\n      display: flex;\n      gap: 13px;\n      align-items: flex-start;\n      padding: 18px;\n      background: var(--na-soft);\n      border: 1px solid var(--na-border);\n      border-radius: 18px;\n    }\n\n    .na-trust-icon {\n      width: 36px;\n      height: 36px;\n      flex: 0 0 36px;\n      border-radius: 50%;\n      background: #fff;\n      border: 1px solid var(--na-border);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .na-trust-icon svg {\n      width: 17px;\n      height: 17px;\n      stroke: #555047;\n      fill: none;\n      stroke-width: 1.6;\n      stroke-linecap: round;\n      stroke-linejoin: round;\n    }\n\n    .na-trust-content strong {\n      display: block;\n      margin-bottom: 3px;\n      font-size: 14px;\n      line-height: 1.4;\n      font-weight: 600;\n    }\n\n    .na-trust-content p {\n      margin: 0;\n      color: var(--na-muted);\n      font-size: 13px;\n      line-height: 1.6;\n    }\n\n    \/* =====================================================\n       CTA\n       ===================================================== *\/\n\n    .na-cta-wrap {\n      margin-top: 30px;\n      padding-bottom: 5px;\n    }\n\n    .na-cta {\n      width: 100%;\n      min-height: 52px;\n      padding: 14px 22px;\n      border-radius: 14px;\n      background: #24231f;\n      color: #fff !important;\n      text-decoration: none !important;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 14px;\n      font-weight: 600;\n      letter-spacing: 0.01em;\n      transition:\n        transform 0.2s ease,\n        background 0.2s ease,\n        box-shadow 0.2s ease;\n    }\n\n    .na-cta:hover {\n      background: #171613;\n      transform: translateY(-1px);\n      box-shadow: 0 8px 22px rgba(25, 23, 20, 0.14);\n    }\n\n    .na-cta:active {\n      transform: translateY(0);\n    }\n\n    \/* =====================================================\n       DESKTOP\n       ===================================================== *\/\n\n    @media (min-width: 750px) {\n\n      .nubretto-atlas-product {\n        padding-left: 8px;\n        padding-right: 8px;\n      }\n\n      .na-hero {\n        padding-top: 12px;\n        padding-bottom: 38px;\n      }\n\n      .na-intro {\n        font-size: 15px;\n      }\n\n      .na-section {\n        margin-top: 46px;\n      }\n\n      .na-cards {\n        display: grid;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 16px;\n        overflow: visible;\n        padding: 3px;\n      }\n\n      .na-card {\n        min-height: 220px;\n        padding: 25px 23px;\n      }\n\n      .na-swipe-hint {\n        display: none;\n      }\n\n      .na-description {\n        padding: 28px 30px;\n      }\n\n      .na-description p {\n        max-width: 900px;\n      }\n\n      .na-tech-grid {\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 14px;\n      }\n\n      .na-tech-item {\n        padding: 18px;\n      }\n\n      .na-cta {\n        width: auto;\n        min-width: 230px;\n        display: inline-flex;\n        padding-left: 30px;\n        padding-right: 30px;\n      }\n    }\n\n    \/* =====================================================\n       LARGE DESKTOP\n       ===================================================== *\/\n\n    @media (min-width: 1000px) {\n\n      .na-cards {\n        grid-template-columns: repeat(4, minmax(0, 1fr));\n        gap: 17px;\n      }\n\n      .na-card {\n        min-height: 245px;\n      }\n\n      .na-card-title {\n        font-size: 18px;\n      }\n\n      .na-card-text {\n        font-size: 14px;\n      }\n\n      .na-description {\n        padding: 30px 34px;\n      }\n\n      .na-tech-grid {\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n      }\n    }\n\n    \/* =====================================================\n       REDUCED MOTION\n       ===================================================== *\/\n\n    @media (prefers-reduced-motion: reduce) {\n      .na-cards {\n        scroll-behavior: auto;\n      }\n\n      .na-cta {\n        transition: none;\n      }\n    }\n  \u003c\/style\u003e\n\u003cdiv class=\"nubretto-atlas-product\"\u003e\n\u003c!-- =====================================================\n       1. EYEBROW + HOOK + INTRO\n       ===================================================== --\u003e\n\u003csection class=\"na-hero\"\u003e\u003cspan class=\"na-eyebrow\"\u003e Nubretto Atlas Deri Kartlık \u003c\/span\u003e\n\u003ch2 class=\"na-hook\"\u003eŞıklık ve Fonksiyonellik Bir Arada\u003c\/h2\u003e\n\u003cp class=\"na-intro\"\u003eGünlük kullanımda ihtiyaç duyduğunuz düzeni tek tasarımda sunan Nubretto Atlas; kart, nakit ve bozuk paralarınızı güvenle taşımanız için fonksiyonel bölmeleriyle öne çıkar.\u003c\/p\u003e\n\u003c\/section\u003e\n\u003c!-- =====================================================\n       4. FEATURE CARDS\n       ===================================================== --\u003e\n\u003csection class=\"na-section\"\u003e\n\u003ch3 class=\"na-section-title\"\u003eÖne Çıkan Özellikler\u003c\/h3\u003e\n\u003cdiv class=\"na-cards-wrap\"\u003e\n\u003cdiv class=\"na-cards\" data-na-slider=\"\"\u003e\n\u003c!-- CARD 1 --\u003e\n\u003carticle class=\"na-card\"\u003e\n\u003cdiv class=\"na-card-icon\"\u003e\u003csvg viewbox=\"0 0 24 24\"\u003e\n              \u003crect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\"\u003e\u003c\/rect\u003e\n              \u003cpath d=\"M3 10h18\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M7 15h3\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\u003c\/div\u003e\n\u003ch4 class=\"na-card-title\"\u003eHakiki Deri\u003c\/h4\u003e\n\u003cp class=\"na-card-text\"\u003eDayanıklı ve kaliteli hakiki deri yapısıyla sade ve şık bir kullanım sunar.\u003c\/p\u003e\n\u003c\/article\u003e\n\u003c!-- CARD 2 --\u003e\n\u003carticle class=\"na-card\"\u003e\n\u003cdiv class=\"na-card-icon\"\u003e\u003csvg viewbox=\"0 0 24 24\"\u003e\n              \u003crect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\"\u003e\u003c\/rect\u003e\n              \u003cpath d=\"M7 9h10\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M7 13h5\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M7 16h3\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\u003c\/div\u003e\n\u003ch4 class=\"na-card-title\"\u003e7 Kart Kapasitesi\u003c\/h4\u003e\n\u003cp class=\"na-card-text\"\u003eKartlarınızı düzenli ve erişilebilir bir şekilde taşımanız için 7 kart kapasitesi sunar.\u003c\/p\u003e\n\u003c\/article\u003e\n\u003c!-- CARD 3 --\u003e\n\u003carticle class=\"na-card\"\u003e\n\u003cdiv class=\"na-card-icon\"\u003e\u003csvg viewbox=\"0 0 24 24\"\u003e\n              \u003crect x=\"2.5\" y=\"6\" width=\"19\" height=\"12\" rx=\"2\"\u003e\u003c\/rect\u003e\n              \u003cpath d=\"M6 10h12\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M7 14h4\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\u003c\/div\u003e\n\u003ch4 class=\"na-card-title\"\u003eGeniş Nakit Bölmesi\u003c\/h4\u003e\n\u003cp class=\"na-card-text\"\u003eKağıt paralarınızı katlamadan veya sıkıştırmadan rahatça koyabileceğiniz geniş alan.\u003c\/p\u003e\n\u003c\/article\u003e\n\u003c!-- CARD 4 --\u003e\n\u003carticle class=\"na-card\"\u003e\n\u003cdiv class=\"na-card-icon\"\u003e\u003csvg viewbox=\"0 0 24 24\"\u003e\n              \u003crect x=\"3\" y=\"6\" width=\"18\" height=\"12\" rx=\"2\"\u003e\u003c\/rect\u003e\n              \u003cpath d=\"M7 6v12\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M10 9h8\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M10 15h5\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\u003c\/div\u003e\n\u003ch4 class=\"na-card-title\"\u003eFermuarlı Mini Cep\u003c\/h4\u003e\n\u003cp class=\"na-card-text\"\u003eBozuk paralarınızı kaybetmeden taşımanıza yardımcı olan güvenli ve pratik fermuarlı bölme.\u003c\/p\u003e\n\u003c\/article\u003e\n\u003c!-- CARD 5 --\u003e\n\u003carticle class=\"na-card\"\u003e\n\u003cdiv class=\"na-card-icon\"\u003e\u003csvg viewbox=\"0 0 24 24\"\u003e\n              \u003crect x=\"4\" y=\"3\" width=\"16\" height=\"18\" rx=\"2\"\u003e\u003c\/rect\u003e\n              \u003cpath d=\"M8 7h8\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M8 12h8\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M8 17h5\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\u003c\/div\u003e\n\u003ch4 class=\"na-card-title\"\u003eSağlam Çıtçıt Kapanış\u003c\/h4\u003e\n\u003cp class=\"na-card-text\"\u003eGüçlü çıtçıt mekanizması sayesinde eşyalarınızı güvenli şekilde kapalı tutmaya yardımcı olur.\u003c\/p\u003e\n\u003c\/article\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"na-swipe-hint\"\u003e\n\u003cspan class=\"na-swipe-arrow\"\u003e \u003csvg viewbox=\"0 0 24 24\"\u003e\n            \u003cpath d=\"M8 12h8\"\u003e\u003c\/path\u003e\n            \u003cpath d=\"m13 7 5 5-5 5\"\u003e\u003c\/path\u003e\n          \u003c\/svg\u003e \u003c\/span\u003e Özellikleri görmek için kaydırın\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003c!-- =====================================================\n       5. DESCRIPTION\n       ===================================================== --\u003e\n\u003csection class=\"na-section\"\u003e\n\u003cdiv class=\"na-description\"\u003e\n\u003ch3 class=\"na-description-title\"\u003eNubretto Atlas Deri Kartlık\u003c\/h3\u003e\n\u003cp\u003eGünlük kullanımda ihtiyacınız olan tüm düzeni sağlayan Nubretto Atlas, kaliteli deri yapısı ve fonksiyonel bölmeleriyle öne çıkıyor. Hem kartlarınızı hem de nakit ve bozuk paralarınızı güvenle taşımanız için özel olarak tasarlanmıştır.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003c!-- =====================================================\n       6. TECHNICAL INFO GRID\n       ===================================================== --\u003e\n\u003csection class=\"na-section\"\u003e\n\u003ch3 class=\"na-section-title\"\u003eTeknik Bilgiler\u003c\/h3\u003e\n\u003cdiv class=\"na-tech-grid\"\u003e\n\u003cdiv class=\"na-tech-item\"\u003e\n\u003cspan class=\"na-tech-label\"\u003eMalzeme\u003c\/span\u003e \u003cspan class=\"na-tech-value\"\u003eHakiki Deri\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"na-tech-item\"\u003e\n\u003cspan class=\"na-tech-label\"\u003eKart Kapasitesi\u003c\/span\u003e \u003cspan class=\"na-tech-value\"\u003e7 Kart\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"na-tech-item\"\u003e\n\u003cspan class=\"na-tech-label\"\u003eNakit Bölmesi\u003c\/span\u003e \u003cspan class=\"na-tech-value\"\u003eGeniş Nakit Bölmesi\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"na-tech-item\"\u003e\n\u003cspan class=\"na-tech-label\"\u003eBozuk Para\u003c\/span\u003e \u003cspan class=\"na-tech-value\"\u003eFermuarlı Mini Bölme\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"na-tech-item\"\u003e\n\u003cspan class=\"na-tech-label\"\u003eKapanış\u003c\/span\u003e \u003cspan class=\"na-tech-value\"\u003eÇıtçıt Kapanış\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"na-tech-item\"\u003e\n\u003cspan class=\"na-tech-label\"\u003eÖlçüler\u003c\/span\u003e \u003cspan class=\"na-tech-value\"\u003e9.5 × 7.5 × 1.5 cm\u003c\/span\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003c!-- =====================================================\n       7. TRUST \/ WARNING\n       ===================================================== --\u003e\n\u003csection class=\"na-section\"\u003e\n\u003cdiv class=\"na-trust\"\u003e\n\u003cdiv class=\"na-trust-icon\"\u003e\u003csvg viewbox=\"0 0 24 24\"\u003e\n          \u003cpath d=\"M12 3 20 6v5c0 5-3.3 8.5-8 10-4.7-1.5-8-5-8-10V6l8-3Z\"\u003e\u003c\/path\u003e\n          \u003cpath d=\"m9 12 2 2 4-4\"\u003e\u003c\/path\u003e\n        \u003c\/svg\u003e\u003c\/div\u003e\n\u003cdiv class=\"na-trust-content\"\u003e\n\u003cstrong\u003e Doğal deri dokusu \u003c\/strong\u003e\n\u003cp\u003eHakiki deri yapısı nedeniyle ürünün yüzeyinde doğal doku farklılıkları görülebilir. Bu farklılıklar derinin doğal yapısının bir parçasıdır.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003c!-- =====================================================\n       8. CTA\n       ===================================================== --\u003e\n\u003cdiv class=\"na-cta-wrap\"\u003e\u003ca class=\"na-cta\" href=\"#AddToCart\"\u003e Nubretto Atlas'ı İncele \u003c\/a\u003e\u003c\/div\u003e\n\u003c!-- =====================================================\n       JS — MOBILE SWIPE SUPPORT\n       ===================================================== --\u003e \u003cscript\u003e\n    (function () {\n      var root = document.querySelector('.nubretto-atlas-product');\n\n      if (!root) return;\n\n      var slider = root.querySelector('[data-na-slider]');\n\n      if (!slider) return;\n\n      var isDown = false;\n      var startX = 0;\n      var scrollLeft = 0;\n\n      slider.addEventListener('mousedown', function (e) {\n        if (window.innerWidth \u003e= 750) return;\n\n        isDown = true;\n        startX = e.pageX - slider.offsetLeft;\n        scrollLeft = slider.scrollLeft;\n      });\n\n      slider.addEventListener('mouseleave', function () {\n        isDown = false;\n      });\n\n      slider.addEventListener('mouseup', function () {\n        isDown = false;\n      });\n\n      slider.addEventListener('mousemove', function (e) {\n        if (!isDown || window.innerWidth \u003e= 750) return;\n\n        e.preventDefault();\n\n        var x = e.pageX - slider.offsetLeft;\n        var walk = (x - startX) * 1.15;\n\n        slider.scrollLeft = scrollLeft - walk;\n      });\n    })();\n  \u003c\/script\u003e\n\u003c\/div\u003e","brand":"Nubretto","offers":[{"title":"Taba","offer_id":67598222360878,"sku":null,"price":1199.0,"currency_code":"TRY","in_stock":true},{"title":"Siyah","offer_id":67598222393646,"sku":null,"price":1199.0,"currency_code":"TRY","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0939\/0935\/2750\/files\/Atlas1.png?v=1790860906","url":"https:\/\/nubretto.com\/products\/nubretto-atlas-deri-kartlik","provider":"Nubretto","version":"1.0","type":"link"}