/* =========================================================================
   TL Consult — shared design system (all pages)
   Palette:  ivory #f7f3ec · deep teal #0e4f47 · dark teal #14322d · clay #c07a4c
   Type:     Spectral (serif display) · Manrope (body)
   ========================================================================= */

:root {
	--ivory:   #f7f3ec;
	--band:    #efe8dc;
	--mint:    #e6f1ee;
	--teal:    #0e4f47;
	--teal-dk: #14322d;
	--clay:    #c07a4c;
	--ink:     #1c2b28;
	--muted:   #5f6f6b;
	--muted-2: #4b5b56;
	--line:    #e3d9c8;
	--white:   #fff;
}

/* ---- reset within our canvas ---- */
.tlc-site { margin: 0; background: var(--ivory); color: var(--ink);
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	-webkit-font-smoothing: antialiased; overflow-x: hidden; }
.tlc-site * { box-sizing: border-box; }
.tlc-site a { color: inherit; text-decoration: none; }
.tlc-site img { max-width: 100%; display: block; }
/* :where() keeps these resets at zero specificity so component rules
   (e.g. `.tlc-cta__title { margin: 0 auto }`) can still set auto margins. */
:where(.tlc-site h1, .tlc-site h2, .tlc-site h3, .tlc-site p) { margin: 0; }

.tlc-wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: 32px; padding-right: 32px; }

/* ---- buttons / links ---- */
.tlc-btn { display: inline-block; font-weight: 700; border-radius: 100px; font-size: 16px;
	padding: 16px 32px; line-height: 1; transition: transform .15s ease, box-shadow .15s ease, background .15s ease; cursor: pointer; border: 0; }
.tlc-btn:hover { transform: translateY(-2px); }
.tlc-site a.tlc-btn--teal { background: var(--teal); color: #fff; }
.tlc-btn--teal:hover { box-shadow: 0 12px 26px rgba(14,79,71,.28); }
.tlc-site a.tlc-btn--clay { background: var(--clay); color: #fff; padding: 12px 24px; font-size: 15px; }
.tlc-btn--clay:hover { box-shadow: 0 12px 26px rgba(192,122,76,.32); }
.tlc-btn--lg { padding: 18px 44px; font-size: 17px; }
.tlc-link { font-weight: 700; color: var(--teal-dk); border-bottom: 2px solid var(--clay); padding-bottom: 3px; }
.tlc-link:hover { color: var(--clay); }

/* ---- eyebrow / headings ---- */
.tlc-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-weight: 700;
	font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--clay); }
.tlc-eyebrow__rule { width: 26px; height: 1.5px; background: var(--clay); display: inline-block; }
.tlc-eyebrow--plain { margin-bottom: 14px; }
.tlc-eyebrow--onteal { color: #79c2b5; margin-bottom: 18px; }
.tlc-h2 { font-family: 'Spectral', Georgia, serif; font-weight: 600; font-size: 40px;
	line-height: 1.15; color: var(--teal-dk); letter-spacing: -.01em; }
.tlc-h2--light { color: #fff; }

/* ---- top bar ---- */
.tlc-topbar { background: var(--teal); color: #b9d6cf; font-size: 13px; font-weight: 500; }
.tlc-topbar__inner { display: flex; justify-content: space-between; align-items: center; padding-top: 10px; padding-bottom: 10px; }
.tlc-topbar__contact { display: flex; gap: 26px; align-items: center; }
.tlc-topbar__contact a:hover { color: #fff; }
.tlc-topbar__tag { letter-spacing: .14em; text-transform: uppercase; font-size: 11px; color: #8fb9b0; }

/* ---- nav ---- */
.tlc-nav { background: var(--ivory); position: sticky; top: 0; z-index: 40; border-bottom: 1px solid rgba(227,217,200,.6); }
.admin-bar .tlc-nav { top: 32px; }
.tlc-nav__inner { display: flex; justify-content: space-between; align-items: center; padding-top: 20px; padding-bottom: 20px; }
.tlc-nav__brand img { height: 84px; width: auto; }
.tlc-nav__links { display: flex; gap: 30px; align-items: center; font-weight: 600; font-size: 15px; color: #2c3d39; }
.tlc-nav__links a:not(.tlc-btn):hover { color: var(--teal); }
.tlc-nav__links a.is-active { color: var(--teal); }
.tlc-nav__toggle { display: none; flex-direction: column; gap: 5px; background: none; border: 0; cursor: pointer; padding: 8px; }
.tlc-nav__toggle span { width: 24px; height: 2px; background: var(--teal-dk); display: block; border-radius: 2px; }

/* ---- footer ---- */
.tlc-footer { background: var(--teal-dk); color: #8fb9b0; font-size: 14px; }
.tlc-footer__inner { display: flex; justify-content: space-between; align-items: center; gap: 28px; padding-top: 34px; padding-bottom: 34px; flex-wrap: wrap; }
.tlc-footer__logo { height: 84px; width: auto; }
.tlc-footer a:hover { color: #fff; }

/* =========================================================================
   Responsive — shared chrome
   ========================================================================= */
@media (max-width: 860px) {
	.tlc-wrap { padding-left: 24px; padding-right: 24px; }
	.tlc-topbar__tag { display: none; }
	.tlc-nav__toggle { display: flex; }
	.tlc-nav { position: static; }
	.tlc-nav__inner { position: relative; }
	.tlc-nav__links { position: absolute; left: 0; right: 0; top: 100%; flex-direction: column;
		align-items: flex-start; gap: 4px; background: var(--ivory); padding: 12px 24px 20px;
		border-bottom: 1px solid var(--line); box-shadow: 0 20px 30px rgba(40,45,40,.08); display: none; z-index: 50; }
	.tlc-nav__links.is-open { display: flex; }
	.tlc-nav__links a { padding: 8px 0; }
	.tlc-nav__links .tlc-btn { margin-top: 8px; }
}