/* About page styles - modern, professional look and subtle animations */
:root{
  --brand-1: #0d6efd; /* bootstrap primary fallback */
  --accent: #d4af37; /* gold accent (from variables.css) */
  --muted: #6c757d;
  --card-bg: #ffffff;
  --glass: rgba(255,255,255,0.6);
}

/* Page header / hero */
.page-header-minimal{
  background: linear-gradient(180deg, rgba(13,110,253,0.06), rgba(212,175,55,0.03));
  padding: 3.5rem 0;
  border-bottom: 1px solid rgba(16,24,32,0.04);
}
.page-title-minimal{
  font-size: 2.1rem;
  letter-spacing: -0.5px;
  color: #0b2140;
  text-shadow: 0 1px 0 rgba(255,255,255,0.6);
}
.page-subtitle-minimal{ color: var(--muted); font-size: 1rem; }

/* Hero image style */
.about-hero-img{
  border-radius: 12px;
  box-shadow: 0 18px 50px rgba(15,24,40,0.08);
  transform-origin: center center;
  transition: transform 360ms cubic-bezier(.2,.9,.2,1), box-shadow 360ms;
}
.about-hero-img:hover{ transform: translateY(-6px) scale(1.01); box-shadow: 0 26px 70px rgba(15,24,40,0.12); }

/* Values cards polish */
.card.h-100{
  border-radius: 14px;
  transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms;
  will-change: transform;
}
.card.h-100 .card-body { z-index: 2; }
.card.h-100.hovered, .card.h-100:hover{
  transform: translateY(-8px);
  box-shadow: 0 24px 48px rgba(2,6,23,0.08);
  border-color: rgba(16,24,40,0.04);
}

/* badges and icons */
.badge.bg-primary{
  background: linear-gradient(90deg, rgba(212,175,55,0.98), rgba(184,134,11,0.95));
  box-shadow: 0 8px 18px rgba(212,175,55,0.12);
}

/* Mission block */
.bg-gradient-primary{
  background: linear-gradient(135deg, #0d6efd 0%, rgba(16,185,166,0.12) 100%);
  box-shadow: 0 14px 40px rgba(13,110,253,0.06);
}

/* CTA styling - keeps bootstrap markup but improves visuals */
.btn-cta{
  background: linear-gradient(90deg, #d4af37 0%, #b8860b 100%);
  border: none;
  color: #08121a !important;
  font-weight: 700;
  padding: 0.9rem 1.25rem;
  border-radius: 10px;
  box-shadow: 0 16px 36px rgba(212,175,55,0.14);
  transition: transform 180ms ease, box-shadow 180ms ease;
}
.btn-cta:hover{ transform: translateY(-3px); box-shadow: 0 22px 46px rgba(212,175,55,0.18); }

.btn-cta-outline{
  border-radius: 10px;
  padding: 0.85rem 1.1rem;
  border: 1px solid rgba(13,110,253,0.12);
  color: var(--brand-1) !important;
  background: transparent;
}

/* Text treatments */
.lead{ color: #2b3a4a; }

/* Reveal animation base */
.reveal{ opacity: 0; transform: translateY(18px) scale(0.995); transition: opacity 520ms ease, transform 520ms cubic-bezier(.2,.9,.2,1); }
.reveal.is-visible{ opacity: 1; transform: translateY(0) scale(1); }

/* Slight stagger for cards */
.row.g-4 .col-lg-4{ transition-delay: 0ms; }
.row.g-4 .col-lg-4:nth-child(1) .card{ transition-delay: 40ms; }
.row.g-4 .col-lg-4:nth-child(2) .card{ transition-delay: 80ms; }
.row.g-4 .col-lg-4:nth-child(3) .card{ transition-delay: 120ms; }
.row.g-4 .col-lg-4:nth-child(4) .card{ transition-delay: 160ms; }
.row.g-4 .col-lg-4:nth-child(5) .card{ transition-delay: 200ms; }
.row.g-4 .col-lg-4:nth-child(6) .card{ transition-delay: 240ms; }

/* CTA card refinement */
.card.bg-light{ border-radius: 14px; padding: 1.2rem; box-shadow: 0 10px 30px rgba(2,6,23,0.04); }

/* Responsive tweaks */
@media (max-width: 768px){
  .page-title-minimal{ font-size: 1.6rem; }
  .about-hero-img{ margin-top: 1rem; }
}

/* Footer spacing safe-guard if needed */
footer{ margin-top: 2.5rem; }
