:root{
  --brand:#0d6efd;
  --brand-2:#1554c0;
  --bg:#ffffff;
  --text:#232b3a;
  --muted:#5c6b82;
  --soft:#f6f8fb;
  --border:#e6ebf2;
}
html,body{background:var(--bg);color:var(--text);}
a{color:var(--brand);}
.navbar{background:#fff;border-bottom:1px solid var(--border);}
.navbar .nav-link{color:#344056;}
.navbar .nav-link.active, .navbar .nav-link:hover{color:var(--brand);}
.hero{background:linear-gradient(180deg,#f7faff 0%,#ffffff 70%);padding:6rem 0 3.5rem;}
.hero .badge{background:#e9f2ff;color:#1b4fbf;border:1px solid #d8e6ff;}
.kpis .kpi{background:#fff;border:1px solid var(--border);border-radius:14px;padding:1.25rem;box-shadow:0 6px 20px rgba(18,38,63,.06);}
.btn-primary{background:var(--brand);border-color:var(--brand);}
.btn-primary:hover{background:var(--brand-2);border-color:var(--brand-2);}
.btn-outline-dark{color:#232b3a;border-color:#c9d3e1;}
.btn-outline-dark:hover{background:#f3f6fb;}
.section{padding:4rem 0;}
.card-clean{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 6px 20px rgba(18,38,63,.06);}
.footer{background:#0e1a2b;color:#dbe3f0;}
.footer a{color:#dbe3f0;}
.form-control,.form-select{border-color:#cfd7e6;}
.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:none;}
.breadcrumb{--bs-breadcrumb-divider: '›';}
.price{font-weight:800;font-size:2.75rem;color:var(--brand);}
.strike{text-decoration:line-through;color:#8a98ad;}
.required::after{content:" *";color:#d63384;}
.table thead{color:#66748b;}
.table-striped>tbody>tr:nth-of-type(odd){--bs-table-accent-bg:#f8fbff;}
.brand-text { font-size: 1.125rem; letter-spacing: .2px; }
/* ===== HERO with background image */
.hero-bg{
  position: relative;
  padding: 6.5rem 0 3.5rem;
  color: #fff;
  background:
    linear-gradient(180deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.75) 40%, rgba(0,0,0,.85) 100%),
    url(/training/images/hero.jpg) center/cover no-repeat;
}
.badge-hero{
  background:#e9f2ff; color:#1b4fbf; border:1px solid #d8e6ff;
}
.hero-accent{
  background: linear-gradient(90deg, #0d6efd, #3ac0ff);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}

/* ===== KPI cards on hero */
.kpis-stack{ display: grid; gap: 14px; }
.kpi-card{
  display:flex; align-items:center; gap:14px;
  background:#fff; border:1px solid #e6ebf2; border-radius:16px; padding:14px 16px;
  box-shadow:0 10px 28px rgba(18,38,63,.08);
  position: relative;
}
.kpi-icon{
  width:44px; height:44px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background:#eff6ff; color:#1b4fbf; font-size:20px;
  border:1px solid #dfe9ff;
}
.kpi-title{ font-weight:700; color:#2b3950; line-height:1; }
.kpi-sub{ color:#5a6b85; }
.kpi-badge{
  position:absolute; right:12px; top:12px;
  background:#e9fbf2; color:#0a7a3a; border:1px solid #c6f2da;
  border-radius:999px; padding:.2rem .6rem; font-size:.75rem; font-weight:600;
}

/* ===== Offer banner (high-contrast) */
.offer-banner{
  background: linear-gradient(135deg, #0d6efd 0%, #5ab0ff 45%, #00c2ff 100%);
  border-radius:18px; border:1px solid rgba(255,255,255,.25);
  box-shadow: 0 18px 40px rgba(13,110,253,.25);
}
.offer-badge{
  display:inline-block; font-size:.8rem; font-weight:700;
  color:#003a8a; background:#bfe0ff; border:1px solid #a3d0ff;
  border-radius:999px; padding:.25rem .6rem;
}
.offer-price-wrap{ display:flex; align-items:end; gap:.6rem; justify-content:flex-end; }
.offer-old{ color:#e9f2ff; opacity:.75; text-decoration:line-through; font-size:1.1rem; }
.offer-new{ color:#fff; font-weight:900; font-size:2.4rem; line-height:1; }

/* ===== Feature cards (light polish already present) */
.card-clean h5{ margin-bottom:.35rem; }
.card-clean ul{ color:#5c6b82; }
/* --- Timeline layout --- */
.timeline {
  position: relative;
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(18,38,63,.06);
}
.timeline-item {
  position: relative;
  padding-left: 2.25rem;
  padding-top: .25rem;
  padding-bottom: 1.25rem;
  border-left: 2px solid var(--border);
  margin-left: 1rem;
}
.timeline-item:last-child { padding-bottom: .5rem; }
.timeline-item .dot {
  position: absolute; left: -9px; top: .45rem;
  width: 14px; height: 14px; border-radius: 50%;
  background: #0d6efd; border: 2px solid #ffffff;
  box-shadow: 0 0 0 4px rgba(13,110,253,.12);
}
.timeline-head { margin-bottom: .25rem; }
.timeline .badge.border { border: 1px solid var(--border); }
.timeline .mini { font-size: .925rem; color: var(--muted); }

/* Support for darker themes on hero if reused there */
.bg-primary-subtle { background: #e9f2ff !important; }
/* Schedule table polish */
.table-schedule th, .table-schedule td { vertical-align: top; }
.table-schedule td .fw-semibold { color:#24324a; }
.table-schedule .badge { border:1px solid var(--border); }
.alert-info { background:#eef6ff; border-color:#d9e9ff; color:#224372; }
/* Pricing cards */
.pricing-card{
  background:#fff; border:1px solid var(--border); border-radius:16px;
  padding:24px; box-shadow:0 12px 28px rgba(18,38,63,.06);
}
.pricing-card.featured{
  border-color:#cfe2ff; box-shadow:0 16px 36px rgba(13,110,253,.18);
  position:relative; overflow:visible;
}
.pricing-card .price-line{ display:flex; align-items:baseline; gap:.6rem; }
.price-now{ font-size:2.2rem; font-weight:800; color:var(--brand); }
.price-was{ color:#8aa0bd; }
.pricing-includes li{ margin-bottom:.35rem; color:#4b5b74; }
.pricing-includes i{ color:#22a06b; margin-right:.4rem; }

/* Ribbon for featured card */
.ribbon{
  position:absolute; top:-10px; right:-10px; background:#22a06b; color:#fff;
  padding:.25rem .6rem; font-size:.8rem; font-weight:700; border-radius:10px;
  box-shadow:0 6px 12px rgba(34,160,107,.3);
}
/* Stats grid */
.stats-grid{
  display:grid; grid-template-columns: repeat(4, minmax(0,1fr));
  gap:14px;
}
.stat{
  background:#fff; border:1px solid var(--border); border-radius:14px;
  padding:18px; text-align:center; box-shadow:0 6px 20px rgba(18,38,63,.06);
}
.stat-num{ font-size:2rem; font-weight:800; color:var(--brand); line-height:1; }
.stat-unit{ font-size:.9rem; color:#51627a; margin-left:.2rem; }
.stat-label{ margin-top:.25rem; color:#51627a; }

/* Mini instructor block */
.mini-profile{ display:flex; align-items:center; gap:.6rem; }
.mini-profile .avatar{
  width:42px; height:42px; border-radius:50%;
  background:#eef3fb; border:1px solid var(--border);
}
.mini-name{ font-weight:600; }

/* Responsive tweak */
@media (max-width: 992px){
  .stats-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
/* --- About hero --- */
.about-hero{
  position: relative;
  overflow: hidden;
  padding: 5.5rem 0 3.5rem;
  color:#fff;
  /* Make the hero image the background */
  background:
    /* dark overlay on top of the image */
    linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.55)),
    url(/training/images/about-hero.jpg) center/cover no-repeat;
}
.about-hero-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-1;
  filter: brightness(.6) contrast(1.05);
}
.badge-hero{ background:#bfe0ff; color:#003a8a; border:1px solid #a3d0ff; }
.about-hero-points{ list-style:none; padding-left:0; margin:0 0 .5rem 0; }
.about-hero-points li{ margin:.2rem 0; }
.about-hero-points i{ margin-right:.4rem; }
.about-hero-card{
  background: rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.25);
  border-radius:16px; padding:16px; backdrop-filter: blur(6px);
}
.about-hero-card .num{ font-weight:800; font-size:1.25rem; color:#fff; }

/* --- Icons & value cards --- */
.icon-pill{ width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:#e9f2ff; color:#1b4fbf; border:1px solid #dfe9ff; font-size:20px; }
.value-card{ background:#fff; border:1px solid var(--border); border-radius:16px; padding:20px;
  box-shadow:0 12px 28px rgba(18,38,63,.06); height:100%; }

/* --- Mini timeline (rebrand story) --- */
.mini-timeline{ position:relative; margin-top:.5rem; }
.mini-item{ position:relative; padding-left:1.5rem; margin:.6rem 0; border-left:2px solid var(--border); }
.mini-dot{ position:absolute; left:-7px; top:.4rem; width:12px; height:12px; border-radius:50%;
  background:#0d6efd; border:2px solid #fff; box-shadow:0 0 0 3px rgba(13,110,253,.12); }
.mini-title{ font-weight:600; }
.mini-sub{ color:#5c6b82; }

/* --- Instructor --- */
.instructor-wrap{ background:#fff; border:1px solid var(--border); border-radius:16px;
  padding:22px; box-shadow:0 12px 28px rgba(18,38,63,.06); }
.instructor-photo{ width:100%; border-radius:14px; border:1px solid var(--border); object-fit:cover; }
.instructor-avatar{ width:48px; height:48px; border-radius:50%; object-fit:cover; border:1px solid rgba(255,255,255,.35); }

/* --- Testimonials carousel --- */
.testimonial p{ font-size:1.05rem; }
.carousel-control-prev-icon, .carousel-control-next-icon { filter: invert(1) grayscale(100%); }

/* --- Logos strip --- */
.logos-strip{ display:flex; gap:18px; justify-content:center; align-items:center; flex-wrap:wrap; }
.logos-strip img{ height:32px; width:auto; opacity:.85; filter: grayscale(100%); }
.logos-strip img:hover{ opacity:1; filter:none; }

/* Reuse existing stats-grid from earlier; responsive adjust if needed */
@media (max-width: 992px){
  .about-hero{ padding: 4.5rem 0 2.5rem; }
}