:root{
  --navy:#0B1F3B;
  --primary:#0D6EFD;
  --ink:#1F2937;
  --muted:#6B7280;
  --bg:#FFFFFF;
  --soft:#F6F9FF;
  --radius:1rem;
}

html,body{background:var(--bg); color:var(--ink); font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
h1,h2,h3,h4{font-family:Poppins,Inter,system-ui,sans-serif}
.text-navy{color:var(--navy)}

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

.hero-visual{position:relative; min-height:360px; background-size:cover; background-position:center}
.hero-visual .overlay{position:absolute; inset:0; background:rgba(0,0,0,.44)}
.hero-caption{position:absolute; left:0; right:0; bottom:0; color:#fff; padding:1rem 1.25rem; background:linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,0))}

.section-title{font-weight:700}

#products .accordion-item{border:none}
.accordion-button{border-radius:var(--radius)!important}
.accordion-button:not(.collapsed){background:#e9f2ff; color:var(--navy)}

.card{border-radius:var(--radius)}

.chips .chip{display:inline-block; padding:.35rem .65rem; background:#eef5ff; color:#0b4ba6; border:1px solid #d6e6ff; border-radius:999px; font-size:.8rem; margin:.2rem .25rem}

.table{--bs-table-bg: transparent}
.table thead th{color:#374151; white-space:nowrap}
.table-striped>tbody>tr:nth-of-type(odd)>*{--bs-table-accent-bg: #fafbfd}

.object-fit-cover{object-fit:cover}

 .spacer {
      height: 100vh; /* just for demo scroll space */
      background: #f8f9fa;
    }