/* style.css - custom styling (keeps bootstrap look but refines) */

:root{
  --primary: #0d6efd; /* bootstrap primary */
  --muted: #6c757d;
}

/* Hero slide */
.hero-slide{
  min-height: 68vh;
  background-size: cover;
  background-position: center;
  position: relative;
  display: flex;
  align-items: center;
}
.hero-slide::after{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(15, 15, 15, 0.45);
}

/* ensure text inside hero is above overlay */
.hero-slide .container { position: relative; z-index: 2; }

/* Cards */
.card.service-card img { height: 200px; object-fit: cover; }

/* Portfolio images */
#portfolio .card img { height: 220px; object-fit: cover; }

/* Slight hover effect */
.card:hover { transform: translateY(-6px); transition: transform .25s ease; }

/* Footer */
footer { font-size: .95rem; }

/* Responsive tweaks */
@media (max-width: 767px) {
  .hero-slide { min-height: 50vh; }
  .card.service-card img { height: 150px; }
}

/* Accessibility focus */
a:focus, button:focus, input:focus, textarea:focus {
  outline: 3px solid rgba(13,110,253,0.25);
  outline-offset: 2px;
}

/* Large content spacing */
section { padding-top: 3.5rem; padding-bottom: 3.5rem; }