/* ============================================
   PARKA SOFTWARE - CUSTOM OVERRIDES FOR AGENCY THEME
   ============================================ */

/* === PARKA BRAND COLORS === */
:root {
  --bs-primary: #9b8a5f;
  --bs-primary-rgb: 155, 138, 95;
  --color-dark-teal: #1e4a4a;
  --color-teal: #3d7a7a;
  --color-teal-light: #5fa5a5;
  --color-accent: #9b8a5f;
  --color-accent-dark: #857a52;
  --bs-link-color: #3a3a3a;
  --bs-link-hover-color: #1e4a4a;
}

/* === FONT OVERRIDES === */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

h1, h2, h3, h4, h5, h6, .section-heading, .section-subheading {
  font-family: Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* === NAVBAR OVERRIDES === */
#mainNav {
  background-color: var(--color-dark-teal) !important;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

#mainNav .navbar-brand {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-accent) !important;
}

#mainNav .navbar-nav .nav-item .nav-link {
  color: rgba(255,255,255,0.9) !important;
  font-weight: 500;
}

#mainNav .navbar-nav .nav-item .nav-link:hover,
#mainNav .navbar-nav .nav-item .nav-link.active {
  color: var(--color-accent) !important;
}

#mainNav.navbar-shrink {
  background-color: var(--color-dark-teal) !important;
}

/* === MASTHEAD (HERO) OVERRIDES === */
.masthead {
  background: var(--color-dark-teal) !important;
  background-image: none !important;
  padding-top: 180px;
  padding-bottom: 150px;
}

.masthead .masthead-subheading {
  font-size: 1.5rem;
  font-style: normal;
  color: rgba(255,255,255,0.85);
  margin-bottom: 1.5rem;
}

.masthead .masthead-heading {
  font-size: 4rem;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 2rem;
  color: #ffffff;
}

/* === BUTTONS === */
.btn-primary {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
  color: #ffffff;
}

.btn-primary:hover {
  background-color: var(--color-accent-dark);
  border-color: var(--color-accent-dark);
}

.btn-xl {
  padding: 1.25rem 2.5rem;
  font-size: 1.125rem;
  font-weight: 700;
}

/* === SECTION HEADINGS === */
.section-heading {
  color: var(--color-dark-teal);
}

.section-subheading {
  color: var(--color-teal);
}

/* === SERVICE ICONS === */
.fa-stack .fa-circle {
  color: var(--color-teal) !important;
}

/* === PORTFOLIO HOVER === */
.portfolio-item .portfolio-hover {
  background: rgba(155, 138, 95, 0.9);
}

/* === TIMELINE === */
.timeline > li .timeline-image {
  background-color: var(--color-teal);
}

.timeline > li.timeline-inverted > .timeline-panel {
  background-color: #ffffff;
}

/* === FOOTER === */
.footer {
  background-color: var(--color-dark-teal) !important;
  color: #ffffff;
  padding: 3rem 0 1rem 0;
}

.footer h4 {
  color: var(--color-accent);
}

.footer .social-buttons i {
  color: #ffffff;
}

.footer .social-buttons i:hover {
  color: var(--color-accent);
}

/* === LOGO STYLES === */
.logo-container {
  display: flex;
  align-items: center;
}

.logo-triangle {
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 21px solid var(--color-teal);
  margin-right: 0.5rem;
}

.logo-text {
  color: var(--color-accent);
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1;
}

.logo-subtext {
  font-size: 0.4rem;
  font-weight: 400;
  letter-spacing: 2px;
  display: block;
  margin-top: -2px;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .masthead .masthead-heading {
    font-size: 2.5rem;
  }
  
  .masthead .masthead-subheading {
    font-size: 1.25rem;
  }
}

/* === TEXT COLOR OVERRIDES === */
/* Soften the harsh black text throughout the site */
h1, h2, h3, h4, h5, h6, p, .section-heading {
  color: #3a3a3a !important;
}

.section-subheading {
  color: #666666 !important;
}

/* Override Bootstrap dark colors */
.text-dark, .alert-dark {
  color: #3a3a3a !important;
}

.alert-dark .alert-link {
  color: #2a2a2a !important;
}

.page-section {
  padding: 7rem 0;
}