:root{
  --bf-header-h: 78px;
  --bf-header-pad-x: clamp(18px, 3vw, 42px);
  --bf-header-bg: rgba(11,13,17,.88);
  --bf-header-border: rgba(255,255,255,.08);
  --bf-header-shadow: 0 16px 40px rgba(0,0,0,.28);
  --bf-blur: 12px;
  --bf-text: #f5f7fb;
  --bf-muted: rgba(255,255,255,.72);
  --bf-panel: rgba(255,255,255,.04);
  --bf-panel-2: rgba(255,255,255,.06);
  --bf-line: rgba(255,255,255,.14);
}

html,body{margin:0;padding:0;}
body{background:#05070b;color:var(--bf-text);}

/* default hide legacy injected headers from previous attempts */
header.bf-header,
#bfHeader,
[data-bf-header]{display:none !important;}

.bf-app-header{
  position:fixed !important;
  inset:0 0 auto 0 !important;
  height:var(--bf-header-h) !important;
  z-index:9999 !important;
  background:transparent;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  box-shadow:none;
  transition:background-color .18s ease, box-shadow .18s ease, backdrop-filter .18s ease, -webkit-backdrop-filter .18s ease, opacity .16s ease, transform .16s ease;
}
.bf-app-header::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,.45) 0%, rgba(0,0,0,.18) 60%, rgba(0,0,0,0) 100%);
  pointer-events:none;
  opacity:1;
  transition:opacity .18s ease;
}

.bf-app-header.bf-dark,
html.bf-page-inner .bf-app-header,
html.bf-page-scrolled .bf-app-header{
  background:var(--bf-header-bg) !important;
  -webkit-backdrop-filter: blur(var(--bf-blur));
  backdrop-filter: blur(var(--bf-blur));
  box-shadow:var(--bf-header-shadow);
}
.bf-app-header.bf-dark::before,
html.bf-page-inner .bf-app-header::before,
html.bf-page-scrolled .bf-app-header::before{opacity:0;}

html.bf-menu-open .bf-app-header{opacity:0 !important; pointer-events:none !important; transform:translateY(-10px) !important;}

/* normalize inner content placement */
.bf-app-header *{box-sizing:border-box;}
.bf-app-header a,
.bf-app-header button,
.bf-app-header [role="button"]{
  transition:opacity .18s ease, color .18s ease, transform .18s ease, background-color .18s ease, border-color .18s ease;
}
.bf-app-header a:hover,
.bf-app-header button:hover,
.bf-app-header [role="button"]:hover{opacity:1 !important;}

/* When we find the hero section, ensure header overlays it */
.bf-home-hero{
  position:relative;
  margin-top:0 !important;
  padding-top:calc(var(--bf-header-h) + 26px) !important;
}
html.bf-page-home:not(.bf-page-scrolled) .bf-home-hero{padding-top:calc(var(--bf-header-h) + 38px) !important;}
html.bf-page-home .bf-home-hero,
html.bf-page-home .bf-home-hero *{scroll-margin-top:90px;}

/* Remove white block on home by forcing header transparent there */
html.bf-page-home:not(.bf-page-scrolled):not(.bf-menu-open) .bf-app-header{background:transparent !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important;}
html.bf-page-home:not(.bf-page-scrolled):not(.bf-menu-open) .bf-app-header::before{opacity:1 !important;}

/* Inner pages always dark */
html.bf-page-inner .bf-app-header{background:var(--bf-header-bg) !important;}

/* Top panel more compact */
.bf-app-header > *{min-height:var(--bf-header-h) !important;}
.bf-app-header img{max-height:46px; width:auto;}

/* Vacancies restyle */
html.bf-page-vacancies body{background:#05070b;}
.bf-vac-page{position:relative; margin-top:18px;}
.bf-vac-grid{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); margin-top:24px;}
.bf-vac-card{
  position:relative; overflow:hidden; border-radius:18px; border:1px solid var(--bf-line);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  padding:20px 18px 18px; box-shadow:0 16px 40px rgba(0,0,0,.22);
}
.bf-vac-card::after{content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(600px 220px at 100% 0%, rgba(255,255,255,.10), transparent 45%); opacity:.45;}
.bf-vac-city{display:inline-flex; align-items:center; gap:8px; font-size:12px; padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.07); border:1px solid var(--bf-line); color:var(--bf-muted); text-transform:uppercase; letter-spacing:.08em;}
.bf-vac-title{margin:14px 0 8px; font-size:24px; line-height:1.15; font-weight:800; color:#fff;}
.bf-vac-salary{font-size:18px; font-weight:700; color:#fff; margin-bottom:10px;}
.bf-vac-desc{color:rgba(255,255,255,.78); line-height:1.55; margin-bottom:14px;}
.bf-vac-tags{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px;}
.bf-vac-tag{font-size:12px; padding:7px 10px; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.82);}
.bf-vac-actions{display:flex; gap:10px; flex-wrap:wrap;}
.bf-btn{display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 16px; border-radius:12px; text-decoration:none; font-weight:700; border:1px solid var(--bf-line);}
.bf-btn--light{background:#fff; color:#0a0d12;}
.bf-btn--ghost{background:rgba(255,255,255,.06); color:#fff;}
.bf-vac-empty{
  border-radius:22px; border:1px solid var(--bf-line); padding:24px; background:linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.03)); box-shadow:0 20px 50px rgba(0,0,0,.25);
}
.bf-vac-empty h3{margin:0 0 8px; font-size:26px; color:#fff;}
.bf-vac-empty p{margin:0 0 16px; color:rgba(255,255,255,.76); line-height:1.5;}
.bf-vac-toolbar{display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; margin-bottom:18px;}
.bf-chip{display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 14px; border-radius:999px; border:1px solid var(--bf-line); color:rgba(255,255,255,.9); background:rgba(255,255,255,.04); cursor:pointer;}
.bf-chip.is-active{background:#fff; color:#0a0d12; border-color:#fff;}
.bf-reveal{opacity:0; transform:translateY(12px); transition:opacity .45s ease, transform .45s ease;}
.bf-reveal.is-visible{opacity:1; transform:none;}

/* Improve existing vacancies elements if still visible */
html.bf-page-vacancies .bf-vacancies-cta__inner,
html.bf-page-vacancies .bf-vacancies-cta{display:none !important;}
html.bf-page-vacancies [class*="vacan"],
html.bf-page-vacancies [class*="Vacan"]{color:inherit;}

/* Contact form helper text and buttons */
.bf-form-success,
.bf-form-error{margin-top:12px; font-size:14px;}
.bf-form-success{color:#d1fae5;}
.bf-form-error{color:#fecaca;}

@media (max-width: 900px){
  :root{--bf-header-h:68px; --bf-header-pad-x:16px;}
  .bf-home-hero{padding-top:calc(var(--bf-header-h) + 20px) !important;}
  .bf-vac-title{font-size:20px;}
}
