/* Fortifi IT – Bootstrap theme layer (keep simple, modern) */
:root{
  --fi-navy: #0b1f3a;
  --fi-blue: #1d5fa7;
  --fi-sky:  #58a6ff;
  --fi-ink:  #0f172a;
  --fi-bg:   #070b13;
  --fi-card: rgba(255,255,255,.06);
  --fi-border: rgba(255,255,255,.12);
}

html, body { height: 100%; }
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #0b1220;
  background:
    radial-gradient(1200px 700px at 15% -10%, rgba(88,166,255,.28), transparent 60%),
    radial-gradient(900px 600px at 95% 10%, rgba(29,95,167,.25), transparent 55%),
    linear-gradient(180deg, #f6f9ff 0%, #ffffff 35%, #fbfdff 100%);
}

/* Top bar */
.topbar{
  background: linear-gradient(90deg, #07152b 0%, #0b1f3a 60%, #061225 100%);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.topbar-link{
  color: rgba(255,255,255,.85);
  text-decoration: none;
  font-weight: 600;
  font-size: .95rem;
}
.topbar-link:hover{ color: #fff; }

/* Navbar */
/* .nav-glass{
  background: rgba(11,31,58,.85);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.08);
} */
.navbar.nav-glass{
  background: #103056 !important; /* pick your color 164981 */
}
.navbar .nav-link{
  color: rgba(255,255,255,.85);
  font-weight: 600;
}
.navbar .nav-link:hover{ color: #fff; }
.navbar .nav-link.active{
  color: #fff;
  position: relative;
}
.navbar .nav-link.active::after{
  content: "";
  position: absolute;
  left: .5rem;
  right: .5rem;
  bottom: .3rem;
  height: 2px;
  background: rgba(88,166,255,.9);
  border-radius: 99px;
}

/* Brand */
.brand-mark{
  width: 38px; height: 38px;
  display: inline-grid;
  place-items: center;
  background: rgba(88,166,255,.14);
  border: 1px solid rgba(88,166,255,.22);
  color: #dbeafe;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.brand-mark--sm{ width: 32px; height: 32px; border-radius: 12px; }
.brand-text{ font-weight: 800; letter-spacing: .2px; }

/* Brand logo */
.brand-logo{
  height: 34px;
  width: auto;
  max-width: 190px;
}
.brand-logo--footer{
  height: 32px;
  max-width: 210px;
}

/* Buttons */
.btn-primary{
  --bs-btn-bg: var(--fi-blue);
  --bs-btn-border-color: var(--fi-blue);
  --bs-btn-hover-bg: #174f8b;
  --bs-btn-hover-border-color: #174f8b;
  --bs-btn-active-bg: #133f6f;
  --bs-btn-active-border-color: #133f6f;
  box-shadow: 0 12px 30px rgba(29,95,167,.25);
}
.btn-outline-primary{
  --bs-btn-color: var(--fi-blue);
  --bs-btn-border-color: rgba(29,95,167,.55);
  --bs-btn-hover-bg: rgba(29,95,167,.12);
  --bs-btn-hover-border-color: rgba(29,95,167,.85);
}

/* Sections */
.section{
  padding: 72px 0;
}
.section-sm{ padding: 48px 0; }

.hero{
  padding: 84px 0 64px 0;
  position: relative;
  overflow: hidden;
}
.hero::before{
  content:"";
  position:absolute;
  inset:-200px -200px auto -200px;
  height: 520px;
  background:
    radial-gradient(600px 420px at 30% 40%, rgba(88,166,255,.30), transparent 65%),
    radial-gradient(550px 380px at 70% 20%, rgba(29,95,167,.26), transparent 60%);
  transform: rotate(-2deg);
  pointer-events:none;
}
.hero-card{
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 24px;
  box-shadow: 0 22px 60px rgba(2, 6, 23, .12);
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding: .35rem .75rem;
  border-radius: 999px;
  font-weight: 700;
  color: #0b1f3a;
  background: rgba(88,166,255,.16);
  border: 1px solid rgba(88,166,255,.24);
}
.display-5{ letter-spacing: -0.6px; }

.card-soft{
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  box-shadow: 0 16px 44px rgba(2, 6, 23, .10);
}
.icon-pill{
  width: 44px; height: 44px;
  border-radius: 16px;
  display:inline-grid;
  place-items:center;
  background: rgba(88,166,255,.14);
  border: 1px solid rgba(88,166,255,.24);
  color: var(--fi-blue);
}

.mini-stat{
  background: rgba(11,31,58,.06);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  padding: 14px 14px;
}

.divider{
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(15,23,42,.12), transparent);
}

.footer{
  background: linear-gradient(180deg, #07152b 0%, #061225 100%);
  border-top: 1px solid rgba(255,255,255,.08);
}
.footer-title{
  color: #fff;
  font-weight: 800;
  margin-bottom: .75rem;
}
.footer-links a{
  color: rgba(255,255,255,.72);
  text-decoration: none;
}
.footer-links a:hover{ color:#fff; text-decoration: underline; }
.footer-hr{ border-color: rgba(255,255,255,.12); }

.badge.text-bg-light-subtle{
  background: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.85) !important;
}

.form-control, .form-select{
  border-radius: 14px;
  border-color: rgba(15,23,42,.12);
  padding: .75rem .9rem;
}
.form-control:focus, .form-select:focus{
  border-color: rgba(29,95,167,.55);
  box-shadow: 0 0 0 .25rem rgba(29,95,167,.12);
}

@media (max-width: 991.98px){
  .hero{ padding: 64px 0 48px 0; }
  .section{ padding: 56px 0; }
}


/* Photo-style hero backgrounds (local assets) */
.hero--photo{
  background:
    linear-gradient(90deg, rgba(246,249,255,.92) 0%, rgba(246,249,255,.82) 55%, rgba(246,249,255,.55) 100%),
    url('../img/hero-server.jpg') center/cover no-repeat;
}

/* Page header banners */
.page-hero{
  padding: 78px 0 56px 0;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(7,21,43,.92) 0%, rgba(7,21,43,.78) 55%, rgba(7,21,43,.45) 100%),
    url('../img/page-services.jpg') center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.page-hero .kicker{
  color: #fff;
  background: rgba(88,166,255,.18);
  border-color: rgba(88,166,255,.28);
}
.page-hero .lead{ color: rgba(255,255,255,.82) !important; }
.page-hero--services{ background:
    linear-gradient(90deg, rgba(7,21,43,.92) 0%, rgba(7,21,43,.78) 55%, rgba(7,21,43,.45) 100%),
    url('../img/page-services.jpg') center/cover no-repeat; }
.page-hero--security{ background:
    linear-gradient(90deg, rgba(7,21,43,.92) 0%, rgba(7,21,43,.78) 55%, rgba(7,21,43,.45) 100%),
    url('../img/page-security.jpg') center/cover no-repeat; }
.page-hero--support{ background:
    linear-gradient(90deg, rgba(7,21,43,.92) 0%, rgba(7,21,43,.78) 55%, rgba(7,21,43,.45) 100%),
    url('../img/page-contact.jpg') center/cover no-repeat; }
.page-hero--contact{ background:
    linear-gradient(90deg, rgba(7,21,43,.92) 0%, rgba(7,21,43,.78) 55%, rgba(7,21,43,.45) 100%),
    url('../img/page-support.jpg') center/cover no-repeat; }

@media (max-width: 991.98px){
  .page-hero{ padding: 64px 0 44px 0; }
}