:root {
  --brand:         #84A98C;
  --brand-hover:   #6b9077;
  --brand-soft:    #eef2ef;
  --brand-text-on: #2f3a33;

  --bs-body-font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --bs-brand-font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --bs-body-bg: #ffffff;
  --bs-body-color: #3f4a45;

  --bs-primary: var(--brand);
  --bs-primary-rgb: 132, 169, 140;
  --bs-link-color: var(--brand);
  --bs-link-hover-color: var(--brand-hover);

  --bs-border-radius: 0.5rem;
  --bs-border-radius-lg: 0.75rem;
  --bs-border-radius-xl: 1rem;

  --bg-alt:     #f7f9f8;
  --border-c:   #e3e8e5;
  --text-muted: #7c8a83;

  --nav-height: 68px;
  --section-py: 1.5rem;
}

@media (max-width: 991.98px) {
  :root { --section-py: 4rem; }
}

.brand-color {
  color: var(--brand) !important
}

.muted-text { color: var(--text-muted) !important; }

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-color: var(--brand-text-on);
  --bs-btn-hover-bg: #CAD2C5;
  --bs-btn-hover-border-color: #CAD2C5;
  --bs-btn-active-color: var(--brand-text-on);
  --bs-btn-active-bg: #CAD2C5;
  --bs-btn-active-border-color: #CAD2C5;
  --bs-btn-focus-shadow-rgb: 132, 169, 140;
}

.btn-outline-secondary {
  --bs-btn-color: var(--bs-body-color);
  --bs-btn-border-color: var(--border-c);
  --bs-btn-hover-color: var(--bs-body-color);
  --bs-btn-hover-bg: var(--bg-alt);
  --bs-btn-hover-border-color: #d1d9d5;
  --bs-btn-active-color: var(--bs-body-color);
  --bs-btn-active-bg: var(--bg-alt);
  --bs-btn-active-border-color: #d1d9d5;
}

.btn-lg { padding: 0.75rem 1.75rem; }

.btn { border-radius: 10px; font-weight: 500; }

.text-brand { color: var(--brand) !important; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--nav-height);
}

body {
  font-size: 15px;
  line-height: 1.65;
  overflow-x: hidden;
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}

.site-section {
  padding: var(--section-py) 0;
}

.bg-alt {
  background-color: var(--bg-alt);
}

.section-header {
  text-align: center;
  max-width: 620px;
  margin: 0 auto 4rem;
}

.section-badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--brand-hover);
  background: none;
  border: none;
  padding: 0;
}

.section-title {
  font-size: clamp(1.75rem, 3vw, 2.375rem);
  font-weight: 700;
  color: #212925;
  line-height: 1.2;
  letter-spacing: -0.02em;
  margin-bottom: 1rem;
}

.section-subtitle {
  font-size: 1.0625rem;
  color: var(--text-muted);
  line-height: 1.7;
}

.site-nav {
  height: var(--nav-height);
  background: #ffffff;
  border-bottom: 1px solid var(--border-c);
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.site-nav.scrolled {
  box-shadow: 0 2px 20px rgba(20, 30, 25, 0.08);
}

#mainNav:not(.scrolled) {
  background: transparent;
  border-bottom-color: transparent;
}

.navbar-brand {
  font-family: var(--bs-brand-font-family);
  font-size: 1.125rem;
  font-weight: 700;
  color: #212925;
}
.navbar-brand i { color: var(--brand); font-size: 1.3rem; }

.navbar-nav .nav-link {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--text-muted);
  padding: 0.5rem 1rem;
  border-radius: var(--bs-border-radius);
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
  color: #212925;
  background: var(--bg-alt);
}

@media (min-width: 992px) {
  .navbar-nav.mx-lg-auto {
    display: flex;
    flex: 1 1 auto;
    justify-content: space-evenly;
    max-width: 440px;
  }
}

@media (max-width: 991.98px) {
  .navbar-collapse.show,
  .navbar-collapse.collapsing {
    background: var(--bg-alt);
    border: 1px solid var(--border-c);
    border-radius: var(--bs-border-radius-lg);
    margin-top: 0.75rem;
    padding: 0.5rem 1rem;
    box-shadow: 0 8px 24px rgba(20, 30, 25, 0.08);
  }

  #mainNav:not(.scrolled) .navbar-collapse.show,
  #mainNav:not(.scrolled) .navbar-collapse.collapsing {
    background: #101613;
    border-color: rgba(255, 255, 255, 0.12);
  }
}

