/*
  LTC brand styling (2026-10-27). See README "Where the look came from" and ho-notes/brand-guides.md (LTC entry).
  BP   = Drive Doc '"The Every Day Leadership Mindset" - Strategic Blueprint' (1DWX_6LQo43eQ4jiV85xSNZeZCj-AgQXONMRTJ6F3wE8), "Complete 5-Color Brand Palette". Palette only; nothing else from that Doc is used.
  FONTS = Montserrat (headings) + Roboto (body), confirmed by Tim via Chief, 2026-10-27 10:47 AM. Self-hosted, SIL OFL (assets/fonts/OFL-*.txt). No third-party font requests.
  LOGO = Drive "LTC Logo.png" (14aIEEKMfhCIyPgJC3lh0QjrHs0VEn6AN) and "LTC - Calibrate Logo.png" (1CldiXOJBK8i6slB5-aO2Ki2YDLbajMK5), copied unchanged to assets/img/.
  ROLES = Tim via Chief, 2026-10-27 11:09 AM CT: Center grey for backgrounds, West teal for secondary text, South light blue for accents, error red #a12a17 approved (the one non-palette color).
  TINT = Center #CFCFCF at 40% on white (#ececec). Teal text fails AA on any grey, so grey sections use North text only; teal secondary text sits only on white.
  Contrast (WCAG 2.1): see README "Contrast". Mustard and light blue are used as text only on North.
*/
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/montserrat-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/montserrat-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/roboto-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/roboto-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/roboto-latin-700-normal.woff2") format("woff2"); }
:root {
  --north: #00264C;       /* BP North (Self), dark blue. Base color */
  --east: #E0B42D;        /* BP East (Connection), muted mustard. Accent; text only on North */
  --south: #99ccff;       /* BP South (Understanding), light blue. Accent; text only on North */
  --west: #4A7D8F;        /* BP West (Empowerment), muted teal. Text only on white (4.54:1) */
  --center: #CFCFCF;      /* BP Compass Center, light grey. Decorative only */
  --white: #ffffff;
  --center-tint: #ececec; /* TINT: Center at 40% on white, for alternating sections. North text only (12.87:1) */
  --text: #00264C;        /* North as body text: 15.2:1 on white */
  --text-2: #4A7D8F;      /* ROLES: West teal secondary text, ON WHITE ONLY (4.54:1). Fails on grey (4.02 at 30%, 2.92 on #CFCFCF) */
  --on-north: #ffffff;    /* 15.2:1 on North */
  --on-north-2: rgba(255,255,255,.85); /* 11.2:1 on North */
  --heading: "Montserrat", "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;  /* FONTS + system fallback */
  --body: "Roboto", "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;        /* FONTS + system fallback */
  --pad-x: clamp(24px,7vw,110px);
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: var(--white); color: var(--text); font-family: var(--body); }
a { color: inherit; }

