:root{
  --bf-bg1: #0a192f;
  --bf-bg2: #1e3a5f;
  --bf-primary: #0d47a1;
  --bf-accent: #1976d2;

  --bf-text: rgba(248,249,250,.88);
  --bf-text-strong: rgba(248,249,250,.94);
  --bf-muted: rgba(248,249,250,.62);

  --bf-glass: rgba(255,255,255,.06);
  --bf-glass-2: rgba(255,255,255,.04);
  --bf-border: rgba(255,255,255,.10);
  --bf-border-2: rgba(255,255,255,.08);

  --bf-shadow: 0 18px 50px rgba(0,0,0,.45);
  --bf-radius: 18px;
}

html{ scroll-behavior: smooth; }
body{
  margin: 0;
  color: var(--bf-text);
  background: radial-gradient(1200px 800px at 25% 10%, rgba(25,118,210,.25), transparent 60%),
              radial-gradient(1000px 700px at 80% 30%, rgba(13,71,161,.22), transparent 55%),
              linear-gradient(135deg, var(--bf-bg1), var(--bf-bg2));
  font-family: Inter, Arial, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  min-height: 100vh;
}

a{ color: rgba(25,118,210,.95); text-decoration: none; }
a:hover{ color: rgba(25,118,210,1); text-decoration: underline; }

.bf-muted{ color: var(--bf-muted) !important; }
.bf-divider{
  height: 1px; width: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
  margin: 18px 0;
}

.bf-h1, h1{
  font-weight: 800;
  letter-spacing: .6px;
  color: var(--bf-text-strong);
  text-shadow:
    0 2px 12px rgba(0,0,0,.55),
    -1px 0 rgba(0,0,0,.65),
    1px 0 rgba(0,0,0,.65),
    0 -1px rgba(0,0,0,.65),
    0 1px rgba(0,0,0,.65);
}
.bf-h2, h2{
  font-weight: 800;
  color: var(--bf-text-strong);
  text-shadow:
    0 2px 10px rgba(0,0,0,.45),
    -1px 0 rgba(0,0,0,.60),
    1px 0 rgba(0,0,0,.60),
    0 -1px rgba(0,0,0,.60),
    0 1px rgba(0,0,0,.60);
}
.bf-h3, h3{
  font-weight: 700;
  color: var(--bf-text-strong);
  text-shadow: 0 2px 10px rgba(0,0,0,.40);
}
p, .lead{ color: var(--bf-text); }

.bf-glass{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04));
  border: 1px solid var(--bf-border);
  border-radius: var(--bf-radius);
  box-shadow: var(--bf-shadow);
  backdrop-filter: blur(12px);
}

.bf-alert{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 32px rgba(0,0,0,.35);
}

.bf-btn-primary{
  background: linear-gradient(135deg, rgba(13,71,161,1), rgba(25,118,210,1));
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(248,249,250,.95);
  border-radius: 14px;
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.bf-btn-primary:hover{
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 22px 55px rgba(0,0,0,.42);
}
.bf-btn-outline{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(248,249,250,.90);
  background: rgba(255,255,255,.04);
  backdrop-filter: blur(10px);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.bf-btn-outline:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.07);
  border-color: rgba(25,118,210,.45);
}

.bf-navbar{
  background: rgba(2,10,24,.55);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(12px);
}
.bf-navbar .navbar-brand{
  letter-spacing: .9px;
}
.bf-navbar .nav-link{
  color: rgba(248,249,250,.78) !important;
  font-weight: 600;
  padding: .6rem .8rem;
  border-radius: 12px;
  transition: background .15s ease, color .15s ease;
}
.bf-navbar .nav-link:hover{
  color: rgba(248,249,250,.96) !important;
  background: rgba(255,255,255,.05);
}
.bf-logo{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
}
.bf-brand-text{
  font-weight: 900;
  color: rgba(248,249,250,.95);
  text-shadow: 0 2px 10px rgba(0,0,0,.45);
}

.bf-user-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.04);
  color: rgba(248,249,250,.90);
  backdrop-filter: blur(10px);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.bf-user-btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.07);
  border-color: rgba(25,118,210,.45);
  color: rgba(248,249,250,.98);
}

section{ scroll-margin-top: 88px; }
.bf-section{
  padding: 120px 0 120px;
}
@media (max-width: 768px){
  .bf-section{ padding: 46px 0; }
}

.bf-hero{
  min-height: 90vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.bf-hero::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 600px at 20% 20%, rgba(25,118,210,.22), transparent 65%),
    radial-gradient(900px 600px at 80% 35%, rgba(13,71,161,.20), transparent 60%);
  pointer-events: none;
}
.bf-hero .container{ position: relative; z-index: 5; }

.bf-hero-content{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  padding: 20px 22px;
  border-radius: 20px;
  background: rgba(2,10,24,.30);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(12px);
  box-shadow: 0 18px 55px rgba(0,0,0,.40);
}

