/* =========================================================
   SecureTechBee — FINAL LOOK (production)
   Clean · Secure · Reliable · High contrast
   ========================================================= */

:root {
  --bg: #f4f7fb;
  --bg-soft: #e9eef6;
  --ink: #0f172a;
  --navy: #0b1220;
  --navy-2: #152238;
  --bee: #e8a317;
  --honey: #f5c84c;
  --cyan: #0ea5c6;
  --white: #ffffff;
  --muted: #475569;
  --border: #d7e0ec;
  --line: #e2e8f0;
  --card: #ffffff;
  --shadow: 0 20px 50px rgba(11, 18, 32, 0.11);
  --shadow-soft: 0 10px 28px rgba(11, 18, 32, 0.06);
  --radius: 20px;
  --font-display: "Outfit", "Segoe UI", sans-serif;
  --font-body: "Figtree", "Segoe UI", sans-serif;
  --font-label: "Outfit", "Segoe UI", sans-serif;
}

/* Base */
body {
  font-family: var(--font-body);
  color: var(--ink);
  background:
    radial-gradient(900px 420px at 6% -8%, rgba(14,165,198,.07), transparent 55%),
    radial-gradient(780px 360px at 96% 0%, rgba(232,163,23,.09), transparent 48%),
    linear-gradient(180deg, #f8fafc 0%, var(--bg) 42%, #eef2f7 100%);
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
}
body::before { display: none !important; }

.site-header, main, .site-footer, .float-cta, .site-chrome { position: relative; z-index: 1; }
main { isolation: isolate; }

/* Sticky chrome: trust bar + header together */
.site-chrome {
  position: sticky;
  top: 0;
  z-index: 200;
}

.top-trust-bar {
  background: linear-gradient(90deg, #07101c, #0f1c33 55%, #12243d);
  color: #e2e8f0;
  border-bottom: 1px solid rgba(245,200,76,.22);
  font-size: .8rem;
  font-weight: 700;
}
.top-trust-inner {
  min-height: 38px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  padding: 7px 0;
}
.top-trust-inner span,
.top-trust-inner a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #e2e8f0;
}
.top-trust-inner .ui-icon { width: 14px; height: 14px; color: var(--honey); }
.top-trust-inner a:hover { color: var(--honey); }

.site-header {
  position: relative !important;
  top: auto !important;
  background: rgba(11, 18, 32, 0.97);
  border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 8px 24px rgba(0,0,0,.16);
  backdrop-filter: blur(14px);
}
.site-header.scrolled {
  background: rgba(11, 18, 32, 0.99);
  box-shadow: 0 12px 32px rgba(0,0,0,.22);
}
.header-inner { min-height: 72px; }
.brand-logo {
  height: 58px;
  max-width: min(260px, 56vw);
  border-radius: 12px;
  box-shadow: none;
  background: #ffffff;
  padding: 4px 8px;
  box-sizing: content-box;
}
.footer-brand {
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
.footer-logo {
  height: 68px;
  max-width: min(260px, 85vw);
}

/* Typography */
.brand-copy strong,
h1, h2, h3,
.display-title,
.price-value,
.stat-card strong,
.section-heading h2 {
  font-family: var(--font-display);
  letter-spacing: -.025em;
}

.eyebrow,
.section-heading .eyebrow,
.breadcrumb,
.accent,
.mode-code {
  font-family: var(--font-label) !important;
  font-size: .72rem !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
  font-weight: 800 !important;
  color: #b45309 !important;
}

.section-dark .eyebrow,
.section-dark .section-heading .eyebrow,
.page-hero .breadcrumb,
.cta-band .eyebrow,
.newsletter-band .eyebrow,
.hero .command-label {
  color: var(--honey) !important;
}

.section-heading h2,
.display-title { color: var(--ink); }
.section-dark .section-heading h2,
.section-dark .display-title,
.page-hero h1,
.cta-band .display-title,
.newsletter-band .display-title { color: #fff; }

.section-heading p,
.lede,
.form-note,
.service-card p,
.case-card p,
.blog-card p,
.industry-card p,
.career-card p,
.mode-card p,
.price-card > p,
.faq-item p { color: var(--muted) !important; }

.section-dark .section-heading p,
.section-dark .lede,
.page-hero p,
.cta-sub,
.newsletter-band p { color: rgba(226,232,240,.84) !important; }

/* Cards — solid, clean, readable */
.service-card,
.price-card,
.testimonial-card,
.case-card,
.blog-card,
.team-card,
.industry-card,
.career-card,
.mode-card,
.form-card,
.faq-item,
.feature-media,
.exam-panel,
.founder-band,
.founder-spotlight {
  background: var(--card) !important;
  color: var(--ink);
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow-soft);
  backdrop-filter: none;
  border-radius: var(--radius);
}

.service-card,
.price-card,
.testimonial-card,
.case-card,
.blog-card,
.team-card,
.industry-card,
.career-card,
.mode-card { transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }

.service-card:hover,
.career-card:hover,
.mode-card:hover,
.case-card:hover,
.blog-card:hover,
.price-card:hover,
.testimonial-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow);
  border-color: rgba(232,163,23,.4) !important;
}

