/* Theme + Bootstrap overrides (Bootstrap loaded before this file) */
:root,
[data-bs-theme="dark"] {
  --accent: #60a5fa;
  --bg-deep: #0b111a;
  --bs-primary: #60a5fa;
  --bs-primary-rgb: 96, 165, 250;
  --bs-body-bg: var(--bg-deep);
  --bs-body-color: #e6eef8;
  --bs-secondary-color: #9aa4b2;
  --bs-link-color: var(--accent);
  --bs-link-hover-color: #93c5fd;
}

body {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  scroll-behavior: smooth;
}

/* Navbar */
.site-navbar {
  --bs-navbar-color: #e6eef8;
  --bs-navbar-hover-color: var(--accent);
  --bs-navbar-active-color: var(--accent);
  --bs-navbar-toggler-border-color: rgba(255, 255, 255, 0.45);
  background: rgba(11, 17, 26, 0.95) !important;
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  z-index: 1050;
}

.site-navbar .navbar-brand,
.site-navbar .nav-link {
  color: var(--bs-navbar-color) !important;
}

.site-navbar .nav-link:hover,
.site-navbar .nav-link:focus {
  color: var(--bs-navbar-hover-color) !important;
}

.site-navbar .navbar-toggler.site-toggler {
  position: relative;
  z-index: 1051;
  border: 1px solid var(--bs-navbar-toggler-border-color);
  background-color: rgba(255, 255, 255, 0.08);
  padding: 0;
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.site-navbar .navbar-toggler.site-toggler:focus {
  box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.35);
}

/* Custom burger → cross (Bootstrap sets aria-expanded on the button) */
.site-toggler-bars {
  position: relative;
  width: 22px;
  height: 16px;
  display: block;
}

.site-toggler-bar {
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  border-radius: 1px;
  background: rgba(255, 255, 255, 0.95);
  transition: transform 0.3s ease, opacity 0.25s ease, top 0.3s ease;
  transform-origin: center;
}

.site-toggler-bar:nth-child(1) {
  top: 0;
}

.site-toggler-bar:nth-child(2) {
  top: 7px;
}

.site-toggler-bar:nth-child(3) {
  top: 14px;
}

.site-toggler[aria-expanded="true"] .site-toggler-bar:nth-child(1) {
  top: 7px;
  transform: rotate(45deg);
}

.site-toggler[aria-expanded="true"] .site-toggler-bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.site-toggler[aria-expanded="true"] .site-toggler-bar:nth-child(3) {
  top: 7px;
  transform: rotate(-45deg);
}

/* Wide screens (navbar-expand-lg): hide burger — our inline-flex beat Bootstrap’s display:none */
@media (min-width: 992px) {
  .site-navbar .navbar-toggler.site-toggler {
    display: none !important;
  }
}

/* Sections */
.section h2 {
  color: var(--accent);
}

.section-alt {
  background: rgba(255, 255, 255, 0.02);
}

/* Hero: clear fixed navbar */
.hero {
  padding-top: 4.5rem;
}

@media (min-width: 992px) {
  .hero {
    padding-top: 5rem;
  }
}

.hero-kicker {
  letter-spacing: 0.12em;
}

/* Photo blocks — readable sizes per breakpoint */
.section-photo {
  width: 100%;
  max-width: 200px;
  aspect-ratio: 1;
  object-fit: cover;
}

@media (min-width: 576px) {
  .section-photo {
    max-width: 220px;
  }
}

@media (min-width: 768px) {
  .section-photo {
    max-width: 240px;
  }
}

@media (min-width: 992px) {
  .section-photo {
    max-width: 260px;
  }
}

/* Primary button: slight gradient (optional polish) */
.btn-primary {
  background: linear-gradient(90deg, #60a5fa, #7dd3fc);
  border: none;
  color: #052630;
  font-weight: 600;
}

.btn-primary:hover,
.btn-primary:focus {
  background: linear-gradient(90deg, #3b82f6, #60a5fa);
  color: #031820;
}

.btn-outline-light {
  font-weight: 600;
}