.bf-hero-logo{
  width: clamp(180px, 22vw, 360px) !important;
  max-width: min(360px, 82vw) !important;
  height: auto !important;
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  z-index: 2 !important;
  pointer-events: none;
  filter: drop-shadow(0 18px 40px rgba(0,0,0,.55));
}

.bf-photo-grid{
  position: absolute;
  top: 120px;
  left: 0;
  right: 0;
  height: calc(88vh - 120px);
  pointer-events: none;
  z-index: 1;
}
.bf-photo-col{
  position: absolute;
  top: 0;
  display: grid;
  gap: 18px;
}
.bf-photo-col.left{ left: 40px; }
.bf-photo-col.right{ right: 40px; }
.bf-photo-placeholder{
  width: 170px;
  height: 110px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
  opacity: .55;
}
@media (max-width: 992px){
  .bf-photo-grid{ display:none; }
}

.bf-member{
  padding: 14px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.bf-member:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.06);
  border-color: rgba(25,118,210,.30);
}

.accordion.bf-accordion .accordion-item{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 12px;
}
.accordion.bf-accordion .accordion-button{
  background: rgba(2,10,24,.22);
  color: rgba(248,249,250,.90);
  font-weight: 700;
}
.accordion.bf-accordion .accordion-button:not(.collapsed){
  background: rgba(25,118,210,.12);
  color: rgba(248,249,250,.95);
}
.accordion.bf-accordion .accordion-body{
  color: rgba(248,249,250,.82);
  background: rgba(2,10,24,.18);
}

.form-control, .form-select, textarea.form-control{
  background: rgba(0,0,0,.24) !important;
  color: rgba(248,249,250,.92) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 14px;
  backdrop-filter: blur(10px);
}
.form-control::placeholder, textarea.form-control::placeholder{
  color: rgba(248,249,250,.55) !important;
}
.form-control:focus, .form-select:focus, textarea.form-control:focus{
  background: rgba(0,0,0,.30) !important;
  border-color: rgba(25,118,210,.55) !important;
  box-shadow: 0 0 0 .25rem rgba(25,118,210,.18) !important;
  outline: none !important;
}
.form-check-input{
  background-color: rgba(0,0,0,.25) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
}
.form-check-input:checked{
  background-color: var(--bf-accent) !important;
  border-color: var(--bf-accent) !important;
}

#apply .bf-glass{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.035));
}

.bf-info-pill{
  background: rgba(0,0,0,.28) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(248,249,250,.78) !important;
  border-radius: 14px;
  padding: 10px 12px;
}

.bf-car-card{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(255,255,255,.04);
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.bf-car-card:hover{
  transform: translateY(-2px);
  border-color: rgba(25,118,210,.30);
  background: rgba(255,255,255,.06);
}
.bf-car-img{
  width: 100%;
  height: 190px;
  object-fit: cover;
  display: block;
}
.bf-car-specs{
  color: rgba(248,249,250,.78);
  font-size: .92rem;
}

.bf-admin-main{
  padding-top: 120px !important;
}

.table.table-dark{
  --bs-table-bg: rgba(2,10,24,.10);
  --bs-table-striped-bg: rgba(255,255,255,.03);
  --bs-table-hover-bg: rgba(255,255,255,.05);
  color: rgba(248,249,250,.88);
}
.table.table-dark td, .table.table-dark th{
  border-color: rgba(255,255,255,.08) !important;
}

.bf-toast{
  position: fixed;
  right: 16px;
  bottom: 16px;
  padding: 12px 14px;
  border-radius: 14px;
  color: #fff;
  z-index: 9999;
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 50px rgba(0,0,0,.45);
  transition: opacity .25s ease;
}

.bf-footer{
  padding: 28px 0;
  color: rgba(248,249,250,.60);
  border-top: 1px solid rgba(255,255,255,.08);
  background: rgba(2,10,24,.35);
  backdrop-filter: blur(10px);
}
.bf-footer img,
footer img{
  width: 42px;     
  height: auto;
  max-height: 42px; 
}

img[src*="Bishop"]{
  max-width: 100%;
  height: auto;
}


.bf-glass,
.bf-member,
.bf-car-card,
.accordion.bf-accordion .accordion-item{
  color: rgba(248,249,250,.88) !important;
}

.bf-member strong,
.bf-car-card strong,
.bf-glass strong{
  color: rgba(248,249,250,.95) !important;
}

.bf-member small,
.bf-car-specs,
.bf-muted,
.text-muted,
.bf-glass .text-muted{
  color: rgba(248,249,250,.70) !important;
}

.bf-member .text-muted,
.bf-member .small,
.bf-member small{
  color: rgba(248,249,250,.72) !important;
}

.bf-glass p,
.bf-member p,
.bf-car-card p{
  color: rgba(248,249,250,.82) !important;
}

.bf-member,
.bf-car-card{
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
}


.bf-member,
.bf-car-card,
.accordion.bf-accordion .accordion-item,
.bf-glass{
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow:
    0 18px 55px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter: blur(12px);
}

.bf-member::before,
.bf-car-card::before,
.bf-glass::before{
  content: "";
  display: block;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(25,118,210,.55), transparent);
  opacity: .75;
  margin: -2px -2px 12px -2px;
}

