/* Katalog merkez sayfaları (/yaka-kartlari, /panolar, /brosurler, /sunumlar) — ortak tema, sınıf öneki: ch- */
.ch { color:#14263a; }
.ch *, .ch *::before, .ch *::after { box-sizing:border-box; }
.ch [hidden] { display:none !important; }
.ch-wrap { max-width:1180px; margin:0 auto; padding:0 16px; }
.ch-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; }

/* Kahraman alanı */
.ch-hero { background:linear-gradient(160deg,#0f1f3a 0%,#1d3557 55%,#284b78 100%); color:#fff; padding:36px 0 44px; overflow:hidden; }
.ch-crumbs { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:12px; font-weight:700; color:#b9cbe4; margin:0 0 20px; padding:0; list-style:none; }
.ch-crumbs a { color:inherit; text-decoration:none; }
.ch-crumbs a:hover { color:#fff; }
.ch-crumbs i { font-size:8px; }
.ch-crumbs [aria-current] { color:#fff; }
.ch-hero-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:32px; align-items:center; }
.ch-hero-grid.ch-hero-grid--solo { grid-template-columns:minmax(0,1fr); }
.ch-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; }
.ch-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; }
.ch-hero p.ch-lead-hero { margin:0; max-width:640px; font-size:16px; line-height:1.7; color:#d5e2f3; }
.ch-hero-chips { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:18px 0 0; }
.ch-hero-chips li { display:inline-flex; align-items:center; gap:7px; padding:6px 11px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); font-size:12px; font-weight:700; color:#e3ecf8; }
.ch-hero-chips i { color:#f2c14e; }
.ch-cta { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.ch-visual { position:relative; height:280px; }
.ch-visual-item { position:absolute; top:0; width:44%; border-radius:8px; overflow:hidden; background:#fff; box-shadow:0 18px 40px rgba(0,0,0,.35); }
.ch-visual-item svg, .ch-visual-item img { display:block; width:100%; height:auto; }
.ch-visual-item:nth-child(1) { left:2%; top:34px; transform:rotate(-7deg); }
.ch-visual-item:nth-child(2) { left:28%; top:0; z-index:2; }
.ch-visual-item:nth-child(3) { left:54%; top:34px; transform:rotate(7deg); }
.ch-visual--wide .ch-visual-item { width:60%; }
.ch-visual--wide .ch-visual-item:nth-child(1) { left:0; top:60px; }
.ch-visual--wide .ch-visual-item:nth-child(2) { left:20%; top:10px; }
.ch-visual--wide .ch-visual-item:nth-child(3) { left:40%; top:90px; z-index:3; transform:rotate(4deg); }

/* Düğmeler */
.ch-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 18px; border-radius:11px; font:inherit; font-size:14px; font-weight:800; text-decoration:none; border:1px solid transparent; white-space:nowrap; cursor:pointer; }
.ch-btn.primary { background:#2563eb; color:#fff; }
.ch-btn.primary:hover { background:#1d4ed8; }
.ch-btn.ghost { border-color:rgba(255,255,255,.35); color:#fff; background:transparent; }
.ch-btn.ghost:hover { background:rgba(255,255,255,.1); }
.ch-btn.line { border-color:#c9d6e3; color:#1d4f86; background:#fff; }
.ch-btn.line:hover { border-color:#2563eb; }
.ch-btn.sm { min-height:34px; padding:6px 14px; font-size:13px; border-radius:9px; }
.ch-btn:focus-visible, .ch-view button:focus-visible, .ch-item a:focus-visible { outline:3px solid rgba(37,99,235,.45); outline-offset:2px; }

/* Bölümler */
.ch-section { padding:44px 0; }
.ch-section.alt { background:#f4f7fb; }
.ch-section h2 { margin:0 0 8px; font-size:clamp(22px,2.6vw,28px); font-weight:800; letter-spacing:-.4px; }
.ch-lead { margin:0 0 22px; max-width:820px; font-size:15px; line-height:1.7; color:#556779; }

/* Filtreler */
.ch-filters { display:grid; grid-template-columns:repeat(auto-fit,minmax(165px,1fr)); gap:12px; align-items:end; padding:16px; margin:-30px 0 22px; position:relative; z-index:2; background:#fff; border:1px solid #dbe4ec; border-radius:16px; box-shadow:0 12px 32px rgba(20,50,90,.08); }
.ch-filters label { display:block; margin:0 0 5px; font-size:11px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:#5b6c7d; }
.ch-filters input, .ch-filters select { width:100%; min-height:42px; padding:9px 12px; border:1px solid #c9d6e3; border-radius:10px; background:#fff; font:inherit; font-size:14px; color:#14263a; }
.ch-filters input:focus, .ch-filters select:focus { outline:none; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.ch-filter-actions { display:flex; gap:8px; }
.ch-filters > .ch-filter-q { grid-column:span 2; }

/* Araç çubuğu: sayı + görünüm */
.ch-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 16px; }
.ch-count { font-size:14px; color:#556779; }
.ch-count strong { color:#14263a; }
.ch-view { display:inline-flex; padding:3px; border:1px solid #dbe4ec; border-radius:11px; background:#fff; }
.ch-view button { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:6px 12px; border:0; border-radius:8px; background:transparent; font:inherit; font-size:13px; font-weight:800; color:#556779; cursor:pointer; }
.ch-view button[aria-pressed="true"] { background:#14263a; color:#fff; }

/* Öğeler: kart (varsayılan) ve liste */
.ch-items { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:18px; list-style:none; margin:0; padding:0; }
.ch-item { position:relative; display:flex; flex-direction:column; min-width:0; border:1px solid #dbe4ec; border-radius:16px; background:#fff; overflow:hidden; transition:border-color .15s, box-shadow .15s, transform .15s; }
.ch-item:hover { border-color:#a9c4ef; box-shadow:0 10px 28px rgba(20,50,90,.08); transform:translateY(-2px); }
.ch-item-media { position:relative; display:block; background:#eef3f8; overflow:hidden; aspect-ratio:4/3; }
.ch-item-media.is-landscape { aspect-ratio:16/10; }
.ch-item-media.is-portrait { aspect-ratio:3/4; }
.ch-item-media img { display:block; width:100%; height:100%; max-width:none; object-fit:cover; object-position:top center; }
.ch-item-media.is-svg { display:flex; align-items:center; justify-content:center; padding:14px; background:linear-gradient(160deg,#eef3f9,#dfe8f3); }
.ch-item-media.is-svg svg { display:block; height:100%; width:auto; max-width:100%; border-radius:5px; box-shadow:0 6px 16px rgba(20,38,58,.16); }
.ch-item-placeholder { display:flex; width:100%; height:100%; align-items:center; justify-content:center; font-size:38px; color:#9fb3c8; }
.ch-item-flag { position:absolute; left:10px; top:10px; display:inline-flex; align-items:center; gap:6px; padding:4px 9px; border-radius:999px; background:rgba(15,31,58,.82); color:#fff; font-size:11.5px; font-weight:800; }
.ch-item-body { display:flex; flex-direction:column; flex:1; padding:15px 16px 16px; min-width:0; }
.ch-item-kicker { margin:0 0 4px; font-size:11px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; color:#2563eb; }
.ch-item-title { margin:0 0 7px; font-size:16.5px; line-height:1.3; font-weight:800; }
.ch-item-title a { color:inherit; text-decoration:none; }
.ch-item-title a::after { content:""; position:absolute; inset:0; z-index:1; }
.ch-item-title a:hover { color:#1d4ed8; }
.ch-item-desc { margin:0 0 11px; font-size:13.5px; line-height:1.6; color:#5b6c7d; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.ch-chips { display:flex; flex-wrap:wrap; gap:5px; list-style:none; padding:0; margin:0 0 12px; }
.ch-chips li { display:inline-flex; align-items:center; gap:5px; padding:3px 8px; border-radius:6px; background:#eef3f9; font-size:11px; font-weight:800; letter-spacing:.2px; color:#2f4a68; }
.ch-chips li.is-premium { background:#fff4dc; color:#8a5a00; }
.ch-chips i { font-size:10px; opacity:.8; }
.ch-item-meta { margin-top:auto; font-size:12px; color:#6a7b8c; }
.ch-item-actions { position:relative; z-index:2; display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:12px; }
.ch-link { font-size:13px; font-weight:700; color:#1d4ed8; text-decoration:none; }
.ch-link:hover { text-decoration:underline; }
.ch-item-aside { margin-left:auto; font-size:11.5px; font-weight:700; color:#6a7b8c; }

.ch-items.is-list { grid-template-columns:minmax(0,1fr); gap:12px; }
.ch-items.is-list .ch-item { flex-direction:row; align-items:stretch; }
.ch-items.is-list .ch-item:hover { transform:none; }
.ch-items.is-list .ch-item-media { flex:0 0 200px; width:200px; aspect-ratio:auto; min-height:140px; }
.ch-items.is-list .ch-item-media.is-svg { padding:10px; }
.ch-items.is-list .ch-item-body { padding:14px 18px; }
.ch-items.is-list .ch-item-desc { -webkit-line-clamp:2; }
.ch-items.is-list .ch-chips { margin-bottom:6px; }

.ch-empty { padding:40px 20px; border:1px dashed #c9d6e3; border-radius:16px; background:#fff; text-align:center; color:#556779; }
.ch-empty i { font-size:30px; color:#9fb3c8; }
.ch-pagination { margin-top:26px; }

/* Ek içerik: tablo, adımlar, liste, SSS, galeri */
.ch-table-wrap { overflow-x:auto; border:1px solid #dbe4ec; border-radius:14px; background:#fff; }
.ch-table { width:100%; border-collapse:collapse; font-size:14px; }
.ch-table th, .ch-table td { padding:13px 16px; text-align:left; border-bottom:1px solid #e6edf3; vertical-align:top; line-height:1.55; }
.ch-table thead th { background:#f4f7fb; font-size:12px; text-transform:uppercase; letter-spacing:.6px; color:#5b6c7d; }
.ch-table tbody th { white-space:nowrap; font-weight:800; }
.ch-table tbody th span { display:block; font-size:12px; font-weight:600; color:#6a7b8c; }
.ch-table tbody tr:last-child th, .ch-table tbody tr:last-child td { border-bottom:0; }
.ch-table td.ch-good { white-space:nowrap; font-weight:700; color:#1f6a46; }
.ch-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px; }
.ch-steps { margin:14px 0 0; padding-left:22px; display:grid; gap:10px; font-size:14.5px; line-height:1.65; color:#33475b; }
.ch-list { list-style:none; padding:0; margin:14px 0 0; display:grid; gap:10px; font-size:14.5px; line-height:1.6; color:#33475b; }
.ch-list i { width:22px; color:#2563eb; }
.ch-faq { display:grid; gap:10px; max-width:900px; }
.ch-faq details { border:1px solid #dbe4ec; border-radius:12px; background:#fff; padding:0 16px; }
.ch-faq summary { cursor:pointer; padding:14px 0; font-weight:800; font-size:15px; }
.ch-faq p { margin:0 0 14px; font-size:14px; line-height:1.7; color:#4c5e70; }
.ch-gallery { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; }
.ch-gallery figure { margin:0; }
.ch-gallery-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); }
.ch-gallery-thumb svg { display:block; width:100%; height:auto; }
.ch-gallery figcaption { margin-top:9px; display:flex; flex-direction:column; gap:2px; }
.ch-gallery strong { font-size:14px; }
.ch-gallery figcaption span { font-size:12px; line-height:1.45; color:#5b6c7d; }

@media (max-width:980px) {
  .ch-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ch-filters > .ch-filter-q, .ch-filter-actions { grid-column:1 / -1; }
}
@media (max-width:900px) {
  .ch-hero-grid, .ch-two { grid-template-columns:minmax(0,1fr); }
  .ch-visual { height:220px; max-width:440px; }
  .ch-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:600px) {
  .ch-hero { padding:28px 0 40px; }
  .ch-visual { display:none; }
  .ch-filters { grid-template-columns:minmax(0,1fr); margin-top:-24px; }
  .ch-filters > .ch-filter-q { grid-column:auto; }
  .ch-cta .ch-btn { width:100%; }
  .ch-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .ch-section { padding:34px 0; }
  .ch-items { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); }
  .ch-items.is-list .ch-item-media { flex-basis:104px; width:104px; min-height:104px; }
  .ch-items.is-list .ch-item-body { padding:11px 12px; }
  .ch-items.is-list .ch-item-desc { display:none; }
  .ch-items.is-list .ch-item-title { font-size:15px; }
  .ch-items.is-list .ch-item-flag { display:none; }
}
