/**
 * Capital City Garrison — overrides on top of the exported Octaskin / Materialize bundle.
 */

:root {
  --ccg-bg-deep: #0d1117;
  --ccg-bg-panel: #161b22;
  --ccg-accent: #c41e3a;
  --ccg-accent-soft: rgba(196, 30, 58, 0.12);
  --ccg-text: #1a1a1a;
  --ccg-muted: #5c5c5c;
  --ccg-radius: 12px;
  --ccg-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Raleway", "Inter", system-ui, -apple-system, Segoe UI, sans-serif;
  color: var(--ccg-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.lt-title,
.lt-slider-title,
h1, h2, h3 {
  font-family: "Roboto Slab", "Georgia", serif;
  letter-spacing: 0.02em;
}

#lt-navigation nav {
  background: rgba(13, 17, 23, 0.92) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
}

#lt-navigation nav .nav-wrapper a {
  transition: color 0.2s ease, opacity 0.2s ease;
}

/*
 * Theme JS toggles .lt-no-background on scroll; Octaskin swaps active link red shades.
 * Lock active item to brand red so it never darkens or shifts when you scroll.
 */
#lt-navigation nav ul.right.hide-on-med-and-down li > a {
  color: rgba(255, 255, 255, 0.88) !important;
}

#lt-navigation nav ul.right.hide-on-med-and-down li.active > a {
  color: var(--ccg-accent) !important;
  font-weight: 700;
  opacity: 1;
}

/* Desktop: hover — inactive links lighten; active stays brand red */
#lt-navigation nav ul.right.hide-on-med-and-down li:not(.active) > a:hover {
  color: #fff !important;
  opacity: 1;
}

#lt-navigation nav ul.right.hide-on-med-and-down li.active > a:hover {
  color: var(--ccg-accent) !important;
  opacity: 1;
}

/* Mobile drawer: dark panel, high contrast links, sits above page chrome */
#lt-navigation nav ul.side-nav,
#mobile-menu.side-nav {
  background-color: #161b22 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 8px 0 32px rgba(0, 0, 0, 0.35) !important;
  z-index: 1000002 !important;
  -webkit-overflow-scrolling: touch;
}

#lt-navigation nav ul.side-nav li > a,
#mobile-menu.side-nav li > a {
  color: #e6edf3 !important;
  font-weight: 600;
}

#lt-navigation nav ul.side-nav li.active {
  background-color: rgba(196, 30, 58, 0.2) !important;
}

#lt-navigation nav ul.side-nav li.active > a {
  color: var(--ccg-accent) !important;
}

#lt-navigation nav ul.side-nav li:not(.active) > a:hover,
#lt-navigation nav ul.side-nav li:not(.active) > a:focus {
  color: #fff !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
}

#lt-navigation nav ul.side-nav li.active > a:hover,
#lt-navigation nav ul.side-nav li.active > a:focus {
  color: var(--ccg-accent) !important;
  background-color: rgba(196, 30, 58, 0.22) !important;
}

#lt-navigation nav .button-collapse i {
  color: #fff;
}

.primary-color-background {
  background-color: var(--ccg-accent) !important;
}

.btn-large.primary-color-background:hover {
  filter: brightness(1.08);
}

#lt-feature {
  background: linear-gradient(180deg, #fafafa 0%, #f0f2f5 100%);
}

#lt-feature .flow-text {
  color: var(--ccg-muted);
  max-width: 52rem;
  margin-left: auto;
  margin-right: auto;
}

#lt-utility {
  background: #fff;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

#lt-extension {
  background: var(--ccg-bg-deep);
  color: #e6edf3;
}

#lt-extension .lt-title {
  color: #f0f6fc;
}

#lt-extension .lt-testimonial-content span {
  color: #c9d1d9;
  line-height: 1.65;
}

#lt-extension .lt-testimonial-author-name {
  color: #f0f6fc;
  font-weight: 600;
}

#lt-extension .lt-testimonial-author-position {
  color: #8b949e;
}

.lt-owl-carousel .owl-dots .owl-dot span {
  background: rgba(255, 255, 255, 0.35);
}

.lt-owl-carousel .owl-dots .owl-dot.active span {
  background: var(--ccg-accent);
}

#lt-copyright {
  background: var(--ccg-bg-panel) !important;
  color: #8b949e;
  font-size: 0.9rem;
  line-height: 1.55;
}

#lt-copyright .lt-col > div {
  max-width: 56rem;
  margin: 0 auto;
}

.card-panel.grey.lighten-5 {
  border-radius: var(--ccg-radius);
  box-shadow: var(--ccg-shadow) !important;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.collapsible {
  border: none;
  box-shadow: var(--ccg-shadow);
  border-radius: var(--ccg-radius);
  overflow: hidden;
}

.collapsible-header {
  background: #fff !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.collapsible-header i {
  color: var(--ccg-accent);
}

.parallax-container {
  border-radius: 0;
}

iframe[src*="google.com/maps"] {
  max-width: 100%;
  border: 0;
  border-radius: var(--ccg-radius);
  box-shadow: var(--ccg-shadow);
}

@media (max-width: 600px) {
  .lt-slider-title {
    font-size: 1.75rem !important;
  }
}