.bf-member:hover,
.bf-car-card:hover,
.accordion.bf-accordion .accordion-item:hover,
.bf-glass:hover{
  transform: translateY(-2px);
  border-color: rgba(25,118,210,.40) !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,.48),
    0 0 0 1px rgba(25,118,210,.18),
    inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.bf-member,
.bf-car-card,
.accordion.bf-accordion .accordion-item,
.bf-glass{
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.bf-member .fw-bold,
.bf-car-card .fw-bold{
  color: rgba(248,249,250,.95) !important;
}

@media (max-width: 768px){
  .bf-member:hover,
  .bf-car-card:hover,
  .accordion.bf-accordion .accordion-item:hover,
  .bf-glass:hover{
    transform: none;
  }
}


#about .row .col-md-4 > div,
#about .row .col-lg-4 > div,
#about .row .col-12 > div{
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px;
  padding: 14px 14px;
  box-shadow: 0 18px 55px rgba(0,0,0,.38);
  backdrop-filter: blur(12px);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

#about .row .col-md-4 > div:hover,
#about .row .col-lg-4 > div:hover,
#about .row .col-12 > div:hover{
  transform: translateY(-2px);
  border-color: rgba(25,118,210,.40);
  box-shadow: 0 24px 70px rgba(0,0,0,.48), 0 0 0 1px rgba(25,118,210,.18);
}

#codex .row .col-md-4 > div,
#codex .row .col-lg-4 > div,
#codex .row .col-12 > div{
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px;
  padding: 16px 16px;
  box-shadow: 0 18px 55px rgba(0,0,0,.38);
  backdrop-filter: blur(12px);
}

.bf-card{
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 18px;
  box-shadow: 0 18px 55px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(12px);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.bf-card:hover{
  transform: translateY(-2px);
  border-color: rgba(25,118,210,.40) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.48), 0 0 0 1px rgba(25,118,210,.18), inset 0 1px 0 rgba(255,255,255,.07);
}
@media (max-width: 768px){
  .bf-card:hover{ transform: none; }
}

.bf-hierarchy{ display:flex; flex-direction:column; gap:10px; align-items:center; }
.bf-node{
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(248,249,250,.90);
  font-weight: 700;
  min-width: 180px;
  text-align: center;
}
.bf-line{
  width: 2px; height: 16px;
  background: linear-gradient(180deg, rgba(25,118,210,.65), rgba(255,255,255,.10));
  border-radius: 999px;
}
.bf-branch{
  display:grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px;
}
@media (max-width: 576px){
  .bf-branch{ grid-template-columns: 1fr; }
}

.bf-dept{
  display:flex; align-items:baseline; justify-content:space-between;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.16);
  border: 1px solid rgba(255,255,255,.10);
}
.bf-dept span{ font-weight: 700; color: rgba(248,249,250,.90); }
.bf-dept small{ color: rgba(248,249,250,.65); }

.bf-recruit-badge{
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(2,10,24,.28);
  color: rgba(248,249,250,.92);
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
  margin: 10px auto 0; 
}

.bf-recruit-badge i{ color: rgba(25,118,210,.95); }

.bf-hero{
  position: relative;
  overflow: hidden;
}

.bf-hero-photos{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1; 
}

.bf-hero-content{
  position: relative;
  z-index: 2; 
}

.bf-hero-col{
  position: absolute;
  top: 110px;          
  bottom: 110px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.bf-hero-left{ left: 0px; top: 0px;}
.bf-hero-right{ right: 0px; top: 0px; }

.bf-hero-photo{
  width: 300px;
  height: 150px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.14);
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03)),
    radial-gradient(120px 80px at 30% 20%, rgba(25,118,210,.35), rgba(0,0,0,0) 60%);
  box-shadow: 0 18px 55px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(10px);
  opacity: .70;
}

.bf-hero-photo::after{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  background: radial-gradient(180px 120px at 60% 30%, rgba(255,255,255,.10), rgba(0,0,0,0) 55%);
  pointer-events: none;
}

@media (max-width: 992px){
  .bf-hero-photos{ display:none; }
}

.bf-row-approved td{
  background: rgba(46, 204, 113, .12) !important;
}
.bf-row-processed td{
  background: rgba(241, 196, 15, .12) !important;
}
.bf-row-rejected td{
  background: rgba(231, 76, 60, .12) !important;
}

.bf-card{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(2,10,24,.28);
  box-shadow: 0 16px 46px rgba(0,0,0,.40);
}
.bf-card-title{
  font-weight: 700;
  margin-bottom: 8px;
}
.bf-card-text{
  color: rgba(248,249,250,.88);
  white-space: pre-wrap;
}

.bf-kv{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(2,10,24,.18);
  padding: 10px 12px;
}
.bf-kv span{
  display:block;
  font-size: 12px;
  color: rgba(248,249,250,.65);
}
.bf-kv b{
  display:block;
  font-weight: 600;
  color: rgba(248,249,250,.92);
}
