/* Yaka Kartı oluşturucu — sınıf öneki: ybk- */
.ybk { --ink:#14263a; --muted:#5d6f80; --line:#dbe4ec; --soft:#f4f8fb; --accent:#2563eb; --accent-dark:#1d4ed8;
  max-width:1280px; margin:24px auto 72px; padding:0 16px; color:var(--ink); }
.ybk *, .ybk *::before, .ybk *::after { box-sizing:border-box; }
.ybk [hidden] { display:none !important; }
.ybk-sr { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.ybk-head { margin-bottom:16px; }
.ybk-kicker { margin:0 0 6px; font-size:11px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:var(--accent-dark); }
.ybk-kicker a { color:inherit; text-decoration:none; }
.ybk-kicker a:hover { text-decoration:underline; }
.ybk-head h1 { margin:0 0 6px; font-size:clamp(22px,3vw,32px); line-height:1.15; font-weight:800; letter-spacing:-.5px; }
.ybk-head p { margin:0; font-size:14px; color:var(--muted); line-height:1.55; max-width:860px; }
.ybk-facts { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:12px 0 0; }
.ybk-facts li { display:inline-flex; align-items:center; gap:7px; padding:6px 11px; border-radius:999px; background:#eef4fb; color:#264766; font-size:12px; font-weight:700; }
.ybk-facts i { color:var(--accent); }
.ybk-alert { padding:11px 14px; border-radius:10px; font-size:13px; line-height:1.5; margin:0 0 14px; border:1px solid; }
.ybk-alert.err { background:#fff1f0; border-color:#f3c4bd; color:#912b1f; }
.ybk-alert.warn { background:#fff8e6; border-color:#f0d39a; color:#6d4a07; }
.ybk-frame { border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 14px 44px rgba(19,55,82,.07); overflow:hidden; }
.ybk-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; }
.ybk-wide .ybk-layout { grid-template-columns:minmax(0,1fr) 300px; }
.ybk-body { padding:24px 26px 22px; min-width:0; }
.ybk-side { border-left:1px solid var(--line); background:var(--soft); min-width:0; }
.ybk-side-inner { position:sticky; top:84px; padding:20px 18px; }
.ybk-side-title { margin:0 0 12px; font-size:12px; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.8px; }
.ybk-side-title span { text-transform:none; letter-spacing:0; font-weight:700; }
.ybk-card-wrap { position:relative; margin:0 auto; overflow:hidden; border-radius:6px; background:#fff; box-shadow:0 10px 28px rgba(20,38,58,.18), 0 0 0 1px rgba(20,38,58,.08); }
.ybk-card-wrap iframe, .ybk-sheet-wrap iframe { position:absolute; left:0; top:0; max-width:none !important; border:0; transform-origin:0 0; pointer-events:none; background:#fff; }
.ybk-pager { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:10px; font-size:12.5px; font-weight:700; color:var(--muted); }
.ybk-panel-head { margin-bottom:18px; }
.ybk-panel-head small { display:block; font-size:11px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--accent-dark); margin-bottom:5px; }
.ybk-panel-head h2 { margin:0 0 5px; font-size:22px; font-weight:800; letter-spacing:-.3px; }
.ybk-panel-head p { margin:0; font-size:13.5px; color:var(--muted); line-height:1.55; }
.ybk-fieldset { border:0; padding:0; margin:0 0 22px; min-width:0; }
.ybk-fieldset legend { padding:0; margin:0 0 10px; font-size:14px; font-weight:800; }
.ybk-count { margin-left:6px; font-size:12px; font-weight:700; color:var(--muted); }
.ybk-hint { margin:8px 0 0; font-size:12.5px; line-height:1.5; color:var(--muted); }

.ybk-sizes { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:10px; }
.ybk-size { display:flex; align-items:center; gap:12px; padding:11px 12px; border:1.5px solid var(--line); border-radius:12px; background:#fff; font:inherit; color:var(--ink); text-align:left; cursor:pointer; }
.ybk-size:hover { border-color:#9cbdf5; }
.ybk-size[aria-checked="true"] { border-color:var(--accent); box-shadow:0 0 0 3px rgba(37,99,235,.15); background:#f7faff; }
.ybk-size-shape { display:flex; align-items:center; justify-content:center; flex:0 0 38px; width:38px; height:38px; }
.ybk-size-shape span { display:block; border:2px solid #7a8fa6; border-radius:3px; background:#eef3f8; }
.ybk-size[aria-checked="true"] .ybk-size-shape span { border-color:var(--accent); background:#dbe8ff; }
.ybk-size-text { display:flex; flex-direction:column; min-width:0; }
.ybk-size-text strong { font-size:14px; }
.ybk-size-text span { font-size:12px; color:var(--muted); }
.ybk-size-text em { font-style:normal; font-size:11.5px; font-weight:700; color:#1f6a46; }

.ybk-filters { display:flex; flex-direction:column; gap:8px; margin-bottom:12px; }
.ybk-chips { display:flex; flex-wrap:wrap; gap:6px; }
.ybk-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border:1px solid var(--line); border-radius:999px; background:#fff; font:inherit; font-size:12.5px; font-weight:700; color:#33495f; cursor:pointer; }
.ybk-chip i { width:11px; height:11px; border-radius:50%; display:inline-block; }
.ybk-chip.is-on { background:var(--ink); border-color:var(--ink); color:#fff; }
.ybk-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); gap:12px; }
.ybk-is-land .ybk-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
.ybk-card { position:relative; display:flex; flex-direction:column; gap:3px; padding:9px; border:1.5px solid var(--line); border-radius:12px; background:#fff; font:inherit; text-align:left; color:var(--ink); cursor:pointer; transition:border-color .15s, transform .15s; }
.ybk-card:hover { border-color:#9cbdf5; transform:translateY(-1px); }
.ybk-card[aria-checked="true"] { border-color:var(--accent); box-shadow:0 0 0 3px rgba(37,99,235,.18); }
.ybk-card:focus-visible, .ybk-btn:focus-visible, .ybk-size:focus-visible, .ybk-chip:focus-visible { outline:3px solid rgba(37,99,235,.45); outline-offset:2px; }
.ybk-thumb { display:block; width:100%; margin-bottom:5px; border-radius:3px; overflow:hidden; box-shadow:0 2px 8px rgba(20,38,58,.14), 0 0 0 1px rgba(20,38,58,.08); }
.ybk-thumb svg { display:block; width:100%; height:auto; }
.ybk-thumb-l { display:none; }
.ybk-is-land .ybk-thumb-p { display:none; }
.ybk-is-land .ybk-thumb-l { display:block; }
.ybk-card-name { font-size:13px; font-weight:800; line-height:1.2; }
.ybk-card-palette { font-size:11.5px; font-weight:700; color:var(--muted); }
.ybk-card-check { position:absolute; top:5px; right:5px; display:none; width:22px; height:22px; border-radius:50%; background:var(--accent); color:#fff; font-size:11px; align-items:center; justify-content:center; box-shadow:0 0 0 2px #fff; }
.ybk-card[aria-checked="true"] .ybk-card-check { display:inline-flex; }

.ybk-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 14px; margin-bottom:20px; }
.ybk-field { display:flex; flex-direction:column; gap:5px; min-width:0; margin-bottom:0; }
.ybk-field.ybk-wide { grid-column:1 / -1; }
.ybk-field > span { font-size:13px; font-weight:800; }
.ybk-field em { font-style:normal; font-weight:600; color:var(--muted); font-size:12px; }
.ybk-field b { color:#c0392b; }
.ybk-field input, .ybk-field textarea { width:100%; padding:10px 12px; border:1px solid #c9d6e3; border-radius:10px; font:inherit; font-size:14px; color:var(--ink); background:#fff; }
.ybk-field textarea { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; line-height:1.55; resize:vertical; min-height:180px; }
.ybk-field input:focus, .ybk-field textarea:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.ybk > .ybk-frame .ybk-body > section > .ybk-field.ybk-wide { margin-bottom:14px; }

.ybk-logos { display:grid; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:10px; margin:10px 0; }
.ybk-logo { position:relative; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:10px; background:repeating-conic-gradient(#f1f4f8 0% 25%, #fff 0% 50%) 50% / 14px 14px; overflow:hidden; }
.ybk-logo img { display:block; width:100%; height:78px; object-fit:contain; padding:8px; }
.ybk-logo-tools { display:flex; justify-content:space-between; gap:2px; padding:4px; background:#fff; border-top:1px solid var(--line); }
.ybk-icon { display:inline-flex; align-items:center; justify-content:center; width:28px; height:26px; border:0; border-radius:6px; background:transparent; color:#33495f; cursor:pointer; }
.ybk-icon:hover:not(:disabled) { background:#eef3f8; }
.ybk-icon:disabled { opacity:.3; cursor:default; }
.ybk-radio-row { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:14px; font-size:13px; font-weight:700; }
.ybk-radio-row label, .ybk-toggles label { display:inline-flex; align-items:center; gap:7px; cursor:pointer; }
.ybk-radio-row em { font-style:normal; color:var(--muted); font-weight:600; }
.ybk-toggles { display:flex; flex-direction:column; gap:9px; margin:4px 0 18px; font-size:13.5px; font-weight:600; }
.ybk-toggles input, .ybk-radio-row input { width:17px; height:17px; accent-color:var(--accent); }

.ybk-people { margin:-4px 0 18px; overflow-x:auto; }
.ybk-people table { width:100%; border-collapse:collapse; font-size:12.5px; }
.ybk-people th, .ybk-people td { padding:6px 8px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; max-width:220px; overflow:hidden; text-overflow:ellipsis; }
.ybk-people th { font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); background:var(--soft); }

.ybk-sheet-wrap { position:relative; margin:0 auto; overflow:hidden; background:#fff; box-shadow:0 8px 26px rgba(20,38,58,.14), 0 0 0 1px rgba(20,38,58,.1); }
.ybk-status { min-height:18px; margin:10px 0; font-size:12.5px; color:var(--muted); text-align:center; }
.ybk-print { list-style:none; padding:0; margin:0 0 18px; display:grid; gap:8px; }
.ybk-print li { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border-radius:10px; background:var(--soft); font-size:13px; line-height:1.5; }
.ybk-print i { color:var(--accent); margin-top:3px; }
.ybk-guest { display:flex; flex-wrap:wrap; gap:10px; }
.ybk-note { margin:14px 0 0; font-size:12px; line-height:1.55; color:var(--muted); }

.ybk-btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:40px; padding:9px 15px; border-radius:10px; border:1px solid #c6d6e6; background:#fff; color:#1d4f86; font:inherit; font-size:13px; font-weight:800; cursor:pointer; text-decoration:none; white-space:nowrap; position:relative; }
.ybk-btn:hover { border-color:var(--accent); }
.ybk-btn.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
.ybk-btn.primary:hover { background:var(--accent-dark); }
.ybk-btn.lg { min-height:52px; padding:12px 22px; font-size:15px; border-radius:12px; }
.ybk-btn.sm { min-height:30px; padding:4px 10px; font-size:12px; border-radius:8px; }
.ybk-btn:disabled { opacity:.55; cursor:not-allowed; }
.ybk-nav { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }
.ybk-counter { font-size:12.5px; color:var(--muted); }

@media (max-width:1000px) {
  .ybk-layout, .ybk-wide .ybk-layout { grid-template-columns:minmax(0,1fr); }
  .ybk-side { border-left:0; border-top:1px solid var(--line); order:-1; }
  .ybk-side-inner { position:static; padding:14px; }
}
@media (max-width:560px) {
  .ybk-body { padding:18px 14px; }
  .ybk-form { grid-template-columns:minmax(0,1fr); }
  .ybk-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .ybk-is-land .ybk-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ybk-sizes { grid-template-columns:minmax(0,1fr); }
  .ybk-card { padding:6px; }
  .ybk-card-name { font-size:11.5px; }
  .ybk-btn.lg { width:100%; white-space:normal; }
}

/* Yaka kartları merkez sayfası (/yaka-kartlari) — sınıf öneki: ybh- */
.ybh { color:#14263a; }
.ybh *, .ybh *::before, .ybh *::after { box-sizing:border-box; }
.ybh-wrap { max-width:1180px; margin:0 auto; padding:0 16px; }
.ybh-hero { background:linear-gradient(160deg,#0f1f3a 0%,#1d3557 55%,#284b78 100%); color:#fff; padding:36px 0 44px; }
.ybh-crumbs { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:12px; font-weight:700; color:#b9cbe4; margin-bottom:20px; }
.ybh-crumbs a { color:inherit; text-decoration:none; }
.ybh-crumbs a:hover { color:#fff; }
.ybh-crumbs i { font-size:8px; }
.ybh-crumbs span { color:#fff; }
.ybh-hero-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:32px; align-items:center; }
.ybh-badge { display:inline-flex; align-items:center; gap:8px; padding:5px 12px; border-radius:999px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); font-size:12px; font-weight:700; color:#dbe7f7; }
.ybh-hero h1 { margin:14px 0 12px; font-size:clamp(30px,4.5vw,48px); line-height:1.08; font-weight:800; letter-spacing:-.8px; color:#fff; }
.ybh-hero p { margin:0; max-width:620px; font-size:16px; line-height:1.7; color:#d5e2f3; }
.ybh-cta { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.ybh-hero-cards { position:relative; height:280px; }
.ybh-hero-card { position:absolute; top:0; width:44%; border-radius:6px; overflow:hidden; box-shadow:0 18px 40px rgba(0,0,0,.35); }
.ybh-hero-card svg { display:block; width:100%; height:auto; }
.ybh-hero-card:nth-child(1) { left:2%; top:34px; transform:rotate(-7deg); }
.ybh-hero-card:nth-child(2) { left:28%; top:0; z-index:2; }
.ybh-hero-card:nth-child(3) { left:54%; top:34px; transform:rotate(7deg); }
.ybh-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 18px; border-radius:11px; font-size:14px; font-weight:800; text-decoration:none; border:1px solid transparent; white-space:nowrap; }
.ybh-btn.primary { background:#2563eb; color:#fff; }
.ybh-btn.primary:hover { background:#1d4ed8; }
.ybh-btn.ghost { border-color:rgba(255,255,255,.35); color:#fff; }
.ybh-btn.ghost:hover { background:rgba(255,255,255,.1); }
.ybh-btn.sm { min-height:34px; padding:6px 14px; font-size:13px; border-radius:9px; }
.ybh-section { padding:48px 0; }
.ybh-section.alt { background:#f4f7fb; }
.ybh-section h2 { margin:0 0 8px; font-size:clamp(22px,2.6vw,28px); font-weight:800; letter-spacing:-.4px; }
.ybh-lead { margin:0 0 24px; max-width:820px; font-size:15px; line-height:1.7; color:#556779; }
.ybh-docs { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.ybh-doc { display:flex; flex-direction:column; padding:18px; border:1px solid #dbe4ec; border-radius:16px; background:#fff; transition:border-color .15s, box-shadow .15s, transform .15s; }
.ybh-doc:hover { border-color:#a9c4ef; box-shadow:0 10px 28px rgba(20,50,90,.08); transform:translateY(-2px); }
.ybh-doc h3 { margin:0 0 8px; font-size:17px; font-weight:800; }
.ybh-doc h3 a { color:inherit; text-decoration:none; }
.ybh-doc h3 a:hover { color:#1d4ed8; }
.ybh-doc p { margin:0 0 12px; font-size:13.5px; line-height:1.6; color:#5b6c7d; flex:1; }
.ybh-roles { display:flex; flex-wrap:wrap; gap:5px; list-style:none; padding:0; margin:0 0 14px; }
.ybh-roles li { padding:3px 8px; border-radius:6px; background:#eef3f9; font-size:10.5px; font-weight:800; letter-spacing:.4px; color:#2f4a68; }
.ybh-doc-foot { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.ybh-link { font-size:13px; font-weight:700; color:#1d4ed8; text-decoration:none; }
.ybh-link:hover { text-decoration:underline; }
.ybh-size { margin-left:auto; font-size:11.5px; font-weight:700; color:#6a7b8c; }
.ybh-styles { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; }
.ybh-style { margin:0; }
.ybh-style-thumb { display:block; border-radius:5px; overflow:hidden; box-shadow:0 6px 18px rgba(20,38,58,.14), 0 0 0 1px rgba(20,38,58,.08); }
.ybh-style-thumb svg { display:block; width:100%; height:auto; }
.ybh-style figcaption { margin-top:9px; display:flex; flex-direction:column; gap:2px; }
.ybh-style strong { font-size:14px; }
.ybh-style figcaption span { font-size:12px; line-height:1.45; color:#5b6c7d; }
.ybh-table-wrap { overflow-x:auto; border:1px solid #dbe4ec; border-radius:14px; background:#fff; }
.ybh-table { width:100%; border-collapse:collapse; font-size:14px; }
.ybh-table th, .ybh-table td { padding:13px 16px; text-align:left; border-bottom:1px solid #e6edf3; vertical-align:top; line-height:1.55; }
.ybh-table thead th { background:#f4f7fb; font-size:12px; text-transform:uppercase; letter-spacing:.6px; color:#5b6c7d; }
.ybh-table tbody th { white-space:nowrap; font-weight:800; }
.ybh-table tbody th span { display:block; font-size:12px; font-weight:600; color:#6a7b8c; }
.ybh-table tbody tr:last-child th, .ybh-table tbody tr:last-child td { border-bottom:0; }
.ybh-table td:last-child { white-space:nowrap; font-weight:700; color:#1f6a46; }
.ybh-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px; }
.ybh-steps { margin:14px 0 0; padding-left:22px; display:grid; gap:10px; font-size:14.5px; line-height:1.65; color:#33475b; }
.ybh-list { list-style:none; padding:0; margin:14px 0 0; display:grid; gap:10px; font-size:14.5px; line-height:1.6; color:#33475b; }
.ybh-list i { width:22px; color:#2563eb; }
.ybh-faq { display:grid; gap:10px; max-width:900px; }
.ybh-faq details { border:1px solid #dbe4ec; border-radius:12px; background:#fff; padding:0 16px; }
.ybh-faq summary { cursor:pointer; padding:14px 0; font-weight:800; font-size:15px; }
.ybh-faq p { margin:0 0 14px; font-size:14px; line-height:1.7; color:#4c5e70; }
@media (max-width:900px) {
  .ybh-hero-grid, .ybh-two { grid-template-columns:minmax(0,1fr); }
  .ybh-hero-cards { height:230px; max-width:420px; }
  .ybh-styles { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:560px) {
  .ybh-styles { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .ybh-hero-cards { height:190px; }
  .ybh-btn { width:100%; }
  .ybh-doc-foot .ybh-btn { width:auto; }
  .ybh-section { padding:36px 0; }
}