:root[data-theme="dark"] {
  --bg: #101e35;
  --bg-2: #182b46;
  --bg-3: #213956;
  --surface: #182b46;
  --surface-2: #213956;
  --line: #344d6e;
  --grid-line: #29415f;
}

/* A lighter header gives the navy profile mark a clear edge. */
body > nav, .bims-header {
  background: #203d60;
  border-bottom-color: #3d5e83;
}
html[data-theme="light"] body > nav,
html[data-theme="light"] .bims-header {
  background: #e8f2ff;
  border-bottom-color: #c8dbf1;
}
body > nav .brand img,
.bims-header-logo img {
  width: 68px;
  height: 68px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.4);
  box-shadow: 0 4px 16px rgba(0,0,0,.28);
}
.bims-header-logo { width: 68px; height: 68px; }
.bims-header-inner { min-height: 96px; }
.foot-brand img { width: 52px; height: 52px; border-radius: 10px; }
.modal-logo { width: 64px; height: 64px; border-radius: 12px; }

.hero {
  isolation: isolate;
  background: #0d203b url('./bim-learning-hero.png') center center / cover no-repeat;
}
.hero::before {
  z-index: 0;
  background: linear-gradient(90deg, rgba(8,21,42,.45), rgba(8,21,42,.72) 28%, rgba(8,21,42,.76) 68%, rgba(8,21,42,.36));
}
.hero .grid-bg { opacity: .1; }
.hero h1, .hero .hero-sub, .hero .stat-lbl { color: #f1f7ff; }
.hero .hero-sub { color: #d8e7f6; }
.hero .stat { border-left-color: rgba(218,235,255,.26); }
.hero .badge { background: rgba(23,56,94,.78); color: #e5f1ff; border-color: rgba(135,185,244,.45); }
.hero .btn-ghost { color: #fff; background: rgba(17,39,67,.82); border-color: rgba(211,232,255,.34); }
.hero .stat-num { color: #6bacff; }
.hero { padding: 96px 0 190px; }
.offerings-section { position: relative; z-index: 3; margin-top: -92px; padding: 0 0 78px; background: linear-gradient(to bottom, transparent 0 92px, var(--bg-2) 92px); border-bottom: 1px solid var(--line); }
.hero-offerings { max-width: 1180px; margin: 0 auto; text-align: left; }
.hero-offerings-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.hero-offering {
  display: flex; flex-direction: column; min-height: 184px; padding: 18px;
  border: 1px solid var(--line); border-radius: 16px;
  background: var(--bg); color: var(--ink); text-decoration: none;
  box-shadow: 0 10px 28px rgba(0, 9, 26, .18);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.hero-offering:hover, .hero-offering:focus-visible { transform: translateY(-4px); border-color: var(--accent); background: var(--bg-3); }
.hero-offering-no { margin-bottom: 14px; color: var(--accent); font: 700 11px/1.3 'Inter', sans-serif; letter-spacing: .08em; }
.hero-offering strong { font-size: 17px; line-height: 1.25; }
.hero-offering small { margin-top: 8px; color: var(--ink-2); font-size: 13px; line-height: 1.4; }
.hero-offering-link { margin-top: auto; padding-top: 15px; color: var(--accent); font-size: 13px; font-weight: 700; }
.card[id^="product-"] { scroll-margin-top: 115px; }
.admin-tabs { flex-wrap: wrap; }
.admin-tab { flex: 1 1 150px; }
.admin-registration-intro { margin: 0 0 14px; color: var(--ink-2); font-size: 14px; }
.admin-registration-tools { display:flex; flex-wrap:wrap; gap:9px; margin:0 0 14px; }
.admin-registration-tools input, .admin-registration-tools select, .registration-status-select { min-height:38px; border:1px solid var(--line); border-radius:9px; background:var(--card); color:var(--ink); padding:0 10px; font:inherit; font-size:13px; }
.admin-registration-tools input { flex:1 1 210px; }
.admin-export-btn { min-height:38px; border:0; border-radius:9px; background:var(--accent); color:#fff; padding:0 14px; font:700 13px inherit; cursor:pointer; }
.registration-status-select { min-width:116px; }
.profile-learning { margin:22px 0; padding:18px; border:1px solid var(--line); border-radius:14px; background:var(--bg-2); }
.profile-learning h4 { margin:5px 0 14px; font-size:18px; }.profile-learning-item { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:13px 0; border-top:1px solid var(--line); }.profile-learning-item small { display:block; color:var(--ink-2); margin-top:4px; }.profile-learning-item a { color:var(--accent); font-weight:700; text-decoration:none; white-space:nowrap; }.profile-learning p { margin:13px 0 0; color:var(--ink-2); font-size:13px; }
@media (max-width: 1050px) { .hero-offerings-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1050px) { .hero { padding-bottom: 84px; } .offerings-section { margin-top: 0; padding: 48px 0; background: var(--bg-2); } }
@media (max-width: 680px) { .hero-offerings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 440px) { .hero-offerings-grid { grid-template-columns: 1fr; } .hero-offering { min-height: 145px; } }

/* Revit basics announcement */
.promo-card {
  border: 1px solid var(--line);
  box-shadow: 0 28px 80px rgba(5, 16, 34, .42);
}
.promo-header {
  min-height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px 32px 34px;
  background: #0c2343 url('./revit-seminar-banner.png') center / cover no-repeat;
}
.promo-header::before {
  background: linear-gradient(90deg, rgba(5, 20, 43, .28), rgba(5, 20, 43, .65) 32%, rgba(5, 20, 43, .65) 68%, rgba(5, 20, 43, .28));
}
.promo-confetti {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: 12px;
  border: 1px solid rgba(195, 226, 255, .48);
  border-radius: 13px;
  background: rgba(12, 43, 81, .8);
  color: #9ed4ff;
  animation: none;
}
.promo-confetti svg { width: 29px; height: 29px; }
.promo-tag { background: rgba(14, 51, 91, .78); border-color: rgba(181, 219, 255, .52); }
.promo-title { color: #fff; text-shadow: 0 2px 14px rgba(0, 0, 0, .5); }
.promo-title > span { color: #fff; text-shadow: none; }
.promo-title > span span { color: #ffc457; }
.promo-subtitle { color: #e0eeff; font-weight: 500; opacity: 1; }
.promo-close-btn { width: 36px; height: 36px; background: rgba(8, 30, 57, .72); border: 1px solid rgba(225, 241, 255, .35); }
.promo-body { padding: 30px 32px; }
.promo-free-badge { background: var(--accent-dim); border-style: solid; }
.promo-cta { background: linear-gradient(110deg, #1f64dc, #4a91f3); }
@media (max-width: 560px) {
  .promo-modal { padding: 10px; }
  .promo-card { border-radius: 22px; max-height: 96vh; }
  .promo-header { min-height: 205px; padding: 26px 20px 30px; border-radius: 22px 22px 0 0; }
  .promo-body { padding: 24px 20px; }
  .promo-title { font-size: 29px; }
  .promo-free-badge { font-size: 16px; }
}
@media (max-width: 700px) {
  .hero { background-position: 55% center; }
  .hero::before { background: rgba(8,21,42,.72); }
  body > nav .brand img, .bims-header-logo img { width: 48px; height: 48px; }
  .bims-header-logo { width: 48px; height: 48px; }
}
