/* banana-pi.com.tr tasarım sistemi — spec §6 */
:root, [data-bs-theme="light"] {
  --bp-yellow: #FFD21F; --bp-yellow-hover: #F5C400;
  --bp-ink: #0F172A; --bp-muted: #64748B; --bp-surface: #F8FAFC; --bp-card: #FFFFFF;
  --bp-border: #E2E8F0; --bp-link: #1D4ED8; --bp-ok: #15803D; --bp-warn: #C2410C;
  --bp-code-bg: #0F172A; --bp-code-fg: #E2E8F0; --bp-riscv: #6D28D9; --bp-riscv-bg: #EDE9FE;
  --bp-chip-bg: #F1F5F9; --bp-img-bg: #FFFFFF;
}
[data-bs-theme="dark"] {
  --bp-ink: #E2E8F0; --bp-muted: #94A3B8; --bp-surface: #0B1120; --bp-card: #111827;
  --bp-border: #1F2937; --bp-link: #60A5FA; --bp-ok: #4ADE80; --bp-warn: #FB923C;
  --bp-code-bg: #020617; --bp-riscv: #C4B5FD; --bp-riscv-bg: #2E1065; --bp-chip-bg: #1E293B; --bp-img-bg: #F8FAFC;
}
:root, [data-bs-theme] {
  --bs-body-bg: var(--bp-surface); --bs-body-color: var(--bp-ink); --bs-border-color: var(--bp-border);
  --bs-link-color: var(--bp-link); --bs-link-hover-color: var(--bp-link); --bs-link-color-rgb: 29, 78, 216;
  --bs-secondary-color: var(--bp-muted); --bs-tertiary-bg: var(--bp-chip-bg);
  --bs-body-font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bs-font-monospace: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --bs-border-radius: .5rem;
}
[data-bs-theme="dark"] { --bs-link-color-rgb: 96, 165, 250; }
body { background: var(--bp-surface); color: var(--bp-ink); font-size: 1rem; line-height: 1.6; }
h1, .h1 { font-size: clamp(1.75rem, 3vw + 1rem, 2.5rem); font-weight: 700; letter-spacing: -.02em; }
h2, .h2 { font-size: 1.75rem; font-weight: 700; letter-spacing: -.01em; }
h3, .h3 { font-size: 1.25rem; font-weight: 600; }
.bp-muted { color: var(--bp-muted); }
.bp-kicker { font-size: .875rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--bp-muted); }
.bp-mono, code, kbd, pre { font-family: var(--bs-font-monospace); }
.bp-num { font-variant-numeric: tabular-nums; }
:focus-visible { outline: 2px solid var(--bp-link); outline-offset: 2px; }

/* Header */
.bp-header { background: var(--bp-card); border-bottom: 1px solid var(--bp-border); }
.bp-header .navbar-brand img { height: 40px; width: auto; }
.bp-header .nav-link { color: var(--bp-ink); font-weight: 500; }
.bp-header .nav-link.active { box-shadow: inset 0 -3px 0 var(--bp-yellow); }
.bp-search { max-width: 320px; }
.bp-search .form-control { background: var(--bp-chip-bg); border-color: transparent; }