/* Draft markers. Remove .todo styling when placeholders are filled. */
.todo { background: #ffe58a; color: #101917; padding: 0 .3em; font-family: var(--body); font-size: .85em; font-weight: 700; letter-spacing: 0; text-transform: none; }
.ph-block { display: flex; align-items: center; justify-content: center; min-height: 90px; margin-top: 24px; padding: 20px; text-align: center; border: 2px dashed var(--east); background: #fff8e0; color: #101917; font-family: var(--body); font-size: 13px; font-weight: 700; }
.tfl-hide { display: none !important; }
[hidden] { display: none !important; }

/* Layout per ho-notes/leadership-layout-plan.md (Chief for Tim, 2026-10-27 11:47 AM CT).
   Spacing targets: body 18px/1.6, lines 60 to 70 characters (640px), sections 112px desktop / 64px mobile, content 1080px max. */
.tfl-wrap, .tfl-hero, .tfl-section > * { max-width: 1080px; margin-left: auto; margin-right: auto; }

/* Header: white, LTC logo, no nav */
.tfl-header { display: flex; align-items: center; gap: 18px; padding: 14px var(--pad-x); background: var(--white); border-bottom: 1px solid var(--center); }
.tfl-brand { display: flex; align-items: center; gap: 18px; line-height: 1; color: var(--north); }
.tfl-logo { display: block; width: auto; height: 56px; }
.tfl-brand-text { padding-left: 18px; border-left: 1px solid var(--center); }
.tfl-brand strong { display: block; font-family: var(--heading); font-size: 14px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
a.tfl-brand { text-decoration: none; }

/* 1. Hero: white, copy + form left, lesson preview right */
.tfl-hero { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(260px,.8fr); gap: clamp(40px,6vw,96px); align-items: center; padding: clamp(48px,7vw,112px) var(--pad-x); scroll-margin-top: 20px; }
.tfl-kicker { margin: 0 0 18px; font-family: var(--heading); font-size: 12px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: var(--west); }
.tfl-hero h1 { max-width: 14ch; margin: 0 0 24px; font-family: var(--heading); font-size: clamp(32px,4.4vw,58px); font-weight: 700; line-height: 1.1; letter-spacing: -.02em; color: var(--north); }
.tfl-intro-deck { max-width: 640px; margin: 0 0 32px; font-size: 20px; line-height: 1.6; color: var(--text-2); }
.tfl-optin { max-width: 480px; }
.tfl-hero-visual { display: flex; justify-content: center; }
/* Lesson preview: page 1 of the free chapter, with a subtle paper shadow */
.tfl-lesson { display: block; width: 100%; max-width: 360px; height: auto; background: var(--white); border: 1px solid #e3e3e3; box-shadow: 0 1px 2px rgba(0,38,76,.10), 0 10px 24px rgba(0,38,76,.10), 0 28px 60px rgba(0,38,76,.10); transform: rotate(1.2deg); }
.tfl-photo { display: block; width: 100%; max-width: 320px; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }

/* Form (on the page, no card) */
.tfl-form-row { margin-bottom: 14px; }
.tfl-form-row label { display: block; margin-bottom: 6px; font-family: var(--heading); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--north); }
.tfl-form-row input { width: 100%; padding: 14px 15px; border: 1px solid var(--west); border-radius: 0; outline: none; background: var(--white); color: var(--text); font-family: var(--body); font-size: 16px; }
.tfl-form-row input:focus { border-color: var(--north); box-shadow: 0 0 0 3px var(--south); }
.tfl-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.tfl-submit { display: inline-flex; align-items: center; justify-content: center; width: 100%; padding: 17px 18px; border: 0; background: var(--north); color: var(--on-north); cursor: pointer; font-family: var(--heading); font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; }
.tfl-submit:hover, .tfl-submit:focus-visible { background: var(--west); } /* white on West 4.54:1 */
.tfl-submit:focus-visible { outline: 3px solid var(--north); outline-offset: 3px; }
.tfl-submit:disabled { cursor: wait; opacity: .6; }
.tfl-form-message { min-height: 20px; margin-top: 12px; font-size: 14px; line-height: 1.5; color: var(--text-2); }
.tfl-form-message.is-error { color: #a12a17; } /* approved error red, 7.35:1 on white */
.tfl-under { margin: 4px 0 0; font-size: 14px; line-height: 1.6; color: var(--text-2); }
.tfl-thanks h3 { margin: 0 0 16px; font-family: var(--heading); font-size: clamp(26px,2.6vw,34px); font-weight: 700; color: var(--north); }
.tfl-thanks p { font-size: 20px; line-height: 1.6; color: var(--text-2); }
.tfl-thanks:focus { outline: none; }

/* Sections */
.tfl-section { padding: 112px var(--pad-x); }
.tfl-section-label { margin-bottom: 20px; font-family: var(--heading); font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--north); }
.tfl-h2 { max-width: 760px; margin: 0 0 24px; font-family: var(--heading); font-size: clamp(32px,3vw,38px); /* every section h2 = the For Organizations size (Tim via Chief, 1:01 PM CT) */ font-weight: 700; line-height: 1.12; letter-spacing: -.015em; color: var(--north); }
.tfl-section p { max-width: 640px; font-size: 20px; line-height: 1.6; color: var(--text-2); }
.tfl-text-link { font-weight: 700; color: var(--north); text-decoration-color: var(--west); text-underline-offset: 3px; }
.tfl-email-text { white-space: nowrap; }

/* 2. Who it's for (Center tint; North text only) */
.tfl-for { background: var(--center-tint); }
.tfl-for p { color: var(--text) !important; }
.tfl-checks { list-style: none; max-width: 640px; margin: 0 0 32px; padding: 0; }
.tfl-checks li { position: relative; padding: 10px 0 10px 28px; font-size: 21px; line-height: 1.5; color: var(--text); }
.tfl-checks li::before { content: ""; position: absolute; left: 0; top: 21px; width: 12px; height: 3px; background: var(--north); }
.tfl-for-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,420px); gap: 64px; align-items: center; }
.tfl-for-grid .tfl-checks { margin-bottom: 0; }

/* "Who it's for" visual: Tim's quote card image (2026-10-27 1:01 PM CT), the CEB sentence as real text under it. */
.tfl-quote-card { margin: 0; }
.tfl-quote-card img { display: block; width: 100%; max-width: 420px; height: auto; box-shadow: 0 1px 2px rgba(0,38,76,.10), 0 14px 30px rgba(0,38,76,.14); }

/* 3. What's inside */
.tfl-inside-grid { display: block; } /* small preview dropped 2026-10-27 12:07 PM CT: same image as the hero, redundant */
.tfl-points { counter-reset: pt; list-style: none; max-width: 640px; margin: 0; padding: 0; }
.tfl-points li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 10px 0; font-size: 21px; line-height: 1.6; color: var(--text); }
.tfl-points li + li { margin-top: 10px; }
.tfl-points li::before { content: counter(pt, decimal-leading-zero); counter-increment: pt; padding-top: 4px; font-family: var(--heading); font-size: 13px; font-weight: 700; color: var(--west); }

