/*
 * YEKTEK site-wide visual system
 * Red / white / black remain the brand core.
 * Petrol is reserved for technical information; gold is reserved for trust/premium details.
 */

:root {
  --yek-petrol: #0b6670;
  --yek-petrol-dark: #084b53;
  --yek-petrol-soft: #edf8f8;
  --yek-gold: #b8892e;
  --yek-gold-soft: #fff8e9;
  --yek-canvas: #f3f6f9;
  --yek-surface: #ffffff;
  --yek-ink: #121b27;
  --yek-muted: #627187;
  --yek-line: #dce4ec;
  --yek-radius: 14px;
  --yek-radius-lg: 20px;
  --yek-shadow: 0 14px 36px rgba(18, 27, 39, .07);
  --yek-shadow-hover: 0 22px 52px rgba(18, 27, 39, .11);
}

/* Uzun kategori, ürün ve rehber sayfalarında tek dokunuşla başa dönüş. */
.yk-back-to-top {
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 80;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 15px;
  background: #111b27;
  box-shadow: 0 12px 30px rgba(17, 27, 39, .24);
  color: #fff;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity .18s ease, transform .18s ease, background .18s ease;
}

.yk-back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.yk-back-to-top:hover {
  background: #e31b35;
}

.yk-back-to-top i {
  font-size: 18px;
}

/* Mobilde sabit işlem çubukları ile üst üste gelmesini önler. */
@media (max-width: 680px) {
  body.yk-has-mobile-socialbar .yk-back-to-top,
  body:has(.yk-mobile-socialbar) .yk-back-to-top,
  body:has(.yk-mobile-buybar) .yk-back-to-top {
    bottom: calc(88px + env(safe-area-inset-bottom));
  }
}

.article-index-page .resource-secondary {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  border: 1px solid #d7e0e9;
  border-radius: 10px;
  background: #fff;
  color: #111b27;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.article-index-page .resource-secondary:hover {
  border-color: #e31b35;
  color: #e31b35;
}

@media (prefers-reduced-motion: reduce) {
  .yk-back-to-top {
    transition: none;
  }
}

html {
  background: var(--yek-canvas);
}

body {
  background:
    radial-gradient(circle at 96% 6%, rgba(11, 102, 112, .045), transparent 24%),
    radial-gradient(circle at 3% 34%, rgba(215, 25, 47, .035), transparent 20%),
    var(--yek-canvas);
  color: var(--yek-ink);
}

body::before {
  background: linear-gradient(90deg, #d7192f 0 72%, var(--yek-petrol) 72% 88%, var(--yek-gold) 88% 100%);
}

::selection {
  background: rgba(215, 25, 47, .16);
  color: #0f1722;
}

a,
button,
input,
select,
textarea {
  transition-duration: .18s;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(11, 102, 112, .22);
  outline-offset: 3px;
}

/* Header: familiar structure, cleaner hierarchy. */
body > .topbar {
  border-bottom: 1px solid #272e38;
  background: #111822;
}

body > .topbar .topbar__items span {
  border-color: #394554;
  background: rgba(255, 255, 255, .07);
  color: #f2f5f8;
  box-shadow: none;
}

body > .topbar .topbar__items span i {
  color: #ff4058;
}

body > .topbar .topbar__items span:nth-child(2) i {
  color: var(--yek-petrol);
}

body > .header {
  border-bottom: 1px solid var(--yek-line);
  background: rgba(255, 255, 255, .985);
  box-shadow: 0 8px 24px rgba(18, 27, 39, .045);
}

body > .header .header__grid {
  min-height: 86px;
}

body > .header .search {
  border-color: #ced8e3;
  border-radius: 12px;
  box-shadow: 0 7px 20px rgba(18, 27, 39, .05);
}

body > .header .search:focus-within {
  border-color: var(--yek-petrol);
  box-shadow: 0 0 0 4px rgba(11, 102, 112, .09), 0 10px 25px rgba(18, 27, 39, .06);
}

body > .header .search button {
  border-radius: 9px;
  background: #d7192f;
}

body > .header .action-btn {
  border-color: var(--yek-line);
  border-radius: 10px;
}

body > .header .action-btn--wa {
  border-color: #cce8da;
  background: #f2faf6;
}

body > .header .action-cart {
  border-color: #121b27;
  background: #121b27;
}

/* Navigation remains in the same order and interaction model. */
body > .nav {
  border-bottom: 1px solid var(--yek-line);
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 8px 22px rgba(18, 27, 39, .05);
}

body > .nav .wrap {
  min-height: 58px;
  gap: 10px;
}

body > .nav .nav-trigger,
body > .nav .nav-direct {
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid #d9e2eb;
  border-radius: 10px;
  color: #17212e;
  background: #fff;
  box-shadow: 0 4px 12px rgba(18, 27, 39, .025);
}

body > .nav .nav-trigger:hover,
body > .nav .nav-trigger.is-active,
body > .nav .nav-direct:hover {
  border-color: #f0aeb8;
  color: #c91830;
  background: #fff6f7;
}

body > .nav .nav-trigger.is-active {
  box-shadow: inset 0 -2px 0 #d7192f;
}

body > .nav .nav-trigger:nth-of-type(3) > i:first-child {
  color: var(--yek-petrol);
}

body > .nav .nav-trigger:nth-of-type(4) > i:first-child {
  color: var(--yek-gold);
}

body > .nav .nav-direct[href="indirimdekiler.html"],
body > .nav .nav-direct[href="#indirimli-urunler"],
body > .nav .nav-direct[href="index.html#indirimli-urunler"] {
  border-color: #d7192f;
  border-radius: 10px;
  background: #d7192f;
  box-shadow: 0 8px 18px rgba(215, 25, 47, .16);
}

/* Keep the complete shopping header visible at every responsive size. */
:root {
  --yk-sticky-header-height: 86px;
  --yk-sticky-nav-height: 58px;
}

html {
  scroll-padding-top: calc(var(--yk-sticky-header-height) + var(--yk-sticky-nav-height) + 16px);
}

body > .header {
  position: relative;
  top: auto;
  z-index: 120;
}

body > .nav {
  position: relative;
  top: auto;
  z-index: 110;
}

body > .yk-sticky-stack-placeholder {
  height: 0;
  pointer-events: none;
}

html.yk-sticky-stack-detached body > .yk-sticky-stack-placeholder {
  height: calc(var(--yk-sticky-header-height) + var(--yk-sticky-nav-height));
}

html.yk-sticky-stack-detached body > .header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
}

