:root {
    --bs-primary: #E22522;
    --bs-primary-hover: #c62828;
    --light-blue: #e0f2fa;
  }
  a {
    color: var(--bs-primary);
  }
  
  a:hover {
    color: var(--bs-primary-hover);
  }

  .nav-link {
    color: var(--bs-primary);
  }
  
  .nav-link:focus, .nav-link:hover {
    color: var(--bs-primary-hover);
  }  
  
    .btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
  }
  
  .btn-primary:hover, .btn-primary:active, .btn-primary:focus {
    background-color: var(--bs-primary-hover) !important;
    border-color: var(--bs-primary-hover) !important;
    color: #fff;
  }
  
  
  html {
    scroll-behavior: smooth;
  }
  
  body {
    font-family: "Roboto Slab", serif;
    font-optical-sizing: auto;
  }
  
  a {
    color: var(--bs-primary);
  }
  
  a:hover,
  .nav-pills {
    color: var(--bs-primary-hover);
  }
  
  .text-primary {
    color: var(--bs-primary) !important;
  }
  
  .text-secondary {
    color: var(--bs-secondary) !important;
  }
  
  .bg-secondary {
    background-color: var(--bs-secondary) !important;
  }
  
  .title-link a {
    color: #1d2124;
    text-decoration: none;
    transition: color 0.2s ease, text-decoration 0.2s ease;
  }
  
  .title-link a:hover {
    color: #343a40;
    text-decoration: none;
  }
  
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .h1,
  .h2,
  .h3,
  .h4,
  .h5,
  .h6 {
    font-family: "Roboto Slab", serif;
    font-optical-sizing: auto;
    font-weight: bold;
  }
  
  .hero-image {
    background-image: url("../images/moon-lake-small.webp");
    background-size: cover;
    background-position: center bottom;
    background-attachment: fixed;
    height: 500px;
  }
  
  @media (min-width: 768px) {
    .hero-image {
      background-image: url("../images/moon-lake-1920x1200.webp");
    }
  }
  
  @media (max-width: 767.98px) {
    .hero-image {
      background-attachment: scroll;
      background-position: center center;
    }
  }
  
  
  .hero-box {
    display: inline-block;
    background: rgba(52, 58, 64, 1);
    border-left: 4px solid var(--bs-primary);
  }
  
  .btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
  }
  
  .btn-primary:hover {
    background-color: var(--bs-primary-hover);
    border-color: var(--bs-primary-hover);
  }
  
  .nav-pills .nav-link.active {
    background-color: var(--bs-primary);
    color: #fff !important;
    border-radius: 0.25rem;
  }

  .custom-container {max-width: 950px;} 

   .meridian-header {border-left: 4px solid var(--bs-primary);}
    
   .scroll-mt {scroll-margin-top:1.5rem;}

  .community-link {
    text-decoration: none !important;
    color: inherit;
  }
  
  .community-link:hover {
    text-decoration: none !important;
  }
  
  /* Icon stays white, no underline */
  .community-icon {
    color: #fff !important;
    text-decoration: none !important;
  }
  
  .community-link:hover .community-icon {
    color: #fff !important;
    text-decoration: none !important;
  }
  
  /* Default text style */
  .community-name {
    color: #1d2124;
    text-decoration: underline;
    transition: color 0.2s ease, text-decoration 0.2s ease;
  }
  
  /* Hover: darker gray, no underline */
  .community-link:hover .community-name {
    color: #343a40;
    text-decoration: none;
  }
  
  .community-guide-link {
    text-decoration: none;
    color: var(--bs-secondary); /* sets base color */
  }
  
  .community-guide-link:hover {
    text-decoration: none;
    color: #343a40; /* changes text color on hover */
  }
  
  .community-guide-link-icon {
    color: var(--bs-secondary); /* locks icon color */
  }
  
  .community-guide-link:hover .community-guide-link-icon {
    color: var(--bs-secondary); /* prevents icon color from changing on hover */
  }
  
  .community-guide-link-text {
    text-decoration: underline;
  }
  .community-guide-link:hover .community-guide-link-text {
    text-decoration: none;
  }

.three-cols {
        column-count: 1; /* default for mobile */
      }
      
      @media (min-width: 768px) {
        /* md breakpoint */
        .three-cols {
          column-count: 2;
        }
      }
      
      @media (min-width: 992px) {
        /* lg breakpoint */
        .three-cols {
          column-count: 3;
        }
      }
      .spin {
        display: inline-block;
        animation: spin 1s linear infinite;
      }
      @keyframes spin {
        100% {
          transform: rotate(360deg);
        }
      }

 .header-icon {font-size: 1.125em;}

 .bullet-icon {font-size: 1rem;}

 .spacer-width {width: .95rem;}

 .accordion-button:not(.collapsed) {
    color: #495057; 
    background-color: #f8f9fa;
}
  
  .notice-link {
    text-decoration: none;
    color: var(--bs-secondary); /* base text color */
  }
  
  .notice-link:hover {
    color: #343a40; /* darker text on hover */
    text-decoration: none;
  }
  
  .notice-icon {
    color: #fff !important; /* locks icon as white */
  }
  
  .notice-link:hover .notice-icon {
    color: #fff !important; /* keeps icon white on hover */
  }
  
  .notice-link-text {
    text-decoration: underline;
  }
  
  .notice-link:hover .notice-link-text {
    text-decoration: none;
  }
  
  .link-dark-underline {
    color: #1d2124;
    text-decoration: underline;
    transition: color 0.2s ease, text-decoration 0.2s ease;
  }
  
  .link-dark-underline:hover {
    color: #343a40;
    text-decoration: none;
  }
  
  .bg-subtle-light-gradient {
    background: linear-gradient(
      180deg,
      #f5f8fb 0%,
      #fafbfc 10%,
      #fafbfc 90%,
      #f1f5f9 100%
    );
  }
  
  .aspect-16x9 {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
  }