/* Lightweight visual layer: no framework or font download is added. */
:root {
  --cmx-ink: #18233b;
  --cmx-muted: #66738c;
  --cmx-blue: #246bfe;
  --cmx-violet: #6657df;
  --cmx-border: #e6ebf3;
  --cmx-surface: #fff;
}
html { scroll-behavior: smooth; }
body { color: var(--cmx-ink); font-family: Inter, "Segoe UI", Arial, sans-serif; }
a { transition: color .18s ease; }
a:hover { color: var(--cmx-blue); }
.banner-1 { background-color: #17243f; background-position: center; background-size: cover; }
.banner-1 .header-text { position: relative; z-index: 1; }
.banner-1 h1 { letter-spacing: -.035em; font-weight: 750; text-shadow: 0 2px 18px rgba(0,0,0,.22); }
.section-title h1, .section-title h2 { color: var(--cmx-ink); font-weight: 750; letter-spacing: -.025em; }
.card, .item-card, .categories.card-body { border-color: var(--cmx-border); border-radius: 14px; }
.card { box-shadow: 0 8px 28px rgba(27,45,82,.055); }
.btn-primary { background: linear-gradient(135deg,var(--cmx-blue),var(--cmx-violet)); border: 0; border-radius: 9px; }
.btn-primary:hover { filter: brightness(.96); }
input.form-control, select.form-control, textarea.form-control { border-color: var(--cmx-border); border-radius: 9px; }
.categories.card-body { background: var(--cmx-surface); }
#container .col-md-2 > a > div,
.sptb .row .col-md-2 > a > div { min-height: 160px; border: 1px solid var(--cmx-border); border-radius: 12px !important; box-shadow: 0 6px 22px rgba(27,45,82,.055); transition: transform .18s ease, box-shadow .18s ease; }
#container .col-md-2 > a:hover > div,
.sptb .row .col-md-2 > a:hover > div { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(27,45,82,.11); }
#container img, .sptb .row .col-md-2 img { object-fit: contain !important; }
img { max-width: 100%; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }