:root {
  --ag-overlay: rgba(0,0,0,0.62);
  --ag-border: rgba(255,255,255,0.12);
}

/* Background */

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  background: linear-gradient(var(--ag-overlay), var(--ag-overlay)), url("../../assets/img/bg.png") center/cover no-repeat fixed;
}

/* Glass panels */

.ag-glass {
  background: rgba(255,255,255,0.10);
  backdrop-filter: blur(10px);
  border: 1px solid var(--ag-border);
  box-shadow: 0 1rem 2.5rem rgba(0,0,0,0.25);
}

/* Image frame ensures full image visible without crop */

.ag-img-frame {
  background: rgba(0,0,0,0.35);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* Full image, no crop */

.hero-img, .cta-img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

/* Text readability on hero/contact */

.ag-hero-text, .ag-contact-text {
  color: rgba(255,255,255,0.92);
}

.ag-hero-text .lead, .ag-contact-text p {
  color: rgba(255,255,255,0.85);
}

/* Badges */

.ag-badge {
  background: rgba(255,193,7,0.15);
  color: #ffc107;
  border: 1px solid rgba(255,193,7,0.25);
  font-weight: 800;
}

/* Cards */

.ag-card, .section-card {
  background: #0f172a;
  color: rgba(255,255,255,0.92);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 1.25rem;
  box-shadow: 0 0.75rem 2rem rgba(0,0,0,0.22);
  overflow: hidden;
}

/* Fix dark/muted text readability everywhere inside our cards */

.ag-card .text-muted, .ag-card .text-white-50, .ag-modal .text-white-75, .ag-modal .text-white-50 {
  color: rgba(255,255,255,0.72) !important;
}

/* List styles */

.ag-card .list-group-item {
  color: rgba(255,255,255,0.88) !important;
  border-color: rgba(255,255,255,0.07);
}

.ag-card a {
  color: rgba(255,255,255,0.95) !important;
  text-decoration: underline;
}

/* Service thumbs (you already tuned this) */

.thumb {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

/* Hover glow on service cards */

.ag-service-card {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ag-service-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 0 25px rgba(255,140,0,0.35);
}

/* Modal styling */

.ag-modal {
  background: rgba(10,15,25,0.92);
  backdrop-filter: blur(12px);
  color: #fff;
}

.ag-modal-img {
  width: 100%;
  height: auto;
  display: block;
}

.ag-modal-info {
  background: rgba(15, 23, 42, 0.70);
  backdrop-filter: blur(8px);
  border-top: 1px solid rgba(255,255,255,0.08);
}