html.yk-sticky-stack-detached body > .nav {
  position: fixed;
  top: var(--yk-sticky-header-height);
  right: 0;
  left: 0;
  width: 100%;
}

html.yk-sticky-stack-detached body > .header,
html.yk-sticky-stack-detached body > .nav {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: none;
}

html.yk-sticky-stack-detached.yk-sticky-stack-active body > .header,
html.yk-sticky-stack-detached.yk-sticky-stack-active body > .nav {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transition: opacity .18s ease;
}

.nav-panel {
  border-color: var(--yek-line);
  border-top: 3px solid #d7192f;
  border-radius: 0 0 18px 18px;
  background: rgba(255, 255, 255, .99);
  box-shadow: 0 28px 64px rgba(18, 27, 39, .15);
}

.category-rail-main,
.menu-link-card,
.brand-card {
  border-color: var(--yek-line) !important;
  border-radius: 12px !important;
}

.category-rail-main:hover,
.menu-link-card:hover,
.brand-card:hover {
  border-color: #bdcbd8 !important;
  background: #f8fafc !important;
}

.menu-link-card--trust i,
.menu-link-card--official i {
  color: var(--yek-gold) !important;
  background: var(--yek-gold-soft) !important;
}

/* Shared page openings. */
.listing-hero,
.plain-hero,
.page-hero {
  overflow: hidden;
  border: 1px solid var(--yek-line);
  border-left: 0;
  border-radius: var(--yek-radius-lg);
  background:
    radial-gradient(circle at 91% 18%, rgba(215, 25, 47, .105), transparent 26%),
    linear-gradient(135deg, #fff 0%, #f9fbfd 74%, #fff4f6 100%);
  box-shadow: var(--yek-shadow);
}

.listing-hero::before,
.plain-hero::before,
.page-hero::before {
  content: "";
  display: block;
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(#d7192f 0 72%, var(--yek-petrol) 72% 100%);
}

.listing-hero,
.plain-hero,
.page-hero {
  position: relative;
  padding: clamp(24px, 3vw, 38px);
}

.listing-hero h1,
.plain-hero h1,
.page-hero h1 {
  color: #111a25;
  font-weight: 780;
  letter-spacing: -.04em;
}

.listing-hero p,
.plain-hero p,
.page-hero p {
  max-width: 850px;
  color: var(--yek-muted);
  line-height: 1.65;
}

.eyebrow {
  color: #cb1930;
  letter-spacing: .09em;
}

/* Cards and page sections. */
.panel,
.card,
.content-card,
.policy-card,
.article-card,
.reviews-card,
.video-card,
.checkout-card,
.home-resource-card,
.description-card,
.compat-card,
.certificate-card,
.resource-card,
.media-trust-card {
  border-color: var(--yek-line);
  border-radius: var(--yek-radius);
  background-color: var(--yek-surface);
  box-shadow: 0 10px 28px rgba(18, 27, 39, .055);
}

.section-head {
  align-items: end;
}

@media (max-width: 640px) {
  .home-page .section-head {
    align-items: flex-start;
  }

  .home-page .section-head > :first-child {
    width: 100%;
  }

  .home-page .section-head > .section-link {
    align-self: flex-end;
  }
}

.section-head h2,
.media-trust-head h2 {
  color: #121b27;
  font-weight: 760;
  letter-spacing: -.035em;
}

.section-head p:not(.eyebrow),
.media-trust-head p:not(.eyebrow) {
  color: var(--yek-muted);
}

.more-reviews,
.resource-link {
  border-color: #d6e0ea;
  border-radius: 10px;
  background: #fff;
  color: #172231;
}

.more-reviews:hover,
.resource-link:hover {
  border-color: var(--yek-petrol);
  color: #fff;
  background: var(--yek-petrol);
}

.section-link {
  border-color: #d52238;
  border-radius: 10px;
  background: #d52238;
  color: #fff;
  box-shadow: 0 8px 18px rgba(213, 34, 56, .16);
}

.section-link:hover,
.section-link:focus-visible {
  border-color: #ad1629;
  background: #ad1629;
  color: #fff;
}

.home-benefits article,
.home-resource-card,
.category-feature,
.feature,
.description-card {
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.home-benefits article:hover,
.home-resource-card:hover,
.category-feature:hover,
.feature:hover,
.description-card:hover {
  transform: translateY(-2px);
  border-color: #c9d5e1;
  box-shadow: var(--yek-shadow);
}

.home-benefits article:nth-child(3n + 2) i,
.home-resource-card:nth-child(even) i,
.category-feature:nth-child(3n + 2) i {
  color: var(--yek-petrol);
  background: var(--yek-petrol-soft);
}

.home-benefits article:nth-child(3n) i,
.category-feature:nth-child(3n) i {
  color: var(--yek-gold);
  background: var(--yek-gold-soft);
}

/* Product listings: preserve product media and make the total easier to find. */
.product-grid {
  gap: 18px;
}

.product-card {
  border-color: var(--yek-line);
  border-radius: 16px;
  box-shadow: 0 9px 26px rgba(18, 27, 39, .055);
}

.product-card:hover {
  transform: translateY(-3px);
  border-color: #c6d2de;
  box-shadow: var(--yek-shadow-hover);
}

.product-card__media,
.product-card .product-image {
  border-bottom-color: #e8edf2;
  background: linear-gradient(145deg, #fbfcfd, #f2f5f8);
}

.product-card h3,
.product-card h3 a {
  color: #15202d;
}

.product-card .monthly,
.product-card .price-row strong {
  color: #29384b;
}

.product-card .total,
.product-card .total-price {
  color: #111b27;
  font-size: 13.5px;
  font-weight: 760;
}

.product-card .badges span:has(.fa-shield),
.product-card .chips span:has(.fa-shield) {
  border-color: #eadbbd;
  color: #88661f;
  background: var(--yek-gold-soft);
}

.product-card .badges span:has(.fa-info-circle),
.product-card .chips span:has(.fa-info-circle) {
  border-color: #cce5e7;
  color: var(--yek-petrol-dark);
  background: var(--yek-petrol-soft);
}

/* Filters, navigation aids and forms. */
.toolbar,
.listing-toolbar,
.filter-bar,
.sort-bar,
.breadcrumb,
.breadcrumbs,
.pagination {
  border-color: var(--yek-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 7px 20px rgba(18, 27, 39, .035);
}

.breadcrumb a,
.breadcrumbs a {
  color: #4c5c70;
}

.breadcrumb a:hover,
.breadcrumbs a:hover {
  color: #d7192f;
}

input,
select,
textarea {
  border-color: #ced8e3;
  border-radius: 10px;
  background: #fff;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--yek-petrol);
  box-shadow: 0 0 0 3px rgba(11, 102, 112, .1);
}

.primary-action,
.step-next--primary,
button[type="submit"] {
  border-radius: 10px;
  background: #d7192f;
  box-shadow: 0 8px 20px rgba(215, 25, 47, .16);
}

.primary-action:hover,
.step-next--primary:hover,
button[type="submit"]:hover {
  background: #b91328;
}

/* Product detail and technical areas. */
.gallery,
.buy-panel {
  border-color: var(--yek-line);
  border-radius: 18px;
  box-shadow: var(--yek-shadow);
}

.buy-panel .support-box,
.field-note,
.technical-note,
.info-box {
  border-color: #cce4e7;
  background: var(--yek-petrol-soft);
}

.buy-panel .support-box i,
.field-note i,
.technical-note i,
.info-box i {
  color: var(--yek-petrol);
}

.certificate-card,
.official-card,
.trust-card {
  border-color: #eadcc1;
  background: linear-gradient(145deg, #fff, #fffaf0);
}

.certificate-card i,
.official-card i,
.trust-card i {
  color: var(--yek-gold);
}

table {
  border-color: var(--yek-line);
  border-radius: 12px;
  overflow: hidden;
}

th {
  background: #f1f5f8;
  color: #263548;
}

tr:nth-child(even) td {
  background: #fafbfd;
}

/* Footer closes every page with the same brand language. */
.footer {
  border-top: 3px solid #d7192f;
  background:
    radial-gradient(circle at 12% 0, rgba(215, 25, 47, .18), transparent 27%),
    radial-gradient(circle at 88% 100%, rgba(11, 102, 112, .18), transparent 25%),
    #0e151e;
}

.footer p,
.footer li a,
.footer__mini a {
  color: #adb9c7;
}

.footer li a:hover,
.footer__mini a:hover {
  color: #fff;
}

.footer__actions a {
  border-radius: 10px;
}

.footer__actions a:last-child {
  border-color: #304152;
  background: #172331;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Keep the homepage video rail readable on narrow screens. Grid implicit tracks
   could collapse when several cards were present, so mobile uses a flex rail. */
@media (max-width: 720px) {
  .home-video-track {
    display: flex;
    align-items: stretch;
    gap: 10px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
  }

  .home-video-track .home-video-card {
    flex: 0 0 min(82vw, 320px);
    width: min(82vw, 320px);
    min-width: 0;
    scroll-snap-align: start;
  }
}

@media (max-width: 980px) {
  body > .nav .wrap {
    gap: 7px;
  }

  body > .nav .nav-trigger,
  body > .nav .nav-direct {
    padding: 0 11px;
  }
}

@media (max-width: 720px) {
  body {
    background: #f5f7f9;
  }

  body > .header .header__grid {
    min-height: auto;
  }

  body > .nav {
    background: #fff;
  }

  body > .nav .wrap {
    gap: 6px;
  }

  body > .nav .nav-trigger,
  body > .nav .nav-direct {
    min-height: 38px;
    border-radius: 9px;
  }

  .listing-hero,
  .plain-hero,
  .page-hero {
    padding: 20px 17px;
    border-radius: 15px;
  }

  .panel,
  .card,
  .content-card,
  .policy-card,
  .article-card,
  .reviews-card,
  .video-card,
  .home-resource-card,
  .description-card,
  .compat-card,
  .certificate-card,
  .resource-card,
  .media-trust-card {
    border-radius: 12px;
  }

  .product-grid {
    gap: 10px;
  }

  .product-card {
    border-radius: 12px;
  }

  .product-card:hover,
  .home-benefits article:hover,
  .home-resource-card:hover,
  .category-feature:hover,
  .feature:hover,
  .description-card:hover {
    transform: none;
  }

  .product-card .total,
  .product-card .total-price {
    font-size: 12px;
  }

  /* Comfortable touch targets without changing the desktop density. */
  button,
  input,
  select,
  textarea,
  summary,
  [role="button"] {
    min-height: 44px;
    touch-action: manipulation;
  }

  body > .nav .nav-trigger,
  body > .nav .nav-direct,
  .product-card .card-actions button,
  .product-card .card-actions a,
  .product-card .actions button,
  .product-card .actions a,
  .slider-btn,
  .primary-action,
  .dark-action,
  .step-next,
  .resource-primary {
    min-height: 44px;
  }

  .slider-btn,
  .premium-showcase-nav button {
    min-width: 44px;
  }

  main h1,
  main h2,
  main h3,
  .product-title,
  .search-result-body b {
    overflow-wrap: anywhere;
    text-wrap: balance;
  }

  main p,
  main li,
  .lead,
  .description-lead {
    line-height: 1.6;
  }

  .article-index-page .article-index-hero {
    gap: 14px;
    padding: 18px 16px;
  }

  .article-index-page .article-index-hero h1 {
    font-size: clamp(25px, 8vw, 31px);
    line-height: 1.08;
  }

  .article-index-page .article-index-hero .lead {
    margin-top: 10px;
    font-size: 14px;
    line-height: 1.55;
  }

  .article-index-page .article-hero-tags {
    gap: 6px;
    margin-top: 10px;
  }

  .article-index-page .article-index-panel {
    gap: 8px;
    padding: 15px;
  }

  .article-index-page .article-index-panel > span {
    display: none;
  }

  .article-index-page .article-index-panel .resource-primary {
    width: 100%;
  }

  .article-index-page .article-index-panel .resource-secondary {
    width: 100%;
  }

  .article-index-page .article-index-section {
    padding-top: 16px;
  }

  .qty-control {
    grid-template-columns: 44px 48px 44px;
    height: 44px;
  }

  .qty-control button,
  .qty-control input,
  .cart-remove {
    height: 44px;
    min-height: 44px;
  }
}

/* Magicmotorsport / Flex official distributor proof */
.flex-official-proof {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0 14px;
  padding: 10px 12px;
  border: 1px solid #d6e2ea;
  border-left: 3px solid #0c7080;
  border-radius: 12px;
  color: #152230;
  background: linear-gradient(135deg, #f7fbfc, #fff);
  text-decoration: none;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.flex-official-proof:hover {
  border-color: #89b6bf;
  box-shadow: 0 10px 24px rgba(17, 52, 65, .09);
  transform: translateY(-1px);
}
.flex-official-proof > i {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  background: #0c7080;
}
.flex-official-proof span { display: grid; gap: 2px; min-width: 0; }
.flex-official-proof b { font-size: 13px; line-height: 1.25; }
.flex-official-proof small { color: #64748b; font-size: 11px; line-height: 1.35; }
.flex-official-proof .fa-angle-right { margin-left: auto; color: #0c7080; }
.flex-brand-proof-wrap { padding-top: 0; padding-bottom: 4px; }
.flex-brand-proof { max-width: 760px; margin: 0; }

.magic-proof-brand img {
  max-width: 145px;
  max-height: 58px;
  object-fit: contain;
}
.magic-proof-preview {
  display: block;
  overflow: hidden;
  min-height: 0;
  background: #edf2f5;
}
.magic-proof-preview img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 760px;
  object-fit: contain;
  background: #fff;
}
.magic-proof-scope {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: 28px;
  align-items: center;
}
.magic-proof-scope__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.magic-proof-scope__grid article {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 150px;
  padding: 18px;
  border: 1px solid #dce6ec;
  border-radius: 15px;
  background: #f8fbfc;
}
.magic-proof-scope__grid i { color: #0c7080; font-size: 22px; }
.magic-proof-scope__grid b { color: #162330; font-size: 14px; }
.magic-proof-scope__grid span { color: #617184; font-size: 12px; line-height: 1.55; }

@media (max-width: 900px) {
  .magic-proof-scope { grid-template-columns: 1fr; }
  .magic-proof-scope__grid { grid-template-columns: 1fr; }
  .magic-proof-scope__grid article { min-height: 0; }
}

/* Magicmotorsport FLEX — product-specific detailed description */
.product-source-description .yt-product-desc {
  display: grid;
  gap: 18px;
  color: #172230;
}
.product-source-description .yt-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 4vw, 44px);
  border-radius: 20px;
  color: #fff;
  background:
    radial-gradient(circle at 88% 14%, rgba(227, 27, 53, .32), transparent 34%),
    linear-gradient(135deg, #101924 0%, #132638 58%, #0b5963 100%);
}
.product-source-description .yt-hero::after {
  content: "FLEX";
  position: absolute;
  right: 24px;
  bottom: -24px;
  color: rgba(255, 255, 255, .055);
  font-size: clamp(70px, 14vw, 170px);
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
}
.product-source-description .yt-hero > div { position: relative; z-index: 1; max-width: 780px; }
.product-source-description .yt-brand,
.product-source-description .yt-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: #e31b35;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .11em;
}
.product-source-description .yt-brand { color: #ff7a8c; }
.product-source-description .yt-hero h2 {
  max-width: 720px;
  margin: 0 0 14px;
  color: #fff;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.08;
}
.product-source-description .yt-hero p {
  margin: 0;
  color: #dce8ef;
  font-size: 16px;
  line-height: 1.75;
}
.product-source-description .yt-section {
  padding: clamp(20px, 3vw, 30px);
  border: 1px solid #dbe5ed;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(20, 38, 55, .055);
}
.product-source-description .yt-section-heading { margin-bottom: 18px; }
.product-source-description .yt-section h3 {
  margin: 0 0 8px;
  color: #142131;
  font-size: clamp(22px, 3vw, 29px);
  line-height: 1.2;
}
.product-source-description .yt-section-heading p { max-width: 820px; margin: 0; color: #63758a; }
.product-source-description .yt-table-wrap {
  overflow-x: auto;
  border: 1px solid #d9e3eb;
  border-radius: 14px;
  background: #fff;
  -webkit-overflow-scrolling: touch;
}
.product-source-description .yt-flex-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}
.product-source-description .yt-flex-table th {
  padding: 13px 15px;
  color: #fff;
  background: #142131;
  font-size: 13px;
  text-align: left;
}
.product-source-description .yt-flex-table td {
  padding: 14px 15px;
  border-top: 1px solid #e5ebf0;
  color: #46586c;
  font-size: 14px;
  vertical-align: middle;
}
.product-source-description .yt-flex-table tbody tr:nth-child(even) { background: #f8fafc; }
.product-source-description .yt-flex-table td:first-child { color: #172230; }
.product-source-description .yt-flex-table td:nth-child(2),
.product-source-description .yt-flex-table td:nth-child(3) { white-space: nowrap; }
.product-source-description .yt-badge {
  display: inline-flex;
  min-width: 76px;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .04em;
}
.product-source-description .yt-badge.slave { color: #1764a6; background: #e8f3fd; }
.product-source-description .yt-badge.master { color: #08764c; background: #e8f8f0; }
.product-source-description .yt-flex-table .blue { color: #1764a6; }
.product-source-description .yt-flex-table .green { color: #08764c; }
.product-source-description .yt-price-note,
.product-source-description .yt-compat-note {
  margin: 14px 0 0;
  padding: 13px 15px;
  border-radius: 12px;
  color: #735522;
  background: #fff7e8;
  font-size: 13px;
  line-height: 1.6;
}
.product-source-description .yt-price-note i { margin-right: 7px; color: #b77b12; }
.product-source-description .yt-mode-grid,
.product-source-description .yt-feature-grid,
.product-source-description .yt-check-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.product-source-description .yt-mode-grid article {
  position: relative;
  min-height: 190px;
  padding: 22px;
  overflow: hidden;
  border: 1px solid #dce5ec;
  border-radius: 15px;
  background: linear-gradient(145deg, #fafdff, #f3f7fa);
}
.product-source-description .yt-mode-grid article > span {
  position: absolute;
  right: 12px;
  top: 4px;
  color: rgba(20, 33, 49, .07);
  font-size: 58px;
  font-weight: 900;
}
.product-source-description .yt-mode-grid h4 { margin: 0 0 10px; color: #e31b35; font-size: 24px; }
.product-source-description .yt-mode-grid p { position: relative; margin: 0; color: #5e7084; font-size: 14px; line-height: 1.65; }
.product-source-description .yt-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-source-description .yt-feature-grid > div {
  position: relative;
  padding: 15px 16px 15px 44px;
  border: 1px solid #dce5ec;
  border-radius: 13px;
  color: #34465a;
  background: #f8fbfc;
  font-weight: 650;
}
.product-source-description .yt-feature-grid > div::before {
  content: "\f00c";
  position: absolute;
  left: 15px;
  top: 15px;
  color: #087b68;
  font-family: FontAwesome;
}
.product-source-description .yt-note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  border-color: #f1d49d;
  background: linear-gradient(135deg, #fffaf0, #fff);
}
.product-source-description .yt-note-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: #142131;
  font-size: 20px;
}
.product-source-description .yt-note p { margin: 0 0 9px; color: #5c6877; }
.product-source-description .yt-note p:last-child { margin-bottom: 0; }
.product-source-description .yt-check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-source-description .yt-check-grid p {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 0;
  padding: 13px 14px;
  border-radius: 12px;
  color: #3e5063;
  background: #f5f9fb;
}
.product-source-description .yt-check-grid i { margin-top: 3px; color: #087b68; }

@media (max-width: 760px) {
  .product-source-description .yt-product-desc { gap: 13px; }
  .product-source-description .yt-hero,
  .product-source-description .yt-section { border-radius: 15px; }
  .product-source-description .yt-hero p { font-size: 14px; line-height: 1.65; }
  .product-source-description .yt-mode-grid,
  .product-source-description .yt-feature-grid,
  .product-source-description .yt-check-grid { grid-template-columns: 1fr; }
  .product-source-description .yt-mode-grid article { min-height: 0; padding: 18px; }
  .product-source-description .yt-note { grid-template-columns: 1fr; }
  .product-source-description .yt-flex-table { min-width: 660px; }
  .product-source-description .yt-flex-table th,
  .product-source-description .yt-flex-table td { padding: 11px 12px; font-size: 12px; }
}

/* FLEX açıklaması: mevcut ürün sayfasıyla aynı ritimde, taşmasız ve tek parça. */
.flex-product-description {
  padding: 0 !important;
  overflow: hidden;
  border-color: #d7e2eb !important;
  background: #f7fafc !important;
}
.flex-product-description .source-description-head {
  margin: 0 !important;
  padding: clamp(20px, 3vw, 30px) !important;
  border-bottom: 1px solid #dce5ec !important;
  background: #fff;
}
.flex-product-description .source-description-head h2 { margin-top: 7px; color: #152131; }
.flex-product-description .yt-product-desc { gap: 14px; padding: clamp(14px, 2vw, 22px); }
.flex-product-description .yt-hero { padding: clamp(22px, 3vw, 34px); border-radius: 16px; }
.flex-product-description .yt-hero h2 { font-size: clamp(25px, 3.1vw, 36px); }
.flex-product-description .yt-section {
  padding: clamp(18px, 2.5vw, 26px);
  border-radius: 15px;
  box-shadow: none;
}
.flex-product-description .yt-section h3 { font-size: clamp(20px, 2.4vw, 26px); }
.flex-product-description .yt-mode-grid article { min-height: 170px; }

@media (max-width: 760px) {
  .flex-product-description .source-description-head { padding: 18px 16px !important; }
  .flex-product-description .source-description-head h2 { font-size: 23px; }
  .flex-product-description .yt-product-desc { padding: 12px; }
  .flex-product-description .yt-hero,
  .flex-product-description .yt-section { padding: 17px; border-radius: 13px; }
  .flex-product-description .yt-hero::after { right: 8px; bottom: -8px; font-size: 76px; }
  .flex-product-description .yt-hero h2 { font-size: 25px; }
  .flex-product-description .yt-table-wrap { overflow: visible; border: 0; background: transparent; }
  .flex-product-description .yt-flex-table,
  .flex-product-description .yt-flex-table tbody,
  .flex-product-description .yt-flex-table tr,
  .flex-product-description .yt-flex-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }
  .flex-product-description .yt-flex-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
  }
  .flex-product-description .yt-flex-table tbody { display: grid; gap: 10px; }
  .flex-product-description .yt-flex-table tr,
  .flex-product-description .yt-flex-table tbody tr:nth-child(even) {
    padding: 13px;
    border: 1px solid #dce5ec;
    border-radius: 12px;
    background: #fff;
  }
  .flex-product-description .yt-flex-table td {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 7px 0;
    border: 0;
    white-space: normal !important;
    font-size: 13px;
    line-height: 1.45;
  }
  .flex-product-description .yt-flex-table td::before {
    color: #718095;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
  }
  .flex-product-description .yt-flex-table td:nth-child(1)::before { content: "Paket"; }
  .flex-product-description .yt-flex-table td:nth-child(2)::before { content: "Tip"; }
  .flex-product-description .yt-flex-table td:nth-child(3)::before { content: "Ek ücret"; }
  .flex-product-description .yt-flex-table td:nth-child(4)::before { content: "Kapsam"; }
  .flex-product-description .yt-badge { min-width: 68px; width: max-content; }
  .flex-product-description .yt-mode-grid article { min-height: 0; }
}

/* Cart quantity stays neutral on live and local builds. */
html body > .header .actions .action-cart #cart-count {
  border: 1px solid rgba(18, 27, 38, .14) !important;
  background: #ffffff !important;
  color: #121b26 !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .12) !important;
}

@media (max-width: 680px) {
  html body:not(.yk-checkout-page) > .header .actions .action-cart {
    display: inline-flex !important;
    width: auto !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 8px !important;
    gap: 4px;
    justify-content: center;
  }
  html body:not(.yk-checkout-page) > .header .actions .action-cart > span {
    display: none !important;
  }
  html body:not(.yk-checkout-page) > .header .actions .action-cart #cart-count {
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    font-size: 10px;
  }
}

/* OBDeleven official vehicle compatibility selector */
.obdeleven-support-section {
  margin-top: 28px;
  margin-bottom: 28px;
}

.obdeleven-support-card {
  overflow: hidden;
  padding: 24px;
  border: 1px solid #d8e2ed;
  border-radius: 24px;
  background: linear-gradient(145deg, #ffffff 0%, #f7fafc 72%, #eef8f7 100%);
  box-shadow: 0 16px 42px rgba(15, 23, 42, .08);
}

.obdeleven-support-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
}

.obdeleven-support-head .eyebrow {
  display: inline-flex;
  margin-bottom: 7px;
  color: #0f766e;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.obdeleven-support-head h2 {
  margin: 0 0 8px;
  color: #111b2a;
  font-size: clamp(24px, 3vw, 36px);
  line-height: 1.12;
}

.obdeleven-support-head p {
  max-width: 760px;
  margin: 0;
  color: #617087;
  line-height: 1.65;
}

.obdeleven-official-badge {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  padding: 10px 13px;
  border: 1px solid #bde5df;
  border-radius: 999px;
  background: #eaf9f5;
  color: #08766d;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.obdeleven-selector-frame {
  position: relative;
  min-height: 0;
  padding: 16px;
  overflow: visible;
  border: 1px solid #ced9e5;
  border-radius: 18px;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .8), 0 10px 28px rgba(15, 23, 42, .07);
}

.obdeleven-selector-frame iframe {
  display: block;
  width: 100%;
  height: 500px;
  border: 0;
  background: #fff;
}

.compat-card .obdeleven-selector-frame {
  margin: 16px 0 12px;
}

.obdeleven-selector-note {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #d7e3ea;
  border-radius: 14px;
  background: #f7fafc;
  color: #536279;
  font-size: 13px;
  line-height: 1.45;
}

.obdeleven-selector-note > i {
  color: #0f766e;
}

.obdeleven-selector-note span {
  flex: 1 1 auto;
}

.obdeleven-selector-note a {
  flex: 0 0 auto;
  color: #0f766e;
  font-weight: 800;
  text-decoration: none;
}

.obdeleven-selector-note a:hover {
  text-decoration: underline;
}

/* OBDeleven pages use the official selector instead of the old sample list. */
.compat-card .obdeleven-selector-frame ~ p,
.compat-card .obdeleven-selector-frame ~ .compat-search,
.compat-card .obdeleven-selector-frame ~ .compat-grid,
.compat-card .obdeleven-selector-frame ~ .compat-empty,
.compat-card .obdeleven-selector-frame ~ .compat-note {
  display: none !important;
}

.compat-card .obdeleven-selector-frame ~ .obdeleven-selector-note {
  display: flex !important;
}

@media (max-width: 700px) {
  .obdeleven-support-section {
    margin-top: 18px;
    margin-bottom: 18px;
  }

  .obdeleven-support-card {
    padding: 14px;
    border-radius: 18px;
  }

  .obdeleven-support-head {
    flex-direction: column;
    gap: 12px;
  }

  .obdeleven-official-badge {
    white-space: normal;
  }

  .obdeleven-selector-frame,
  .obdeleven-selector-frame iframe {
    min-height: 0;
    height: auto;
  }

  .obdeleven-selector-frame { padding: 10px; }

  .obdeleven-selector-note {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .obdeleven-selector-note a {
    width: 100%;
    padding-left: 23px;
  }
}

/* Compact opening used only by brand catalogue pages. */
.listing-hero.brand-listing-hero {
  margin-top: 14px;
  margin-bottom: 14px;
  padding: 16px 26px;
  min-height: 0;
}

.listing-hero.brand-listing-hero > div {
  display: grid;
  gap: 3px;
}

.listing-hero.brand-listing-hero .eyebrow {
  margin: 0 0 2px;
  font-size: 10px;
}

.listing-hero.brand-listing-hero h1 {
  margin: 0;
  font-size: clamp(26px, 2.35vw, 32px);
  line-height: 1.05;
}

.listing-hero.brand-listing-hero p {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.4;
}

.listing-hero.brand-listing-hero > strong { align-self: center; }

@media (max-width: 720px) {
  .listing-hero.brand-listing-hero {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 13px 16px;
  }

  .listing-hero.brand-listing-hero h1 { font-size: 23px; }
  .listing-hero.brand-listing-hero p { font-size: 11.5px; }
}

/* Ancel distributor sayfasi: render-blocking @import yerine ayni dosyada. */
.ancel-proof-page { padding:26px 0 0; }
.ancel-proof-page .wrap { width:min(1180px,calc(100% - 32px)); }
.ancel-proof-hero { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(310px,.75fr); gap:18px; }
.ancel-proof-hero__main,.ancel-proof-hero__side,.ancel-proof-section { border:1px solid #dbe3ec; border-radius:22px; background:#fff; box-shadow:0 18px 45px rgba(18,32,49,.07); }
.ancel-proof-hero__main { position:relative; overflow:hidden; padding:clamp(28px,5vw,54px); color:#fff; background:linear-gradient(135deg,#111c29 0%,#182b3c 62%,#0c716b 150%); }
.ancel-proof-hero__main::after { position:absolute; right:-90px; bottom:-120px; width:330px; height:330px; border:1px solid rgba(255,255,255,.12); border-radius:50%; content:""; }
.ancel-proof-kicker { display:inline-flex; gap:8px; align-items:center; margin:0 0 18px; color:#bfe8e4; font-size:11px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.ancel-proof-kicker::before { width:24px; height:2px; background:#e51d38; content:""; }
.ancel-proof-hero h1 { position:relative; z-index:1; max-width:740px; margin:0; color:#fff; font-size:clamp(34px,5.5vw,64px); line-height:1.02; }
.ancel-proof-hero__main>p:not(.ancel-proof-kicker) { position:relative; z-index:1; max-width:760px; margin:18px 0 0; color:#d7e2ec; font-size:17px; line-height:1.65; }
.ancel-proof-actions { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.ancel-proof-button { display:inline-flex; justify-content:center; gap:8px; align-items:center; min-height:46px; padding:0 18px; border:1px solid #d7e1eb; border-radius:12px; background:#fff; color:#172231; font-size:13px; font-weight:850; text-decoration:none; }
.ancel-proof-button--primary { border-color:#e21d38; background:#e21d38; color:#fff; }
.ancel-proof-hero__side { display:flex; flex-direction:column; justify-content:center; padding:28px; }
.ancel-proof-brand { display:flex; gap:14px; align-items:center; padding-bottom:22px; border-bottom:1px solid #e2e8ef; }
.ancel-proof-brand img { width:112px; height:54px; object-fit:contain; }
.ancel-proof-brand strong { display:block; color:#172231; font-size:18px; }
.ancel-proof-brand span { color:#64758a; font-size:12px; }
.ancel-proof-facts { display:grid; gap:11px; margin-top:21px; }
.ancel-proof-fact { display:grid; grid-template-columns:36px 1fr; gap:10px; align-items:center; }
.ancel-proof-fact i { display:grid; width:36px; height:36px; place-items:center; border-radius:10px; background:#eef8f6; color:#08776f; }
.ancel-proof-fact b { display:block; color:#172231; font-size:13px; }
.ancel-proof-fact small { display:block; color:#68788b; font-size:11px; }
.ancel-proof-section { margin-top:20px; padding:clamp(22px,4vw,36px); }
.ancel-proof-section__head { display:flex; justify-content:space-between; gap:18px; align-items:end; margin-bottom:20px; }
.ancel-proof-section__head h2 { margin:3px 0 0; color:#172231; font-size:clamp(24px,3vw,34px); }
.ancel-proof-section__head p { max-width:660px; margin:0; color:#637388; line-height:1.6; }
.ancel-proof-current { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.48fr); gap:18px; }
.ancel-proof-preview { min-height:520px; overflow:hidden; border:1px solid #dbe4ed; border-radius:16px; background:#f3f6f9; }
.ancel-proof-preview object { display:block; width:100%; height:620px; border:0; }
.ancel-proof-current__copy { display:flex; flex-direction:column; padding:24px; border:1px solid #dbe4ed; border-radius:16px; background:#f8fafc; }
.ancel-proof-current__copy>span { width:max-content; padding:5px 9px; border-radius:999px; background:#eaf7f4; color:#087269; font-size:10px; font-weight:900; }
.ancel-proof-current__copy h3 { margin:16px 0 9px; color:#172231; font-size:25px; }
.ancel-proof-current__copy p { margin:0; color:#617186; font-size:13px; line-height:1.65; }
.ancel-proof-current__copy ul { display:grid; gap:10px; margin:20px 0 24px; padding:0; list-style:none; }
.ancel-proof-current__copy li { display:flex; gap:9px; color:#263547; font-size:12px; font-weight:750; }
.ancel-proof-current__copy li i { color:#08776f; }
.ancel-proof-current__copy .ancel-proof-button { margin-top:auto; }
.ancel-proof-archive { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.ancel-proof-certificate { display:flex; flex-direction:column; min-height:154px; padding:18px; border:1px solid #dbe4ed; border-radius:15px; background:#fff; color:#172231; text-decoration:none; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.ancel-proof-certificate:hover { transform:translateY(-2px); border-color:#a9cfc9; box-shadow:0 14px 28px rgba(18,32,49,.09); }
.ancel-proof-certificate i { color:#e21d38; font-size:22px; }
.ancel-proof-certificate strong { margin-top:18px; font-size:16px; }
.ancel-proof-certificate span { margin-top:3px; color:#6b7a8d; font-size:11px; }
.ancel-proof-certificate small { margin-top:auto; color:#08776f; font-size:11px; font-weight:850; }
.ancel-proof-register { display:grid; grid-template-columns:minmax(260px,.55fr) 1fr; gap:22px; align-items:center; }
.ancel-proof-register img { width:100%; max-height:360px; border:1px solid #e0e6ed; border-radius:16px; background:#fff; object-fit:contain; }
.ancel-proof-register h2 { margin:0 0 10px; color:#172231; font-size:30px; }
.ancel-proof-register p { color:#607086; line-height:1.7; }
@media(max-width:900px){.ancel-proof-hero,.ancel-proof-current,.ancel-proof-register{grid-template-columns:1fr}.ancel-proof-archive{grid-template-columns:repeat(2,1fr)}.ancel-proof-preview{min-height:440px}.ancel-proof-preview object{height:520px}}
@media(max-width:620px){.ancel-proof-page{padding-top:14px}.ancel-proof-page .wrap{width:min(100% - 20px,1180px)}.ancel-proof-hero__main,.ancel-proof-hero__side,.ancel-proof-section{border-radius:17px;padding:20px}.ancel-proof-actions{display:grid}.ancel-proof-section__head{display:block}.ancel-proof-section__head p{margin-top:8px}.ancel-proof-preview{display:none}.ancel-proof-archive{grid-template-columns:1fr 1fr}.ancel-proof-certificate{min-height:142px;padding:15px}.ancel-proof-register h2{font-size:25px}}