.service-card h3,
.price-card h3,
.case-card h3,
.blog-card h3,
.team-card h3,
.industry-card h3,
.career-card h3,
.mode-card h3,
.exam-panel h3,
.testimonial-card figcaption strong,
.founder-quote { color: var(--ink) !important; }

.product-card,
.section-dark .service-card.product-card {
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.14) !important;
  color: #fff !important;
}
.product-card h3 { color: #fff !important; }
.product-card p { color: rgba(226,232,240,.8) !important; }

.cert-badge {
  background: #fff !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.section-dark .cert-badge {
  background: rgba(255,255,255,.08) !important;
  color: #f8fafc !important;
  border-color: rgba(255,255,255,.14) !important;
}
.cert-badge .ui-icon { width: 16px; height: 16px; color: var(--bee); }

/* Stats */
.trust-strip .stat-card,
.stat-card.solid,
.about-stats .stat-card,
.stat-card {
  background: #fff !important;
  border: 1px solid var(--line);
  color: var(--ink);
}
.trust-strip .stat-card strong,
.stat-card.solid strong,
.about-stats .stat-card strong,
.stat-card strong { color: #b45309 !important; }
.trust-strip .stat-card span,
.stat-card.solid span,
.about-stats .stat-card span,
.stat-card span { color: var(--muted) !important; }
.hero .stat-card { background: rgba(255,255,255,.08) !important; color: #fff; }
.hero .stat-card strong { color: var(--honey) !important; }
.hero .stat-card span { color: rgba(255,255,255,.8) !important; }

/* Buttons */
.btn-primary,
.nav-cta {
  background: linear-gradient(135deg, #f0b429, #df9610) !important;
  color: #0b1220 !important;
  border: 0;
  box-shadow: 0 10px 24px rgba(223,150,16,.28);
  font-weight: 800;
}
.btn-primary:hover,
.nav-cta:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(223,150,16,.34); }
.btn-dark {
  background: linear-gradient(160deg, #1a2b48, #0b1220) !important;
  color: #fff !important;
}
.btn-secondary {
  background: rgba(255,255,255,.1) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.28) !important;
}
.btn-secondary:hover {
  color: var(--honey) !important;
  border-color: var(--honey) !important;
}
.section:not(.section-dark):not(.cta-band):not(.newsletter-band) .btn-secondary,
.section-soft .btn-secondary {
  background: #fff !important;
  color: #0b1220 !important;
  border: 1px solid #cbd5e1 !important;
}
.section:not(.section-dark):not(.cta-band):not(.newsletter-band) .btn-secondary:hover,
.section-soft .btn-secondary:hover {
  border-color: #e8a317 !important;
  color: #92400e !important;
}

/* Hero */
.hero {
  background:
    radial-gradient(700px 320px at 15% 20%, rgba(14,165,198,.16), transparent 55%),
    radial-gradient(640px 300px at 85% 10%, rgba(232,163,23,.14), transparent 50%),
    #0b1220;
}
.brand-signal {
  font-family: var(--font-display);
  color: var(--honey) !important;
  background: none !important;
  -webkit-text-fill-color: unset;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
}
.mode-chip {
  color: #fde68a !important;
  background: rgba(232,163,23,.14) !important;
  border-color: rgba(245,200,76,.35) !important;
}
.mode-chip.active {
  background: linear-gradient(135deg, #f0b429, #df9610) !important;
  color: #0b1220 !important;
}
.mode-chip.active .ui-icon { color: #0b1220; }

.command-panel {
  background: linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 24px 60px rgba(0,0,0,.3);
}
.command-panel-inner {
  background: #fff !important;
  color: var(--ink) !important;
  border-radius: 18px;
}
.command-panel-inner h2 { color: var(--ink) !important; }
.command-label { color: #64748b !important; font-family: var(--font-label) !important; }

.icon-badge {
  width: 50px;
  height: 50px;
  border-radius: 16px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(145deg, #fff7ed, #e0f2fe);
  border: 1px solid #fde68a;
  color: #b45309;
}
.icon-badge .ui-icon { width: 22px; height: 22px; }
.icon-badge.dark {
  background: rgba(245,200,76,.14);
  border-color: rgba(245,200,76,.3);
  color: var(--honey);
}

.client-marquee {
  background: #fff;
  border-block: 1px solid var(--line);
  padding: 16px 0;
}
.client-pill {
  background: #f8fafc;
  color: var(--ink);
  border: 1px solid var(--line);
  font-weight: 800;
}
.client-pill .ui-icon { color: var(--bee); width: 15px; height: 15px; }

/* Testimonials */
.star-row { display: inline-flex; gap: 3px; align-items: center; }
.star-icon { width: 15px; height: 15px; }
.star-full { color: #e8a317; }
.star-full .star-icon { fill: #e8a317; stroke: #e8a317; }
.star-half { color: #e8a317; opacity: .65; }
.star-half .star-icon { fill: #e8a317; stroke: #e8a317; }
.star-empty { color: #d5dde8; }
.star-empty .star-icon { fill: transparent; stroke: #c5d0de; }
.testimonial-card blockquote {
  color: #1e293b !important;
  font-weight: 600;
  margin: 0;
  line-height: 1.7;
}
.company-line { color: var(--muted) !important; }
.rating-chip {
  background: #fff7ed;
  color: #92400e;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 800;
  font-size: .78rem;
  width: fit-content;
}
.quote-mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #fff7ed, #e0f2fe);
  color: #b45309;
}
.premium-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(232,163,23,.4), transparent);
  margin: 4px 0 10px;
}
.card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

/* Dark sections */
.section-dark {
  background:
    radial-gradient(circle at 12% 18%, rgba(14,165,198,.12), transparent 28%),
    radial-gradient(circle at 88% 0%, rgba(232,163,23,.1), transparent 30%),
    linear-gradient(155deg, #0b1220, #152238 55%, #1a2740);
}
.process-step h3,
.workflow-item h3 { color: #fff !important; }
.process-step p,
.workflow-item p { color: rgba(226,232,240,.78) !important; }
.after-label { color: var(--honey) !important; }

.founder-role { color: #b45309 !important; }
.focus-chips li {
  background: #f8fafc;
  border: 1px solid var(--line);
  color: var(--ink);
}
.pill-list li {
  background: #f8fafc !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
}

.page-hero {
  background:
    radial-gradient(700px 280px at 15% 20%, rgba(14,165,198,.18), transparent 50%),
    radial-gradient(600px 260px at 85% 10%, rgba(232,163,23,.14), transparent 45%),
    linear-gradient(120deg, rgba(11,18,32,.94), rgba(21,34,56,.84)),
    url("../images/banners/banner-cbt-exam-lab-1920x600.jpg") center/cover no-repeat;
}

.cta-band,
.newsletter-band {
  background:
    radial-gradient(600px 220px at 10% 0%, rgba(232,163,23,.14), transparent 50%),
    linear-gradient(135deg, #0b1220, #152238);
}

.site-footer {
  background:
    radial-gradient(700px 260px at 80% 0%, rgba(14,165,198,.08), transparent 50%),
    linear-gradient(180deg, #0b1220, #070d16);
}
.footer-link-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.footer-link-row .ui-icon { width: 15px; height: 15px; color: var(--honey); }
.site-footer a:hover { color: var(--honey); }
.footer-text,
.site-footer li,
.site-footer address { color: rgba(226,232,240,.78); }
.footer-founder { color: var(--honey) !important; font-weight: 700; }

.contact-aside {
  background: linear-gradient(160deg, #0b1220, #1a2b48) !important;
  color: #fff !important;
}
.contact-aside h2,
.contact-aside strong { color: #fff !important; }
.contact-aside p,
.contact-aside span { color: rgba(226,232,240,.86) !important; }
.contact-aside a { color: var(--honey) !important; }

.ui-icon { display: inline-block; vertical-align: -0.15em; }
.btn-with-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}
.btn-with-icon .ui-icon { width: 17px; height: 17px; }

.trust-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}
.trust-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color: #e2e8f0;
  font-size: .84rem;
  font-weight: 700;
}
.trust-chip .ui-icon { width: 14px; height: 14px; color: var(--honey); }

.secure-banner {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 26px;
}
.secure-item {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  box-shadow: var(--shadow-soft);
}
.secure-item strong {
  display: block;
  font-family: var(--font-display);
  color: var(--ink);
  margin-bottom: 4px;
}
.secure-item span {
  color: var(--muted);
  font-size: .9rem;
  font-weight: 600;
}

.float-cta {
  box-shadow: 0 14px 32px rgba(232,163,23,.35);
  gap: 8px;
}

.exam-panel-visual,
.founder-photo {
  background:
    radial-gradient(circle at 20% 20%, rgba(232,163,23,.28), transparent 42%),
    radial-gradient(circle at 80% 10%, rgba(14,165,198,.2), transparent 36%),
    linear-gradient(145deg, #0b1220, #1a2b48);
}

@media (max-width: 991px) {
  .top-trust-inner { justify-content: center; text-align: center; }
  .secure-banner { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .client-track,
  .hero-media { animation: none !important; }
  .reveal { transition: none; }
}