/* Tradesman Life Group: shared brand layer on top of the page styles.
   Jobsite Navy #081830 · Safety Amber #F5B52E · Action Blue #1A7BC4 (buttons) · Arc Blue #7FD0F2 */
:root {
  --tlg-midnight: #050F20; --tlg-navy: #081830; --tlg-navy-2: #0E2747;
  --tlg-amber: #F5B52E; --tlg-amber-deep: #C98A0B;
  --tlg-blue: #1A7BC4; --tlg-blue-hover: #1565A3; --tlg-arc: #7FD0F2;
}

/* ── Logo lockup ── */
.tlg-logo { display: inline-flex; align-items: center; gap: 11px; white-space: nowrap; text-decoration: none; }
.tlg-logo img { width: 38px; height: 38px; display: block; flex: none; }
.tlg-word { display: flex; flex-direction: column; font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif; text-transform: uppercase; color: #fff; line-height: 1; }
.tlg-word b { font-weight: 800; font-size: 27px; line-height: .86; letter-spacing: .012em; }
.tlg-word > span { margin-top: 4px; display: flex; align-items: center; gap: 5px; font-weight: 600; font-size: 10.5px; letter-spacing: .17em; }
.tlg-word > span i { width: 2.5px; height: 2.5px; border-radius: 50%; background: currentColor; opacity: .55; }
.tlg-word > span em { font-style: normal; color: var(--tlg-amber); }
.tlg-logo.on-light .tlg-word { color: var(--tlg-navy); }
.tlg-logo.on-light .tlg-word > span em { color: var(--tlg-amber-deep); }
.tlg-logo.small img { width: 32px; height: 32px; }
.tlg-logo.small .tlg-word b { font-size: 23px; }
.tlg-logo.small .tlg-word > span { font-size: 9px; }

/* ── Top bar ── */
.tlg-nav { background: rgba(8, 24, 48, .97); border-bottom: 1px solid rgba(255, 255, 255, .08); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.tlg-navlink { font-size: 14px; font-weight: 500; color: rgba(255, 255, 255, .78); transition: color .15s; }
.tlg-navlink:hover { color: #fff; }
.tlg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--tlg-blue); color: #fff !important; font-weight: 700; font-size: 14px; padding: 10px 18px; border-radius: 999px; transition: background .15s, transform .15s; white-space: nowrap; }
.tlg-btn:hover { background: var(--tlg-blue-hover); transform: translateY(-1px); }
.tlg-menu { background: var(--tlg-navy); border-top: 1px solid rgba(255, 255, 255, .08); }
.tlg-menu a.mobile-link { color: rgba(255, 255, 255, .85); font-size: 16px; }
.tlg-menu .lbl { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--tlg-amber); }
.tlg-drop { background: #fff; border: 1px solid #EEF2F6; border-radius: 14px; box-shadow: 0 18px 40px rgba(5, 15, 32, .22); padding: 8px; width: 250px; }
.tlg-drop a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 9px; font-size: 14px; color: #3A516B; }
.tlg-drop a:hover { background: #F3F6F9; color: var(--tlg-navy); }

/* ── Amber accents on the inner pages (the blue stays for buttons and links) ── */
iconify-icon.text-gold, iconify-icon.text-\[\#1A7BC4\] { color: #E1A012 !important; }
.bg-gold\/10 { background-color: rgba(245, 181, 46, .16) !important; }
a.tlg-btn iconify-icon, .bg-gold iconify-icon, .bg-\[\#1A7BC4\] iconify-icon { color: inherit !important; }

/* ── Heavier headings, like the ads ── */
body h1, body h2 { font-weight: 800 !important; letter-spacing: -.025em; text-wrap: balance; }
body h3 { font-weight: 700; }

/* ── Small brand parts used across pages ── */
.tlg-tag { display: inline-block; background: var(--tlg-amber); color: var(--tlg-navy); font-weight: 800; font-size: 13px; letter-spacing: .09em; text-transform: uppercase; padding: 6px 11px 5px; border-radius: 5px; }
.tlg-powered { display: inline-flex; align-items: center; gap: 10px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 12px; padding: 10px 14px; color: rgba(255, 255, 255, .78); font-size: 13px; line-height: 1.3; }
.tlg-powered img { height: 26px; width: auto; display: block; }
.tlg-powered b { display: block; color: #fff; font-weight: 600; font-size: 14px; }