.hero-section {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 100vh;
  padding-top: calc(var(--nav-height) + 4rem);
  padding-bottom: 4rem;
  background: radial-gradient(ellipse 80% 60% at 50% 30%, #1c2a23 0%, #101613 60%, #0b0f0d 100%);
  overflow: hidden;
}

.hero-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 70% at 50% 40%, transparent 40%, rgba(0, 0, 0, 0.45) 100%);
  pointer-events: none;
}
.hero-section .container { width: 100%; position: relative; z-index: 1; }

#mainNav:not(.scrolled) .navbar-brand {
  color: #ffffff !important;
}

#mainNav:not(.scrolled) .navbar-brand .text-body-secondary {
  color: rgba(255, 255, 255, 0.6) !important;
}
#mainNav:not(.scrolled) .navbar-nav .nav-link {
  color: rgba(255, 255, 255, 0.8);
}
#mainNav:not(.scrolled) .navbar-nav .nav-link:hover,
#mainNav:not(.scrolled) .navbar-nav .nav-link.active {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.12);
}
#mainNav:not(.scrolled) .btn-outline-secondary {
  --bs-btn-color: #fff;
  --bs-btn-border-color: rgba(255, 255, 255, 0.35);
  --bs-btn-hover-color: #212925;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
}

#mainNav:not(.scrolled) .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.navbar-toggler {
  margin: 0;
  border: none;
}