/* 4. About Tim */
.tfl-cred { padding-top: 0; }
.tfl-cred-grid { display: grid; grid-template-columns: 320px minmax(0,1fr); gap: 64px; align-items: start; }
.tfl-bio p { margin: 0 0 16px; font-size: 21px; color: var(--text) !important; }
.tfl-bio p:first-child { font-family: var(--heading); font-weight: 700; }

/* Testimonial (one quote) */
.tfl-quote { margin: 24px 0 0; padding: 4px 0 4px 22px; border-left: 4px solid var(--east); }
.tfl-quote blockquote { margin: 0; }
.tfl-quote blockquote p { margin: 0 0 8px; font-family: var(--heading); font-size: 20px !important; font-weight: 600; line-height: 1.45; color: var(--north) !important; }
.tfl-quote figcaption { font-size: 15px; font-weight: 700; letter-spacing: .04em; color: var(--text-2); }

/* 5. Repeat call to action: North band */
.tfl-repeat { display: flex; justify-content: center; padding-top: 72px; padding-bottom: 72px; background: var(--north); }
.tfl-repeat-btn { width: auto; min-width: 300px; background: var(--east); color: var(--north); }
.tfl-repeat-btn:hover, .tfl-repeat-btn:focus-visible { background: var(--south); } /* North on South 9.00:1 */
.tfl-repeat-btn:focus-visible { outline-color: var(--white); }

/* 6. Series. SIGNATURE TOUCH: the real LTC Icon, large and cropped at the right edge, on white. */
.tfl-suite { position: relative; overflow: hidden; }
.tfl-suite-copy { position: relative; z-index: 1; }
.tfl-suite-copy > * { max-width: 600px; }
.tfl-series-icon { position: absolute; z-index: 0; top: 50%; right: -150px; width: 560px !important; max-width: none !important; height: auto; transform: translateY(-50%); pointer-events: none; }
.tfl-dirs { list-style: none; margin: 0 0 32px; padding: 0; }
.tfl-dirs li { position: relative; padding: 8px 0 8px 26px; font-size: 19px; line-height: 1.6; color: var(--text-2); }
.tfl-dirs li::before { content: ""; position: absolute; left: 0; top: 16px; width: 12px; height: 12px; border-radius: 50%; background: var(--center); }
.tfl-dirs .tfl-dir-north::before { background: var(--north); }
.tfl-dirs .tfl-dir-east::before { background: var(--east); }
.tfl-dirs .tfl-dir-south::before { background: var(--south); box-shadow: inset 0 0 0 1px var(--west); }
.tfl-dirs .tfl-dir-west::before { background: var(--west); }
.tfl-dirs strong { font-family: var(--heading); font-weight: 700; color: var(--north); }
.tfl-status { display: flex; align-items: center; gap: 14px; font-size: 14px !important; font-family: var(--heading) !important; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--north) !important; }
.tfl-status-icon { flex: none; width: 48px; height: 48px; }

/* 7. Deck (hidden with tfl-hide until the deck exists) */
.tfl-deck { background: var(--north); }
.tfl-deck-card { position: relative; max-width: 900px; padding: clamp(30px,4vw,48px); background: var(--white); }
.tfl-deck-list { margin: 0 0 20px; padding-left: 20px; font-size: 19px; line-height: 1.7; color: var(--text-2); }
.tfl-deck-list strong { color: var(--north); }

/* 8. For organizations: compact */
.tfl-org { padding-top: 56px; padding-bottom: 56px; background: var(--center-tint); }
.tfl-org .tfl-h2 { margin-bottom: 10px; }
.tfl-org p { margin: 0; font-size: 19px; color: var(--text) !important; }

/* Fade-in (reveal.js adds .tfl-reveal only to off-screen blocks, never under reduced motion) */
.tfl-reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.tfl-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .tfl-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* 9. Footer */
.tfl-footer { display: flex; justify-content: space-between; align-items: center; gap: 30px; padding: 24px var(--pad-x); background: var(--north); color: var(--on-north-2); font-size: 13px; }
.tfl-footer a { color: var(--on-north); }
.tfl-footer-links { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.tfl-header-nav { display: flex; gap: 24px; margin-left: auto; font-family: var(--heading); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--north); }
.tfl-header-nav a { text-decoration: none; }

