/* LOBA branding, homepage background and the About Us page. */
.brand .brand-logo { width: 46px; height: 46px; animation: none; filter: drop-shadow(0 0 8px rgba(25, 211, 255, .45)); flex: none; border-radius: 12px; object-fit: contain; }
.brand .name .loba { color: var(--cyan); margin-right: 8px; padding-right: 9px; border-right: 2px solid rgba(255, 255, 255, .35); }
.brand .tag { line-height: 1.22; }

@media (min-width: 981px) { .mainnav { gap: 2px; padding-left: 12px; padding-right: 12px; } .mainnav a { padding: 9px 9px; font-size: 16px; gap: 6px; } }

/* Homepage background: sits behind the map canvas and never receives clicks. */
.hero.has-loba-bg { background: linear-gradient(180deg, #071242, #060d2b); }
.hero.has-loba-bg .sky, .hero.has-loba-bg .skyline { display: none; }
.lcmap-bg { position: absolute; inset: 0; pointer-events: none; background-color: #0a1a78; background-repeat: no-repeat; background-position: center; background-size: cover;
  background-image: linear-gradient(90deg, rgba(6, 13, 43, .84) 0%, rgba(6, 13, 43, .6) 20%, rgba(6, 13, 43, 0) 36%, rgba(6, 13, 43, 0) 68%, rgba(6, 13, 43, .45) 84%, rgba(6, 13, 43, .7) 100%), url('../img/home-bg-2000.webp'); }
.hero.has-loba-bg .js-hero-text { text-shadow: 0 2px 12px rgba(0, 0, 0, .75); }
@media (max-width: 1399px) { .lcmap-bg { background-image: linear-gradient(90deg, rgba(6, 13, 43, .84) 0%, rgba(6, 13, 43, .6) 20%, rgba(6, 13, 43, 0) 36%, rgba(6, 13, 43, 0) 68%, rgba(6, 13, 43, .45) 84%, rgba(6, 13, 43, .7) 100%), url('../img/home-bg-1400.webp'); } }
@media (min-width: 1181px) {
  /* The map's column is centred so that it sits inside the oval of the picture. */
  .hero.has-lcmap .hero-inner { grid-template-columns: minmax(280px, 1fr) minmax(0, 1.05fr) minmax(250px, 1fr); }
  .hero.has-lcmap .county-card { width: 250px; justify-self: end; }
}
@media (max-width: 1180px) {
  /* The picture frames the map area only; the text and county card sit on plain navy. */
  .lcmap-bg { inset: auto 0; background-image: linear-gradient(180deg, rgba(6, 13, 43, .55), rgba(6, 13, 43, 0) 18%, rgba(6, 13, 43, 0) 80%, rgba(6, 13, 43, .6)), url('../img/home-bg-tablet.webp'); }
}
@media (max-width: 600px) { .lcmap-bg { background-image: linear-gradient(180deg, rgba(6, 13, 43, .55), rgba(6, 13, 43, 0) 18%, rgba(6, 13, 43, 0) 80%, rgba(6, 13, 43, .6)), url('../img/home-bg-phone.webp'); } }

/* About Us */
.ab-hero { position: relative; color: #fff; text-align: center; padding: 58px 20px; background: linear-gradient(90deg, rgba(6, 13, 43, .9), rgba(6, 13, 43, .5) 28%, rgba(6, 13, 43, .5) 72%, rgba(6, 13, 43, .9)), url('../img/home-bg-1400.webp') center / cover no-repeat, #0a1a78; }
.ab-hero-in { max-width: 760px; margin: 0 auto; text-shadow: 0 2px 12px rgba(0, 0, 0, .7); }
.ab-hero h1 { font-size: clamp(32px, 5vw, 56px); line-height: 1.02; font-weight: 800; margin: 6px 0 10px; }
.ab-hero .gold { color: var(--gold); }
.ab-hero .lead { font: 600 20px var(--font-d); margin: 0 0 20px; }
.ab-hero .cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.ab-eyebrow { margin: 0; font: 700 14px var(--font-d); letter-spacing: .8px; text-transform: uppercase; color: var(--cyan); }
.ab { display: grid; gap: 18px; }
.ab > *, .ab-services > *, .ab .grid > * { min-width: 0; }
.ab h2 { display: flex; align-items: center; gap: 10px; font-size: 26px; margin: 0 0 10px; }
.ab h2 > i { color: var(--blue); }
.ab-h { font-size: 30px !important; margin: 10px 0 12px !important; }
.ab-text { white-space: pre-line; line-height: 1.6; margin: 0; }
.ab-services { display: grid; gap: 16px; scroll-margin-top: 72px; }
.ab-contact { scroll-margin-top: 72px; }
@media (min-width: 981px) { .footer { grid-template-columns: minmax(300px, 1.7fr) repeat(4, minmax(0, 1fr)); } }
.ab-cat { display: flex; align-items: center; gap: 10px; font-size: 22px; margin: 0 0 6px; }
.ab-cat span { display: inline-grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 9px; color: #fff; background: linear-gradient(135deg, var(--blue), var(--purple)); }
.ab-mods { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 10px; margin-top: 12px; }
.ab-mod { display: flex; gap: 11px; align-items: flex-start; padding: 12px; text-align: left; font: inherit; color: inherit; background: rgba(47, 139, 255, .07); border: 1px solid rgba(47, 139, 255, .22); border-radius: 12px; cursor: pointer; transition: border-color .15s, transform .15s; }
.ab-mod:hover { border-color: var(--blue); transform: translateY(-1px); }
.ab-mod:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.ab-mod > i { font-size: 19px; color: var(--blue); margin-top: 2px; width: 24px; text-align: center; flex: none; }
.ab-mod b { display: block; line-height: 1.2; font-family: var(--font-d); font-size: 16.5px; }
.ab-mod small { display: block; margin-top: 3px; font-size: 13px; line-height: 1.35; opacity: .82; }
.ab-note { margin: 12px 0 0; font-size: 13px; padding: 9px 12px; border-radius: 10px; background: rgba(255, 194, 26, .14); border-left: 3px solid var(--gold); }
.ab-founder { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 24px; align-items: start; }
.ab-founder h3 { font-size: 32px; margin: 3px 0 0; }
.ab-role { margin: 2px 0 10px; font-weight: 600; color: var(--blue); }
.ab-photo { aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: linear-gradient(150deg, #0e1d6b, #4a2fb0); }
.ab-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ab-ph { width: 100%; height: 100%; display: flex; flex-direction: column; gap: 10px; align-items: center; justify-content: center; color: rgba(255, 255, 255, .78); font-size: 44px; }
.ab-photo.big .ab-ph { font-size: 92px; }
.ab-ph small { font-size: 13px; }
.ab-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; margin-top: 14px; }
.ab-person h3 { font-size: 21px; margin: 10px 0 0; }
.ab-person .ab-text { font-size: 14px; }
.ab-pc { display: grid; gap: 4px; margin-top: 8px; font-size: 14px; }
.ab-pc a { display: inline-flex; gap: 8px; align-items: center; overflow-wrap: anywhere; color: var(--blue); }
.ab-dl { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 9px 12px; margin: 0; }
.ab-dl dt { font-weight: 600; opacity: .72; font-size: 14px; }
.ab-dl dd { margin: 0; overflow-wrap: anywhere; }
.ab-dl a { color: var(--blue); text-decoration: underline; display: inline-block; padding: 2px 0; }
.ab-form { display: grid; gap: 10px; }
.ab-form label { display: grid; gap: 4px; font-size: 14px; font-weight: 600; }
.ab-form .btn { justify-content: center; }
.js-tm, .js-tm h3, .js-tm .ab-tmrow b { color: #0a1650; }
.js-tm .muted { color: #4a5a8a; }
.ab-tmrow { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(120, 140, 200, .25); }
.ab-tmrow.off { opacity: .6; }
.ab-tmrow img, .ab-tmph { width: 54px; height: 54px; border-radius: 12px; object-fit: cover; flex: none; }
.ab-tmph { display: grid; place-items: center; color: #fff; background: linear-gradient(150deg, #0e1d6b, #4a2fb0); }
.ab-tmrow .grow { flex: 1 1 180px; min-width: 0; }
.ab-tmact { display: flex; flex-wrap: wrap; gap: 5px; }
@media (max-width: 760px) {
  .ab-founder { grid-template-columns: 1fr; }
  .ab-founder .ab-photo { max-width: 260px; }
  .ab-dl { grid-template-columns: 1fr; gap: 1px; }
  .ab-dl dd { margin-bottom: 8px; }
}
@media (prefers-reduced-motion: reduce) { .ab-mod { transition: none; } .ab-mod:hover { transform: none; } }