    :root{
      --section-gap: 2rem;
      --llc-ink:#12323a;
      --llc-forest:#163318;
      --llc-sand:#f6f3ea;
      --llc-line: rgba(18,50,58,.12);
      --llc-brown:#4b341f; /* NEW secondary */
    }

    body{
      color: var(--llc-ink);
      background: #fff;
    }

    /* Top bar */
    .topbar {
      border-bottom: 1px solid var(--llc-line);
      background: rgba(255,255,255,.9);
      backdrop-filter: blur(10px);
      position: sticky;
      top: 0;
      z-index: 1030;
    }
    .brand-lockup img{
      height: 60px;
      width: auto;
    }

    /* HERO VIDEO (SIMPLIFIED) */
    .hero{
      position: relative;
      min-height: 420px;
      display: flex;
      align-items: center;
      overflow: hidden;
    }

    .hero-video-wrap{
      position: absolute;
      inset: 0;
      z-index: 0;
    }

    .hero-video{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    /* Overlay ensures readability */
    .hero-overlay{
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(
          180deg,
          rgba(255,255,255,.85) 0%,
          rgba(255,255,255,.72) 45%,
          rgba(255,255,255,.55) 100%
        );
    }

    /* Content above video */
    .hero-content{
      position: relative;
      z-index: 2;
      padding-top: 4rem;
      padding-bottom: 4rem;
    }

    /* MOBILE OPTIMIZATION */
    @media (max-width: 576px){
      .hero{
        min-height: 320px;
      }

      .hero-content{
        padding-top: 2.25rem;
        padding-bottom: 2.25rem;
      }

      .hero h1.display-6{
        font-size: 1.9rem;
        line-height: 1.15;
      }

      .hero .lead{
        font-size: 1.05rem;
      }
    }

    /* Pills / badges */
    .pill {
      display: inline-flex;
      align-items: center;
      gap: .5rem;
      padding: .4rem .75rem;
      border: 1px solid var(--llc-line);
      border-radius: 999px;
      font-size: .95rem;
      background: rgba(255,255,255,.85);
    }
    .dot{
      width:10px;height:10px;border-radius:999px;background: var(--llc-forest);
      display:inline-block;
    }

    /* Choice cards */
    .choice-card{
      border: 1px solid var(--llc-line);
      border-radius: 18px;
      overflow: hidden;
      height: 100%;
      transition: transform .15s ease, box-shadow .15s ease;
      background: #fff;
    }
    .choice-card:hover{
      transform: translateY(-2px);
      box-shadow: 0 10px 25px rgba(0,0,0,.08);
    }

    .choice-media{
      position: relative;
      height: 170px;
      overflow: hidden;
      border-bottom: 1px solid var(--llc-line);
    }
    .choice-media img{
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transform: scale(1.02);
    }
    .choice-media::after{
      content:"";
      position:absolute;
      inset:0;
      background: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.18) 100%);
      pointer-events:none;
    }

    .choice-body{
      padding: 18px;
    }

    .choice-icon{
      width: 44px; height: 44px;
      border-radius: 14px;
      background: rgba(22,51,24,.10);
      display:flex; align-items:center; justify-content:center;
      font-size: 22px;
      flex: 0 0 auto;
    }

    .btn-llc{
      background: var(--llc-forest);
      border-color: var(--llc-forest);
    }
    .btn-llc:hover{
      background: #102512;
      border-color: #102512;
    }

    a { color: var(--llc-forest); }
    a:hover { color: #163f3f; }

    /* Header mobile fix (scoped only to the top bar) */
    @media (max-width: 576px){
      .topbar-inner{
        flex-direction: column;
        align-items: center !important;
      }

      .topbar-inner .brand-lockup{
        width: 100%;
        display: flex;
        justify-content: center;
      }

      .topbar-inner .brand-lockup img{
        max-width: 320px;
        width: 100%;
        height: auto;
      }

      .topbar-inner nav{
        width: 100%;
        display: flex;
        gap: .5rem;
      }

      .topbar-inner nav a{
        flex: 1;
        text-align: center;
        white-space: nowrap;
      }
    }

    /* TRUST BAR polish */
    .trustbar{
      border-top: 1px solid var(--llc-line);
      border-bottom: 1px solid var(--llc-line);
      background: #fff;
    }

    .trustbar .trust-copy{
      max-width: 56ch;
    }

    .trustbar .trust-badge-wrap{
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 1rem;
    }

    .trustbar .trust-badge{
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: .5rem;
      border: 1px solid var(--llc-line);
      border-radius: 14px;
      background: #fff;
    }

    .trustbar .trust-logo{
      max-height: 84px;
      width: auto;
      display: block;
    }

    @media (max-width: 768px){
      .trustbar .trust-copy{
        max-width: none;
        text-align: center;
      }

      .trustbar .trust-badge-wrap{
        justify-content: center;
      }

      .trustbar .trust-logo{
        max-height: 92px;
      }
    }

    /* FOOTER polish */
    .site-footer{
      border-top: 1px solid var(--llc-line);
      background: #fff;
    }

    .site-footer .footer-inner{
      padding-top: 1.25rem;
      padding-bottom: 1.25rem;
    }

    .site-footer .footer-links a{
      text-decoration: none;
    }

    .site-footer .footer-links a:hover{
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    @media (max-width: 576px){
      .site-footer .footer-inner{
        text-align: center;
      }

      .site-footer .footer-links{
        justify-content: center !important;
        flex-wrap: wrap;
        gap: .5rem 1rem;
      }

      .site-footer .footer-links .sep{
        display: none;
      }
    }

    /* Sponsors + Blog layout (consistent spacing below CTA) */
    .below-explore{
      margin-top: var(--section-gap); /* keeps spacing consistent with the CTA block */
    }
    
    .below-explore h2:first-child{
      margin-top: 0;
    }


    /* Blog card styling */
    .blog-card{
      border: 1px solid var(--llc-line);
      border-radius: 18px;
      background: #fff;
      padding: 18px;
    }
    .blog-item{
      border-top: 1px solid var(--llc-line);
      padding-top: .85rem;
      margin-top: .85rem;
    }
    .blog-item:first-child{
      border-top: 0;
      padding-top: 0;
      margin-top: 0;
    }
    .blog-kicker{
      font-size: .8rem;
      color: rgba(18,50,58,.65);
      text-transform: uppercase;
      letter-spacing: .04em;
    }

    /* Sponsors card styling (fills space better) */
    .sponsors-card{
      border: 1px solid var(--llc-line);
      border-radius: 18px;
      background: #fff;
      padding: 18px;
      height: 100%;
    }

    .sponsor-grid{
      margin-top: .75rem;
    }

    .sponsor-tile{
      border: 1px solid var(--llc-line);
      border-radius: 16px;
      background: #fff;
      padding: .9rem;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* Helps logos feel “full” without being huge */
    .sponsor-logo{
      max-height: 72px;
      width: auto;
      max-width: 100%;
      display: block;
      opacity: .98;
    }

    @media (max-width: 576px){
      .sponsor-logo{ max-height: 64px; }
    }

    .grayscale {
      filter: grayscale(100%);
      transition: filter 0.3s ease;
    }
    .grayscale:hover {
      filter: none;
    }
    
    .cta-block{
      margin-top: var(--section-gap);
      margin-bottom: var(--section-gap);
      background: var(--llc-sand);
      border: 1px solid var(--llc-line);
    }

    .below-explore{
      margin-top: 0; /* important: CTA already provides the gap */
    }
    
    /* NAVBAR */
.navbar-llc{
  border-bottom: 1px solid var(--llc-line);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
}

.navbar-llc .navbar-brand img{
  height: 56px;
  width: auto;
}

.navbar-llc .nav-link{
  font-weight: 600;
  color: var(--llc-ink);
}

.navbar-llc .nav-link:hover,
.navbar-llc .nav-link:focus{
  color: var(--llc-forest);
}

.navbar-llc .dropdown-menu{
  border: 1px solid var(--llc-line);
  border-radius: 14px;
  padding: .5rem;
}

.navbar-llc .dropdown-item{
  border-radius: 10px;
  font-weight: 600;
}

.navbar-llc .dropdown-item:hover{
  background: rgba(22,51,24,.08);
}

.btn-brown{
  background: var(--llc-brown);
  border-color: var(--llc-brown);
  color: #fff !important;
}
.btn-brown:hover{
  background: #3b2a19;
  border-color: #3b2a19;
}

/* Social icon buttons */
.social-btn{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid var(--llc-line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--llc-forest);
  background: #fff;
  text-decoration: none;
}
.social-btn:hover{
  color: #fff;
  background: var(--llc-forest);
  border-color: var(--llc-forest);
}
/* --- NAV FIXES (prevents weird wrapping) --- */
.navbar-llc .navbar-brand{
  flex: 0 0 auto;
  max-width: 360px;         /* keeps logo from eating the whole row */
}

.navbar-llc .navbar-brand img{
  height: 56px;
  width: auto;
  max-width: 100%;
}

@media (max-width: 992px){
  .navbar-llc .navbar-brand{ max-width: 260px; }
}

/* Keep desktop nav on one line */
@media (min-width: 992px){
  .navbar-llc .navbar-nav .nav-link{
    white-space: nowrap;
  }
}

/* Right-side cluster (social + buttons) stays together */
.nav-rail{
  display: flex;
  align-items: center;
  gap: .5rem;
  flex: 0 0 auto;
}

/* Make the collapse area behave */
.navbar-llc .navbar-collapse{
  align-items: center;
}

/* Better spacing for links */
.navbar-llc .navbar-nav{
  gap: .15rem;
}
/* --- Mobile nav rail: icons row + 2 equal buttons --- */
@media (max-width: 991.98px){
  .nav-rail{
    width: 100%;
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px solid var(--llc-line);

    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "social social"
      "register contact";
    gap: .6rem;
  }

  /* social row */
  .nav-social{
    grid-area: social;
    display: flex;
    justify-content: center;
    gap: .6rem;
  }

  /* buttons */
  .nav-rail .btn-brown{
    grid-area: register;
    width: 100%;
    text-align: center;
  }

  .nav-rail .btn-llc{
    grid-area: contact;
    width: 100%;
    text-align: center;
  }

}

  .choice-icon{
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: rgba(27,73,73,.10);
  color: var(--llc-forest);
  font-size: 22px;
}

/* =========================================
   Global mobile hero normalization
   ========================================= */

@media (max-width: 575.98px){

  /* Any page using hero-simple */
  .hero-simple{
    min-height: 200px;        /* prevents full-screen stretch */
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    align-items: center;
  }

  .hero-simple .container{
    padding-top: 0;
    padding-bottom: 0;
  }

  /* Headings */
  .hero-simple h1{
    font-size: 1.75rem;       /* consistent mobile H1 */
    line-height: 1.25;
    margin-bottom: .35rem;
  }

  /* Subtitles */
  .hero-simple .hero-sub,
  .hero-simple .lead{
    font-size: 1rem;
    line-height: 1.45;
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
  }

  /* Blog meta lines */
  .hero-simple .post-meta{
    font-size: .85rem;
    margin-bottom: .35rem;
  }
}