/* Buttons */
.btn-primary, .bp-btn-yellow { --bs-btn-bg: var(--bp-yellow); --bs-btn-border-color: var(--bp-yellow); --bs-btn-color: #0F172A;
  --bs-btn-hover-bg: var(--bp-yellow-hover); --bs-btn-hover-border-color: var(--bp-yellow-hover); --bs-btn-hover-color: #0F172A;
  --bs-btn-active-bg: var(--bp-yellow-hover); --bs-btn-active-color: #0F172A; font-weight: 600; }
.btn-outline-secondary { --bs-btn-color: var(--bp-ink); --bs-btn-border-color: var(--bp-border); --bs-btn-hover-bg: var(--bp-chip-bg);
  --bs-btn-hover-color: var(--bp-ink); --bs-btn-hover-border-color: var(--bp-muted); }

/* Cards */
.bp-card { background: var(--bp-card); border: 1px solid var(--bp-border); border-radius: .75rem; transition: border-color .15s; }
.bp-card:hover { border-color: var(--bp-muted); }
.bp-card a.stretched-link { color: inherit; text-decoration: none; }
.bp-img-frame { background: var(--bp-img-bg); border-radius: .5rem; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.bp-img-frame img { max-width: 100%; max-height: 100%; object-fit: contain; }
.bp-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Badges & chips */
.bp-badge { display: inline-block; font-size: .75rem; font-weight: 500; padding: .125rem .5rem; border-radius: 999px;
  background: var(--bp-chip-bg); color: var(--bp-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bp-badge-riscv { background: var(--bp-riscv-bg); color: var(--bp-riscv); }
.bp-badge-ok { color: var(--bp-ok); } .bp-badge-warn { color: var(--bp-warn); }
.bp-chip { display: inline-flex; align-items: center; gap: .375rem; border: 1px solid var(--bp-border); background: var(--bp-card);
  color: var(--bp-ink); border-radius: 999px; padding: .375rem .875rem; font-size: .875rem; font-weight: 500; }
.bp-chip[aria-pressed="true"], .bp-chip.active { background: var(--bp-yellow); border-color: var(--bp-yellow); color: #0F172A; }
.bp-chip-sayi { font-size: .75rem; opacity: .7; font-variant-numeric: tabular-nums; }

/* Facets */
.bp-facet h3 { font-size: .875rem; font-weight: 600; margin: 1rem 0 .5rem; }
.bp-facet-secenek { display: flex; justify-content: space-between; align-items: center; font-size: .9375rem; }
.bp-facet-secenek.is-bos { opacity: .45; }
.bp-facet-sayi { color: var(--bp-muted); font-size: .8125rem; font-variant-numeric: tabular-nums; }
.no-js .js-only { display: none !important; }

/* Compare bar */
.bp-karsilastir-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030; background: var(--bp-card);
  border-top: 1px solid var(--bp-border); box-shadow: 0 -4px 16px rgba(0,0,0,.08); }

/* Mobilde sağ alttaki canlı destek butonuna yer bırak */
@media (max-width: 767.98px) { .bp-karsilastir-bar .container { padding-right: 9.5rem; } }

/* Sections & prose */
.bp-section { scroll-margin-top: 7rem; padding-top: 2.5rem; }
.bp-section > h2 { margin-bottom: 1.25rem; }
.bp-sectionnav { position: sticky; top: 0; z-index: 1020; background: var(--bp-surface); border-bottom: 1px solid var(--bp-border); }
.bp-sectionnav .nav { scrollbar-width: none; }
.bp-sectionnav .nav::-webkit-scrollbar { display: none; }
.bp-sectionnav .nav-link { color: var(--bp-muted); font-weight: 500; white-space: nowrap; }
.bp-sectionnav .nav-link.active { color: var(--bp-ink); box-shadow: inset 0 -3px 0 var(--bp-yellow); }
.bp-prose { max-width: 75ch; }
.bp-prose table { width: 100%; margin: 1rem 0; border-collapse: collapse; font-size: .9375rem; }
.bp-prose th, .bp-prose td { border: 1px solid var(--bp-border); padding: .375rem .625rem; }
.bp-prose blockquote { border-left: 3px solid var(--bp-yellow); padding-left: 1rem; color: var(--bp-muted); }

/* Code */
.bp-prose pre, .bp-code { position: relative; background: var(--bp-code-bg); color: var(--bp-code-fg); border-radius: .5rem;
  padding: 1rem 1rem; font-size: .875rem; overflow-x: auto; }
.bp-prose pre code { color: inherit; }
.bp-prose :not(pre) > code { background: var(--bp-chip-bg); color: var(--bp-ink); padding: .1em .35em; border-radius: .25rem; font-size: .875em; }
.bp-kopyala { position: absolute; top: .5rem; right: .5rem; font-size: .75rem; padding: .125rem .5rem; border-radius: .375rem;
  border: 1px solid rgba(255,255,255,.25); background: transparent; color: var(--bp-code-fg); }

/* Spec table */
.bp-spec { width: 100%; border-collapse: separate; border-spacing: 0; }
.bp-spec th[scope="rowgroup"] { position: sticky; top: 3.25rem; background: var(--bp-surface); font-size: .8125rem;
  text-transform: uppercase; letter-spacing: .05em; color: var(--bp-muted); padding: 1rem 0 .375rem; }
.bp-spec td, .bp-spec th[scope="row"] { border-top: 1px solid var(--bp-border); padding: .5rem .75rem .5rem 0; vertical-align: top; }
.bp-spec th[scope="row"] { width: 32%; font-weight: 500; color: var(--bp-muted); }
.bp-spec td { font-variant-numeric: tabular-nums; }
@media (max-width: 575.98px) {
  .bp-spec th[scope="row"], .bp-spec td { display: block; width: 100%; border: 0; padding: 0; }
  .bp-spec tr { display: block; border-top: 1px solid var(--bp-border); padding: .5rem 0; }
}

/* Steps timeline */
.bp-adimlar { list-style: none; counter-reset: adim; padding-left: 0; }
.bp-adimlar > li { counter-increment: adim; position: relative; padding: 0 0 1.5rem 3rem; }
.bp-adimlar > li::before { content: counter(adim); position: absolute; left: 0; top: 0; width: 2rem; height: 2rem; border-radius: 50%;
  background: var(--bp-yellow); color: #0F172A; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.bp-adimlar > li:not(:last-child)::after { content: ""; position: absolute; left: 1rem; top: 2.25rem; bottom: .25rem; width: 2px; background: var(--bp-border); }

/* OS card */
.bp-os-logo { width: 40px; height: 40px; border-radius: .5rem; background: var(--bp-img-bg); display: flex; align-items: center; justify-content: center; flex: none; }
.bp-os-logo img { width: 28px; height: 28px; object-fit: contain; }
.bp-os-logo-metin { font-size: .6875rem; font-weight: 700; color: #0F172A; text-align: center; line-height: 1.1; }

/* Home */
.bp-hero { background: linear-gradient(180deg, var(--bp-card), var(--bp-surface)); border-bottom: 1px solid var(--bp-border); }
.bp-hero-search .form-control { height: 3.25rem; font-size: 1.0625rem; }
.bp-amac { display: block; height: 100%; padding: 1.25rem; text-decoration: none; color: var(--bp-ink); }
.bp-amac i { font-size: 1.5rem; }
.bp-band-riscv { background: var(--bp-riscv-bg); }
.bp-duyuru-serit { background: var(--bp-yellow); color: #0F172A; font-size: .9375rem; }
.bp-duyuru-serit a { color: #0F172A; font-weight: 600; }

/* Footer */
.bp-footer { background: #0F172A; color: #CBD5E1; }
.bp-footer a { color: #E2E8F0; text-decoration: none; }
.bp-footer a:hover { text-decoration: underline; }
/* Alt boşluk: telif satırı, sağ alttaki canlı destek butonunun (~56px) üstünde kalsın */
.bp-footer-ic { padding-bottom: 6.5rem; }
.bp-footer h3 { color: #FFFFFF; font-size: .9375rem; font-weight: 600; }
[data-tema-secim][aria-pressed="true"] { background: var(--bp-chip-bg); }
[data-bs-theme="dark"] .bp-header .navbar-brand img { background: #F8FAFC; border-radius: .5rem; padding: 2px; }

@media (min-width: 1200px) { .row-cols-xl-7 > * { flex: 0 0 auto; width: calc(100% / 7); } }