@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');

.bref-sc-wrap { font-family: 'Quicksand', sans-serif; padding: 20px 0; }

/* FİLTRE */
.bref-filter { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 36px; }
.bref-ftab { background: none; border: 1.5px solid #E5E7EB; color: #6B7280; font-family: 'Quicksand', sans-serif; font-size: 13px; font-weight: 600; padding: 7px 18px; border-radius: 30px; cursor: pointer; transition: all .22s; display: inline-flex; align-items: center; gap: 6px; }
.bref-ftab:hover { border-color: #0B2545; color: #0B2545; }
.bref-ftab.active { background: #0B2545; border-color: #0B2545; color: #fff; }
.bref-ftab-count { background: rgba(255,255,255,.25); font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 20px; }
.bref-ftab:not(.active) .bref-ftab-count { background: #F3F4F6; color: #374151; }

/* GRİD */
.bref-grid { display: grid; gap: 16px; }
.bref-cols-5 { grid-template-columns: repeat(5, 1fr); }
.bref-cols-4 { grid-template-columns: repeat(4, 1fr); }
.bref-cols-3 { grid-template-columns: repeat(3, 1fr); }

/* KART */
.bref-item { background: #fff; border: 1px solid #E5E7EB; border-radius: 14px; padding: 22px 16px 18px; display: flex; flex-direction: column; align-items: center; gap: 10px; transition: all .28s; position: relative; overflow: hidden; }
.bref-item::before { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #0B2545, #1D8A7A); opacity: 0; transition: opacity .28s; }
.bref-item:hover { transform: translateY(-5px); box-shadow: 0 12px 36px rgba(11,37,69,.12); border-color: transparent; }
.bref-item:hover::before { opacity: 1; }

/* LOGO ALANI */
.bref-item-logo { width: 120px; height: 72px; display: flex; align-items: center; justify-content: center; }
.bref-item-logo img { max-width: 100%; max-height: 100%; object-fit: contain; filter: grayscale(20%); transition: filter .28s; }
.bref-item:hover .bref-item-logo img { filter: grayscale(0%); }
.bref-item-initial { width: 90px; height: 56px; background: linear-gradient(135deg, #EEF2FF, #E0F2FE); border-radius: 10px; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 18px; color: #1A3A6B; letter-spacing: -0.5px; }

/* METİNLER */
.bref-item-name { font-weight: 700; font-size: 13.5px; color: #0B2545; text-align: center; line-height: 1.3; }
.bref-item-sector { font-size: 12px; color: #9CA3AF; text-align: center; }

/* KATEGORİ ROZET */
.bref-item-kat { font-size: 10.5px; font-weight: 700; padding: 3px 10px; border-radius: 20px; text-transform: uppercase; letter-spacing: .4px; }
.bref-kat-akinsoft { background: #EEF2FF; color: #4338CA; }
.bref-kat-guvenlik { background: #FFF7ED; color: #C2410C; }
.bref-kat-pos      { background: #FDF4FF; color: #7E22CE; }
.bref-kat-yazilim  { background: #F0FDF4; color: #15803D; }
.bref-kat-diger    { background: #F3F4F6; color: #4B5563; }

/* RESPONSİVE */
@media(max-width:1024px){ .bref-cols-5 { grid-template-columns: repeat(4,1fr); } }
@media(max-width:820px) { .bref-cols-5, .bref-cols-4 { grid-template-columns: repeat(3,1fr); } }
@media(max-width:580px) { .bref-cols-5, .bref-cols-4, .bref-cols-3 { grid-template-columns: repeat(2,1fr); } }
@media(max-width:360px) { .bref-cols-5, .bref-cols-4, .bref-cols-3 { grid-template-columns: 1fr; } }