:root {
  --primary: #0a58ca;
  --accent: #e5182b;
  --dark: #111827;
  --muted: #6b7280;
  --bg: #f8fafc;
}

html, body {
  scroll-behavior: smooth;
}

.top-bar {
  background: var(--dark);
  color: #fff;
  font-size: 0.95rem;
  padding: 0.5rem 0;
}
.top-bar .brand { font-weight: 600; }
.top-bar a { color: #fff; text-decoration: none; }
.top-bar .divider { opacity: .5; margin: 0 .5rem; }

.navbar .btn { white-space: nowrap; }
.btn { border-radius: .375rem; padding: .6rem 1rem; font-weight: 600; }
.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-accent { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-light { background: #fff; color: var(--dark); border: 1px solid #e5e7eb; }
.btn-outline-dark { border-color: var(--dark); color: var(--dark); }
.btn-outline-dark:hover { background: var(--dark); color: #fff; }

.hero {
  position: relative;
  background: url('../../images/slider/2.webp') center/cover no-repeat;
  color: #fff;
  padding: 6rem 0;
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.55));
}
.hero .content {
  position: relative;
  z-index: 2;
}
.hero h1 {
  font-weight: 800;
  letter-spacing: -0.5px;
}
.hero .lead { font-size: 1.15rem; color: #e5e7eb; }

.section {
  padding: 4rem 0;
}
.section.bg {
  background: var(--bg);
}
.section h2 {
  font-weight: 800;
}
.card-feature {
  height: 100%;
  border: 1px solid #e5e7eb;
  border-radius: .5rem;
  padding: 1.5rem;
  background: #fff;
}
.card-feature h5 { font-weight: 700; }
.card-feature p { color: var(--muted); }

.projects .project-card img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: .5rem;
}
.projects .project-card h5 { margin-top: .75rem; font-weight: 700; }
.projects .project-card .meta { color: var(--muted); font-size: .95rem; }

.cta-band {
  background: var(--primary);
  color: #fff;
  padding: 2rem 0;
  margin-top: 2rem;
}
.cta-title { font-weight: 800; margin: 0; }

.site-footer {
  background: #0b1220;
  color: #cbd5e1;
  padding: 3rem 0 2rem;
}
.site-footer h5 { color: #fff; font-weight: 700; }
.footer-list { list-style: none; padding: 0; margin: 0; }
.footer-list li { margin-bottom: .4rem; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); margin-top: 2rem; padding-top: 1rem; font-size: .95rem; }

.muse-gallery .gallery-top { height: auto; }
.muse-gallery .gallery-thumbs { height: auto; }
.muse-gallery .gallery-top img { width: 100%; height: auto; display: block; }
.muse-gallery .gallery-thumbs .swiper-slide img { width: 100%; height: 80px; object-fit: cover; display: block; }
@media (min-width: 768px) {
  .muse-gallery .gallery-thumbs .swiper-slide img { height: 100px; }
}

.badge-area { background: rgba(10,88,202,.08); color: var(--primary); }
.list-check { padding-left: 1rem; }
.list-check li { margin-bottom: .35rem; }

.contact-form .form-text { color: var(--muted); }
.form-control:focus { border-color: var(--primary); box-shadow: 0 0 0 .2rem rgba(10,88,202,.15); }

/* small helpers */
.text-accent { color: var(--accent) !important; }
.bg-accent { background: var(--accent) !important; color: #fff; }
.border-accent { border-color: var(--accent) !important; }

@media (max-width: 991.98px) {
  .hero { padding: 4rem 0; }
}


/* layout: prevent header overlap with main content */
:root {
  --header-offset-desktop: 120px;
  --header-offset-mobile: 30px;
}

.site-main {
  padding-top: var(--header-offset-desktop);
}

/* keep hero/sections with .no-top flush to top if they are first */
.site-main > .no-top:first-child {
  margin-top: calc(-1 * var(--header-offset-desktop));
}

@media (max-width: 991.98px) {
  .site-main {
    padding-top: var(--header-offset-mobile);
  }
  .site-main > .no-top:first-child {
    margin-top: calc( var(--header-offset-mobile));
  }
}