.hero-title {
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: #f3f6f4;
  margin-bottom: 1.375rem;
}
.hero-section .section-badge { color: #bfe3cd; }
.hero-section .text-brand { color: #bfe3cd !important; }
.hero-section .btn-outline-secondary {
  --bs-btn-color: #fff;
  --bs-btn-border-color: rgba(255, 255, 255, 0.35);
  --bs-btn-hover-color: #212925;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
}

.hero-title-flip {
  display: block;
  perspective: 800px;
}
.hero-title-flip-inner {
  position: relative;
  display: inline-block;
  width: 12ch;
  text-align: left;
  transform-style: preserve-3d;
  animation: heroTitleFlip 5s ease-in-out infinite;
}
.hero-title-flip-face {
  font-family: var(--bs-brand-font-family);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.hero-title-flip-front {
  display: inline-block;
}
.hero-title-flip-back {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  transform: rotateX(180deg);
}
@keyframes heroTitleFlip {
  0%, 40%  { transform: rotateX(0deg); }
  50%, 90% { transform: rotateX(180deg); }
  100%     { transform: rotateX(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-title-flip-inner { animation: none; }
}

.hero-subtitle {
  font-size: 1.0625rem;
  color: #92a19b;
  line-height: 1.75;
  max-width: 480px;
  margin-bottom: 2.25rem;
}

.hero-trial-link {
  display: inline-flex;
  align-items: center;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--brand-hover);
  text-decoration: none;
}
.hero-trial-link i { font-size: 1rem; }
.hero-trial-link:hover { color: var(--brand-hover); text-decoration: none; }
.hero-trial-link .text-body-secondary { font-weight: 500; }
.hero-section .hero-trial-link { color: #bfe3cd; }
.hero-section .hero-trial-link:hover { color: #bfe3cd; }
.hero-section .text-body-secondary { color: #92a19b !important; }

.pricing-trial-link {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 0.5rem;
  font-size: 0.8125rem;
  line-height: 1.5;
}

.hero-stats {
  padding-top: 2rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.hero-stat-value {
  font-size: 1.625rem;
  font-weight: 700;
  color: #f3f6f4;
  line-height: 1;
  margin-bottom: 0.25rem;
}
.hero-stat-label {
  font-size: 0.75rem;
  color: #92a19b;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

@media (max-width: 575.98px) {
  .hero-section .btn-lg {
    width: 75%;
    align-self: center;
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
  }

  .hero-section .hero-trial-link {
    display: flex;
    justify-content: center;
    width: 100%;
  }
}

.app-mockup {
  background: #ffffff;
  border: 1px solid var(--border-c);
  border-radius: var(--bs-border-radius-xl);
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(20, 30, 25, 0.12);
}

.mockup-titlebar {
  background: var(--bg-alt);
  border-bottom: 1px solid var(--border-c);
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.mockup-dots { display: flex; gap: 0.375rem; }
.mockup-dot { width: 10px; height: 10px; border-radius: 50%; }
.mockup-dot.dot-red    { background: #ef4444; }
.mockup-dot.dot-yellow { background: #f59e0b; }
.mockup-dot.dot-green  { background: #10b981; }

.mockup-tab {
  font-size: 0.75rem;
  color: var(--text-muted);
  background: #ffffff;
  border: 1px solid var(--border-c);
  border-radius: var(--bs-border-radius-sm, 0.25rem);
  padding: 0.2rem 0.75rem;
}

.mockup-topnav {
  background: #212925;
  padding: 0.5rem 1rem;
}
.mockup-user-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.7rem;
  font-weight: 600;
  color: #dfe4e1;
}
.mockup-user-chip i:first-child { font-size: 0.9rem; }
.mockup-user-chip i:last-child { font-size: 0.6rem; opacity: 0.7; }

.mockup-main {
  display: grid;
  grid-template-columns: 168px 1fr;
  min-height: 340px;
}
@media (max-width: 767.98px) {
  .mockup-main { grid-template-columns: 1fr; }
}

.mockup-sidebar {
  background: var(--bg-alt);
  border-right: 1px solid var(--border-c);
  padding: 0.75rem 0;
  overflow: hidden;
}
.mockup-nav-section {
  font-size: 0.575rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  padding: 0.625rem 1rem 0.25rem;
  opacity: 0.7;
}
.mockup-nav-item {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.4rem 1rem;
  font-size: 0.75rem;
  color: var(--text-muted);
  white-space: nowrap;
}
.mockup-nav-item.active {
  background: #ffffff;
  color: #212925;
  border-left: 2px solid var(--brand);
  font-weight: 600;
}
.mockup-nav-item i { font-size: 0.875rem; flex-shrink: 0; }

.mockup-content { padding: 1rem; overflow-x: auto; }

.mockup-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.mockup-page-title { font-size: 0.8125rem; font-weight: 600; color: #212925; }
.mockup-btn-mini {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem;
  padding: 0.2rem 0.625rem;
  background: var(--brand-soft);
  border: 1px solid rgba(132, 169, 140, 0.35);
  border-radius: var(--bs-border-radius-sm, 0.25rem);
  color: var(--brand-hover);
}

.mockup-stat-row {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.mockup-stat-pill {
  flex: 1;
  background: var(--bg-alt);
  border: 1px solid var(--border-c);
  border-radius: var(--bs-border-radius-sm, 0.25rem);
  padding: 0.4rem 0.5rem;
  font-size: 0.625rem;
  color: var(--text-muted);
  text-align: center;
}
.msp-count { display: block; font-size: 0.875rem; font-weight: 700; color: #212925; }

.mockup-table { width: 100%; min-width: 420px; font-size: 0.75rem; border-collapse: collapse; }
.mockup-table thead th {
  text-align: left;
  padding: 0.375rem 0.5rem;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border-c);
}
.mockup-table tbody tr { border-bottom: 1px solid var(--border-c); }
.mockup-table tbody tr:last-child { border-bottom: none; }
.mockup-table tbody td { padding: 0.5rem; color: #4b5751; }
.mockup-table tbody td.fw-semibold {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
}

.mbadge {
  display: inline-block;
  font-size: 0.6rem;
  font-weight: 600;
  padding: 0.175rem 0.5rem;
  border-radius: 100px;
  white-space: nowrap;
}
.mbadge-open     { background: rgba(59, 130, 246, 0.12);  color: #2563eb; }
.mbadge-progress { background: var(--brand-soft);         color: var(--brand-hover); }
.mbadge-done     { background: rgba(16, 185, 129, 0.12);  color: #0f9d75; }
.mbadge-pending  { background: rgba(107, 114, 128, 0.12); color: #6b7280; }

#features,
#how-it-works,
#pricing {
  display: flex;
  align-items: center;
  min-height: 100vh;
}
#features > .container,
#how-it-works > .container,
#pricing > .container {
  width: 100%;
}

.feature-card {
  position: relative;
  background: #ffffff;
  border: 1px solid var(--border-c);
  border-radius: 0.625rem;
  padding: 1.5rem;
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.feature-card:hover {
  border-color: #c9d1cc;
  box-shadow: 0 4px 14px rgba(20, 30, 25, 0.06);
}

.feature-icon {
  position: relative;
  z-index: 1;
  width: 40px; height: 40px;
  background: var(--brand-soft);
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: var(--brand-hover);
  margin-bottom: 1rem;
}

#features .col:nth-child(2) .feature-icon { background: rgba(59, 130, 246, 0.12); color: #2563eb; }
#features .col:nth-child(3) .feature-icon { background: rgba(245, 158, 11, 0.14); color: #b45309; }
#features .col:nth-child(4) .feature-icon { background: rgba(16, 185, 129, 0.12); color: #0f9d75; }
#features .col:nth-child(5) .feature-icon { background: rgba(139, 92, 246, 0.12); color: #7c3aed; }
#features .col:nth-child(6) .feature-icon { background: rgba(100, 116, 139, 0.14); color: #475569; }

.feature-title, .feature-body { position: relative; z-index: 1; }

.feature-icon-bg {
  display: none;
}

.feature-title { font-size: 1rem; font-weight: 700; color: #212925; margin-bottom: 0.4rem; }
.feature-body  { font-size: 0.875rem; color: var(--text-muted); line-height: 1.6; margin: 0; }

#how-it-works {
  position: relative;
  background: radial-gradient(ellipse 80% 60% at 50% 35%, #1c2a23 0%, #101613 60%, #0b0f0d 100%);
  overflow: hidden;
}

#how-it-works::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 70% at 50% 50%, transparent 40%, rgba(0, 0, 0, 0.45) 100%);
  pointer-events: none;
}
#how-it-works .section-badge { color: #bfe3cd; }
#how-it-works .section-title { color: #f3f6f4; }
#how-it-works .section-subtitle { color: #92a19b; }
#how-it-works .btn-outline-secondary {
  --bs-btn-color: #fff;
  --bs-btn-border-color: rgba(255, 255, 255, 0.35);
  --bs-btn-hover-color: #212925;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
}

.video-placeholder-wrap {
  position: relative;
  max-width: 860px;
  margin: 0 auto;
  z-index: 1;
}

.video-placeholder {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 16 / 9;
  padding: 0;
  border: 1px solid var(--border-c);
  border-radius: var(--bs-border-radius-xl);
  background: linear-gradient(160deg, var(--brand-soft) 0%, var(--bg-alt) 60%, #ffffff 100%);
  box-shadow: 0 24px 64px rgba(20, 30, 25, 0.12);
  cursor: pointer;
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}
.video-placeholder:hover { box-shadow: 0 28px 72px rgba(20, 30, 25, 0.16); }

#how-it-works .video-placeholder {
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 40px 90px rgba(0, 0, 0, 0.55), 0 0 140px rgba(132, 169, 140, 0.28);
}
#how-it-works .video-placeholder:hover {
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1), 0 44px 100px rgba(0, 0, 0, 0.6), 0 0 170px rgba(132, 169, 140, 0.4);
}

.video-placeholder-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.video-placeholder-play {
  width: 76px; height: 76px;
  border-radius: 50%;
  background: var(--brand);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  box-shadow: 0 8px 24px rgba(132, 169, 140, 0.45);
  transition: transform 0.2s ease;
}
.video-placeholder:hover .video-placeholder-play { transform: scale(1.06); }
.video-placeholder-play i { margin-left: 3px; }

.video-placeholder-soon {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}
#how-it-works .video-placeholder-soon { color: #92a19b; }

.video-placeholder-caption {
  position: absolute;
  left: 1.25rem;
  bottom: 1.25rem;
  display: inline-flex;
  align-items: center;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #212925;
  background: #ffffff;
  border: 1px solid var(--border-c);
  border-radius: 100px;
  padding: 0.3rem 0.9rem;
}

.video-cta {
  max-width: 860px;
  margin: 1.75rem auto 0;
  text-align: center;
  position: relative;
  z-index: 1;
}
.video-cta-text {
  font-size: 0.9375rem;
  color: var(--text-muted);
  max-width: 440px;
  margin: 0 auto 1.125rem;
  line-height: 1.6;
}
#how-it-works .video-cta-text { color: #92a19b; }

#pricing .section-header { margin-bottom: 2rem; }

.pricing-grid { max-width: 820px; margin: 0 auto; }

.pricing-card {
  background: #ffffff;
  border: 1px solid var(--border-c);
  border-radius: 0.625rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.pricing-card:hover {
  border-color: #c9d1cc;
  box-shadow: 0 4px 14px rgba(20, 30, 25, 0.06);
}
.pricing-card.featured {
  border-color: var(--brand);
  box-shadow: 0 0 0 1px var(--brand);
}
.pricing-card.featured:hover {
  box-shadow: 0 0 0 1px var(--brand), 0 4px 14px rgba(20, 30, 25, 0.06);
}

.pricing-badge-tag {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #fff;
  background: var(--brand);
  padding: 0.25rem 0.7rem;
  border-radius: 100px;
  margin-bottom: 0.875rem;
  align-self: flex-start;
}
.pricing-badge-tag.pricing-badge-muted {
  background: var(--bg-alt);
  color: var(--text-muted);
}

.pricing-plan-name { font-size: 1.25rem; font-weight: 700; color: #212925; margin-bottom: 0.25rem; }

.pricing-price-row {
  display: flex;
  align-items: flex-end;
  gap: 0.25rem;
  margin-bottom: 0.5rem;
  min-height: 2.75rem;
}
.pricing-price { font-size: 2.5rem; font-weight: 700; color: #212925; line-height: 1; }
.pricing-price-text { font-size: 1.75rem; padding-bottom: 0.25rem; }
.pricing-currency { font-size: 1.25rem; font-weight: 600; color: var(--text-muted); line-height: 1.5; }
.pricing-period {
  font-size: 0.8125rem;
  color: var(--text-muted);
  padding-bottom: 0.125rem;
  line-height: 1.3;
}
.pricing-period small { font-size: 0.75rem; }

.pricing-desc {
  font-size: 0.875rem;
  color: var(--text-muted);
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border-c);
  margin-bottom: 1rem;
}

.pricing-list { list-style: none; flex: 1; margin: 0 0 1.25rem; padding: 0; }
.pricing-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: 0.875rem;
  color: #4b5751;
  padding: 0.25rem 0;
}
.pricing-list li i {
  color: #0f9d75;
  font-size: 0.9375rem;
  flex-shrink: 0;
  margin-top: 0.2em;
}

.cta-section {
  padding: 5.5rem 0;
  background: var(--brand-soft);
  border-top: 1px solid var(--border-c);
  border-bottom: 1px solid var(--border-c);
}
.cta-section .container { max-width: 660px; }

.cta-title {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: #212925;
  letter-spacing: -0.02em;
  margin-bottom: 1rem;
}
.cta-sub { font-size: 1.0625rem; color: var(--text-muted); margin-bottom: 2.25rem; line-height: 1.7; }

.cta-note {
  font-size: 0.875rem;
  color: var(--text-muted);
  max-width: 460px;
  margin: 0 auto 2rem;
  line-height: 1.6;
}

.contact-footer-group {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.contact-footer-group #contact {
  flex: 1;
  display: flex;
  align-items: center;
}
.contact-footer-group #contact .container { width: 100%; }

.contact-info-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #212925;
  margin-bottom: 1rem;
  letter-spacing: -0.02em;
}
.contact-info-text { font-size: 0.9375rem; color: var(--text-muted); line-height: 1.7; margin-bottom: 2.25rem; }

.contact-detail-row {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  margin-bottom: 1rem;
  font-size: 0.9rem;
  color: #4b5751;
}
.contact-detail-icon {
  width: 38px; height: 38px;
  background: var(--brand-soft);
  border: 1px solid rgba(132, 169, 140, 0.3);
  border-radius: var(--bs-border-radius);
  display: flex; align-items: center; justify-content: center;
  color: var(--brand-hover);
  font-size: 1rem;
  flex-shrink: 0;
}

.contact-form-card {
  background: #ffffff;
  border: 1px solid var(--border-c);
  border-radius: var(--bs-border-radius-xl);
  padding: 2.25rem;
  box-shadow: 0 8px 28px rgba(20, 30, 25, 0.06);
}

.site-footer {
  background: radial-gradient(ellipse 80% 60% at 50% 0%, #1c2a23 0%, #101613 60%, #0b0f0d 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 4rem 0 2rem;
}

.footer-brand-logo {
  font-family: var(--bs-brand-font-family);
  font-size: 1.125rem;
  font-weight: 700;
  color: #f3f6f4;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.875rem;
}
.footer-brand-logo i { color: var(--brand); }
.site-footer .text-brand { color: #bfe3cd !important; }
.footer-brand-text { font-size: 0.8125rem; color: #92a19b; line-height: 1.65; max-width: 260px; }

.footer-grid h4 {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: #6f7d76;
  margin-bottom: 1.375rem;
}
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 0.625rem; }
.footer-links a { font-size: 0.875rem; color: #c3cdc8; }
.footer-links a:hover { color: #ffffff; }

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 1.5rem;
  margin-top: 1rem;
  text-align: center;
}
.footer-copy { font-size: 0.8125rem; color: #92a19b; }

.modal-content {
  border: 1px solid var(--border-c);
  border-radius: var(--bs-border-radius-xl);
}
.modal-header { align-items: flex-start; }
.modal-header .modal-title { font-size: 1.125rem; font-weight: 700; color: #212925; }
.modal-header .modal-subtitle { font-size: 0.8125rem; color: var(--text-muted); margin-top: 0.2rem; }

.modal-footer-text {
  text-align: center;
  font-size: 0.8125rem;
  color: var(--text-muted);
  margin-top: 1rem;
}
.modal-footer-text a { color: var(--brand); cursor: pointer; }

.text-body-secondary { color: var(--text-muted) !important; }