/* Privacy page */
.tfl-legal { max-width: 860px; }
.tfl-legal > .ph-block:first-child { margin: 0 0 32px; }
.tfl-legal h1 { margin: 0 0 18px; font-family: var(--heading); font-size: clamp(32px,3.6vw,48px); font-weight: 700; color: var(--north); }
.tfl-legal h2 { margin: 34px 0 10px; font-family: var(--heading); font-size: 28px; font-weight: 700; color: var(--north); }
.tfl-legal p, .tfl-legal li { font-size: 19px; line-height: 1.7; color: var(--text-2); }

@media (max-width: 860px) {
  .tfl-header { padding-top: 10px; padding-bottom: 10px; }
  .tfl-logo { height: 40px; }
  .tfl-brand, .tfl-brand-text { gap: 12px; padding-left: 12px; }
  .tfl-brand { padding-left: 0; }
  .tfl-hero { grid-template-columns: 1fr; gap: 40px; padding-top: 24px; padding-bottom: 64px; }
  .tfl-kicker { margin-bottom: 10px; }
  .tfl-hero h1 { margin-bottom: 14px; }
  .tfl-intro-deck { font-size: 18px; line-height: 1.5; margin-bottom: 18px; }
  .tfl-form-row { margin-bottom: 10px; }
  .tfl-form-row input { padding: 11px 13px; }
  .tfl-submit { padding: 14px 16px; }
  .tfl-lesson { max-width: 240px; }
  .tfl-section { padding-top: 64px; padding-bottom: 64px; }
  .tfl-cred { padding-top: 0; }
  .tfl-section p { font-size: 19px; }
  .tfl-points li { font-size: 18px; }
  .tfl-h2, .tfl-org .tfl-h2 { font-size: 30px; }
  .tfl-legal h2 { font-size: 24px; }
  .tfl-legal p, .tfl-legal li, .tfl-dirs li, .tfl-deck-list { font-size: 18px; }
  .tfl-checks li, .tfl-bio p { font-size: 18px; }
  .tfl-inside-grid, .tfl-cred-grid, .tfl-for-grid { grid-template-columns: 1fr; gap: 40px; }
  .tfl-photo { max-width: 220px; }
  .tfl-series-icon { position: relative; top: auto; right: auto; display: block; width: 140px !important; margin: 0 auto 32px; transform: none; }
  .tfl-footer { display: block; }
  .tfl-footer-links { margin-top: 10px; }
}

/* Body copy in Who it's for, What's inside, About Tim: 24px desktop / 20px mobile, line-height 1.5 (Tim via Chief, 2026-10-27 1:12 PM CT).
   Columns widened so lines run about 55 to 75 characters. */
.tfl-for-grid { grid-template-columns: minmax(0,1fr) minmax(280px,360px); gap: 56px; }
.tfl-for .tfl-checks { max-width: none; }
.tfl-for .tfl-checks li { font-size: 24px; line-height: 1.5; }
.tfl-for .tfl-checks li::before { top: 23px; }
.tfl-inside .tfl-points { max-width: 820px; }
.tfl-inside .tfl-points li { font-size: 24px; line-height: 1.5; }
.tfl-inside .tfl-points li::before { padding-top: 7px; }
.tfl-cred .tfl-bio p { max-width: 720px; font-size: 24px; line-height: 1.5; }
.tfl-cred .tfl-bio p:first-child { font-size: 28px; line-height: 1.4; }
.tfl-cred .tfl-quote blockquote p { max-width: 720px; font-size: 27px !important; line-height: 1.4; }
.tfl-cred .tfl-quote figcaption { font-size: 17px; }
@media (max-width: 860px) {
  .tfl-for-grid { grid-template-columns: 1fr; gap: 40px; }
  .tfl-for .tfl-checks li, .tfl-inside .tfl-points li, .tfl-cred .tfl-bio p { font-size: 20px; line-height: 1.5; }
  .tfl-for .tfl-checks li::before { top: 19px; }
  .tfl-inside .tfl-points li { grid-template-columns: 32px 1fr; gap: 10px; }
  .tfl-inside .tfl-points li::before { padding-top: 5px; }
  .tfl-cred .tfl-bio p:first-child { font-size: 23px; }
  .tfl-cred .tfl-quote blockquote p { font-size: 22px !important; }
  .tfl-cred .tfl-quote figcaption { font-size: 15px; }
}