/*
 * BizGo Mini CSS — Fast-loading minimal stylesheet
 * Brand: Blue #2FA5D4 → #1B4483 | Green #95C02F → #497629
 * Depends on: Bootstrap 5 (loaded via CDN)
 */

/* ── Fonts ─────────────────────────────────────────────────────────────── */
/* Google Fonts loaded async in header-mini.php — @import removed (render-blocking) */

/* Override Unicons font-display to prevent invisible text during load */
@font-face {
  font-family: 'unicons';
  font-display: swap;
  src: local('unicons');   /* dummy src; real src comes from Unicons CSS loaded async */
}

/* ── CSS Variables ──────────────────────────────────────────────────────── */
:root {
  --bz-primary:      #2FA5D4;
  --bz-primary-dark: #1B4483;
  --bz-green:        #95C02F;
  --bz-green-dark:   #497629;
  --bz-text:         #3a4255;
  --bz-heading:      #1a2236;
  --bz-soft-primary: #e6f5fb;
  --bz-dark:         #0d1526;
  --bs-primary:      #2FA5D4;
  --bs-primary-rgb:  47, 165, 212;
}

/* ── Base ───────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'Urbanist', sans-serif;
  color: var(--bz-text);
  font-size: 0.95rem;
  line-height: 1.7;
  margin: 0;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--bz-heading);
  font-weight: 700;
  line-height: 1.3;
}

a { color: var(--bz-primary); text-decoration: none; }
a:hover { color: var(--bz-primary-dark); }

img { max-width: 100%; }

/* ── Navbar ─────────────────────────────────────────────────────────────── */
.bz-navbar {
  background: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  padding: 0.75rem 0;
  position: sticky;
  top: 0;
  z-index: 1030;
}

.bz-navbar .navbar-brand img { height: 38px; }

.bz-navbar .nav-link {
  color: var(--bz-heading);
  font-weight: 600;
  padding: 0.4rem 0.85rem;
  transition: color .2s;
}

.bz-navbar .nav-link:hover,
.bz-navbar .nav-link.active {
  color: var(--bz-primary);
}

.bz-navbar .navbar-toggler {
  border: none;
  outline: none;
  box-shadow: none;
}

/* ── Buttons ────────────────────────────────────────────────────────────── */
.btn-primary {
  background: var(--bz-primary);
  border-color: var(--bz-primary);
  color: #fff;
  font-weight: 600;
}
.btn-primary:hover, .btn-primary:focus {
  background: var(--bz-primary-dark);
  border-color: var(--bz-primary-dark);
  color: #fff;
}

.btn-outline-primary {
  border-color: var(--bz-primary);
  color: var(--bz-primary);
  font-weight: 600;
}
.btn-outline-primary:hover {
  background: var(--bz-primary);
  border-color: var(--bz-primary);
  color: #fff;
}

.btn-gradient {
  background: linear-gradient(120deg, var(--bz-primary) 0%, var(--bz-primary-dark) 100%);
  border: none;
  color: #fff !important;
  font-weight: 700;
  transition: opacity .2s;
}
.btn-gradient:hover { opacity: .88; color: #fff; }

.btn-gradient-green {
  background: linear-gradient(120deg, var(--bz-green) 0%, var(--bz-green-dark) 100%);
  border: none;
  color: #fff !important;
  font-weight: 700;
  transition: opacity .2s;
}
.btn-gradient-green:hover { opacity: .88; }

/* ── Section helpers ────────────────────────────────────────────────────── */
.section { padding: 4rem 0; }
.section-sm { padding: 2.5rem 0; }
.section-lg { padding: 6rem 0; }

.bg-soft-primary { background-color: var(--bz-soft-primary); }
.bg-primary-grad  { background: linear-gradient(120deg, var(--bz-primary) 0%, var(--bz-primary-dark) 100%); }
.bg-green-grad    { background: linear-gradient(120deg, var(--bz-green) 0%, var(--bz-green-dark) 100%); }

/* ── Text helpers ───────────────────────────────────────────────────────── */
.text-primary   { color: var(--bz-primary) !important; }
.text-primary-dark { color: var(--bz-primary-dark) !important; }
.text-green     { color: var(--bz-green) !important; }
.text-heading   { color: var(--bz-heading); }
.text-muted     { color: #474747 !important; }
p.text-muted {font-size: 1.2rem !important;}
li.text-muted, div.text-muted {font-size: 1rem !important;}

.text-gradient-blue {
  background: linear-gradient(120deg, var(--bz-primary) 0%, var(--bz-primary-dark) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.text-gradient-green {
  background: linear-gradient(120deg, var(--bz-green) 0%, var(--bz-green-dark) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.fs-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* ── Cards ──────────────────────────────────────────────────────────────── */
.bz-card {
  border: 1px solid #e8edf3;
  border-radius: 1rem;
  background: #fff;
  padding: 1.75rem;
  transition: transform .2s, box-shadow .2s;
}
.bz-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 .75rem 2rem rgba(47,165,212,.12);
}

/* ── Icon box ───────────────────────────────────────────────────────────── */
.icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: var(--bz-soft-primary);
  color: var(--bz-primary);
  font-size: 1.5rem;
  flex-shrink: 0;
}

/* ── Footer ─────────────────────────────────────────────────────────────── */
.bz-footer {
  background: var(--bz-dark);
  color: #8a9ab0;
  padding: 3.5rem 0 2rem;
}
.bz-footer h5 { color: #cdd8ea; font-size: .9rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .75rem; }
.bz-footer a  { color: #8a9ab0; }
.bz-footer a:hover { color: var(--bz-primary); }
.bz-footer .bz-footer-brand img { height: 34px; }
.bz-footer .social-icons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid #2a3a52;
  color: #8a9ab0;
  font-size: 1rem;
  margin-right: .4rem;
  transition: background .2s, color .2s;
}
.bz-footer .social-icons a:hover {
  background: var(--bz-primary);
  border-color: var(--bz-primary);
  color: #fff;
}
.bz-footer-bottom {
  border-top: 1px solid #1e2e44;
  margin-top: 2.5rem;
  padding-top: 1.25rem;
  font-size: .82rem;
  color: #5a6a80;
}

/* ── Breadcrumb ─────────────────────────────────────────────────────────── */
.breadcrumb-item + .breadcrumb-item::before { color: #aab; }
.breadcrumb-item a { color: var(--bz-primary); }
.breadcrumb-item.active { color: var(--bz-text); }

/* ── Hero (generic) ─────────────────────────────────────────────────────── */
.bz-hero {
  padding: 5rem 0 4rem;
  background: linear-gradient(135deg, var(--bz-soft-primary) 0%, #f0f8ff 100%);
}

/* ── Form controls ──────────────────────────────────────────────────────── */
.form-control:focus, .form-select:focus {
  border-color: var(--bz-primary);
  box-shadow: 0 0 0 .2rem rgba(47,165,212,.2);
}

/* ── Pagination ─────────────────────────────────────────────────────────── */
.page-link { color: var(--bz-primary); }
.page-item.active .page-link {
  background: var(--bz-primary);
  border-color: var(--bz-primary);
}

/* ── Responsive tweaks ──────────────────────────────────────────────────── */
@media (max-width: 767.98px) {
  .section    { padding: 2.75rem 0; }
  .section-lg { padding: 3.5rem 0; }
  .bz-hero    { padding: 3rem 0 2.5rem; }
}
