/* Altitude Accounting (taxman.wpguy.com) crisp pass, site-wide - 2026-10-29.
   Same words, palette and fonts as the designer's build. Loaded by mu-plugin tx-crisp.php, which also adds
   tx-row / tx-dark / tx-light / tx-media / tx-hero classes to Beaver Builder rows (and tx-dark / tx-light to columns
   with their own background) and routes orange text through --tx-orange-text. Remove the mu-plugin to undo. */
:root { --tx-green: #002E2E; --tx-teal: #3E6C68; --tx-orange: #C7662B; --tx-orange-deep: #B25A22; --tx-orange-ink: #A9521D;
  --tx-orange-light: #E8925A; --tx-cream: #FEFAF6; --tx-sand: #DED7D1; --tx-mint: #DEF0E2; }

/* Orange text by ground: 3.77:1 -> 5.17:1 on cream, 3.75:1 -> 6.08:1 on dark green */
body { --tx-orange-text: var(--tx-orange-ink); }
.tx-light { --tx-orange-text: var(--tx-orange-ink); }
.tx-dark, .tx-media { --tx-orange-text: var(--tx-orange-light); }

/* 1. Tight display type, readable body type (everything was line-height 1.4) */
.fl-builder-content h1 { line-height: 1.06 !important; letter-spacing: -0.02em; }
.fl-builder-content h2, .fl-builder-content h3, .fl-builder-content h4, .fl-builder-content h5, .fl-builder-content h6 { line-height: 1.2 !important; letter-spacing: -0.01em; }
.tx-row .fl-rich-text p, .tx-row .fl-rich-text li, .tx-row .pp-infolist-description, .tx-row .pp-infolist-description p { line-height: 1.65 !important; }

/* 2. One container: the header was 1100px while page rows are 1200px, so the logo never lined up with the text */
header .fl-row-content { max-width: 1200px !important; }

/* 3. One section rhythm on the plain rows (was 20px top / 80px bottom; the bottom room clears the angled dividers).
   Page layouts only: the mu-plugin does not tag Themer header/footer rows. */
.tx-row.tx-dark:not(.tx-hero) > .fl-row-content-wrap, .tx-row.tx-light:not(.tx-hero) > .fl-row-content-wrap { padding-top: 72px !important; padding-bottom: 104px !important; }

/* 4. Hero */
.tx-hero h1 { font-weight: 600 !important; }
.tx-hero .fl-module-heading:has(h1) { margin-bottom: 28px !important; }
/* the row that now holds the hero's paragraph (hero = no paragraphs); same ground as the row below, no bottom padding */
.tx-lead > .fl-row-content-wrap { padding: 56px 24px 0 !important; }
.tx-lead .fl-rich-text, .tx-lead .fl-rich-text p { text-align: center !important; }
.tx-lead .fl-rich-text p { font-size: 19px !important; line-height: 1.6 !important; color: var(--tx-green) !important; max-width: 720px; margin-left: auto !important; margin-right: auto !important; }
/* the lead row takes the ground of the row below it (JW 2026-10-29), so on dark green the text is cream */
.tx-lead.tx-dark .fl-rich-text p { color: var(--tx-cream) !important; }

/* 5. Solid buttons with a semibold label (were transparent or flat with regular-weight text) */
.fl-builder-content a.fl-button, .fl-builder-content a.fl-button:visited, .gform_wrapper .gform_button, .gform_wrapper input[type=submit] {
  background: var(--tx-orange-deep) !important; background-image: none !important; border: 0 !important; border-radius: 6px !important;
  box-shadow: none !important; padding: 15px 28px !important; }
.fl-builder-content a.fl-button, .fl-builder-content a.fl-button span, .gform_wrapper .gform_button, .gform_wrapper input[type=submit] {
  color: #ffffff !important; font-weight: 600 !important; font-family: 'Epilogue', sans-serif !important; font-size: 16px !important; }
.fl-builder-content a.fl-button:hover, .fl-builder-content a.fl-button:focus { background: var(--tx-orange-ink) !important; }
.fl-builder-content a.fl-button:focus-visible { outline: 2px solid var(--tx-green); outline-offset: 3px; }
.tx-dark a.fl-button:focus-visible, .tx-media a.fl-button:focus-visible { outline-color: var(--tx-cream); }

/* 6. Header: nav labels medium weight, the phone number the strongest item */
header .fl-menu .menu > li > a { font-weight: 500 !important; }
header .fl-menu .menu > li:last-child > a { font-weight: 600 !important; color: var(--tx-green) !important; }

/* ---------- Homepage specifics (page 9) ---------- */
/* Video hero: a real overlay so the copy sits on a calm area; eyebrow as a tracked label; button on the text edge */
.fl-node-sl3dba5f0hei > .fl-row-content-wrap::after { background: linear-gradient(180deg, rgba(0,46,46,0) 50%, rgba(0,46,46,0.9) 100%), linear-gradient(90deg, rgba(0,46,46,0.92) 0%, rgba(0,46,46,0.72) 45%, rgba(0,46,46,0.45) 80%) !important; opacity: 1 !important; }
/* (the bottom fade blends the video, whose frames are sometimes bright snow at the bottom, into the dark divider) */
.fl-node-sl3dba5f0hei h4 { font-size: 14px !important; font-weight: 600 !important; letter-spacing: 0.14em !important; text-transform: uppercase; }
.fl-node-sl3dba5f0hei .fl-module-heading:has(h4) { margin-bottom: 18px !important; }
.fl-node-sl3dba5f0hei .fl-button-wrap { text-align: left !important; justify-content: flex-start !important; }
/* "Get It Wrong" row: right-aligned heading + text -> left aligned like the rest of the page */
.fl-node-o7z91sj0ngxb h4, .fl-node-o7z91sj0ngxb p { text-align: left !important; }
.fl-node-o7z91sj0ngxb h4 { font-size: 32px !important; }

@media (max-width: 768px) {
  .tx-row.tx-dark:not(.tx-hero) > .fl-row-content-wrap, .tx-row.tx-light:not(.tx-hero) > .fl-row-content-wrap { padding-top: 56px !important; padding-bottom: 88px !important; }
  .tx-lead .fl-rich-text p { font-size: 17px !important; }
  .tx-lead > .fl-row-content-wrap { padding: 40px 20px 0 !important; }
}

/* The UABB angled dividers draw 0.8px past the page edge, which gave every page a 1px sideways scroll */
html, body { overflow-x: clip; }

/* Homepage hero on phones (it was desktop-only before 2026-10-29): headline sized to the screen, even overlay */
@media (max-width: 768px) {
  .fl-node-sl3dba5f0hei h1 { font-size: clamp(34px, 10vw, 48px) !important; }
  .fl-node-sl3dba5f0hei > .fl-row-content-wrap::after { background: linear-gradient(180deg, rgba(0,46,46,0.72) 0%, rgba(0,46,46,0.8) 60%, rgba(0,46,46,0.95) 100%) !important; }
}
.tx-hero h1 { overflow-wrap: normal; word-break: normal; hyphens: manual; }
/* phones: header content on the same 20px edge as the page text (the logo sat flush against the screen edge) */
@media (max-width: 768px) { header .fl-row-content-wrap { padding-left: 20px !important; padding-right: 20px !important; } }

/* Separator under the moved hero paragraph (JW 2026-10-29): same ground as the row below, so a short centered accent
   rule closes the intro and a full section gap follows (grouping by proximity, blueprint visual-design.md) */
.tx-lead > .fl-row-content-wrap { padding-bottom: 8px !important; }
.tx-lead .fl-col-content::after { content: ''; display: block; width: 72px; height: 3px; border-radius: 2px; margin: 36px auto 0; background: var(--tx-orange-ink); }
.tx-lead.tx-dark .fl-col-content::after { background: var(--tx-orange-light); }
@media (max-width: 768px) { .tx-lead .fl-col-content::after { margin-top: 28px; width: 56px; } }

/* Accent-rule spacing, measured (JW 2026-10-29: "look at how much space exists after that line"): 32px text -> rule,
   then 64px rule -> next content (48px on phones). The section-spacing rule above was overriding the lead row's bottom
   padding (104px + the next row's 72px = 196px under the line). */
.tx-lead .fl-rich-text p:last-child, .tx-lead .fl-rich-text > :last-child { margin-bottom: 0 !important; }
.tx-lead .fl-module, .tx-lead .fl-module-content { margin-bottom: 0 !important; }
.tx-lead .fl-col-content::after { margin-top: 32px !important; }
.tx-row.tx-lead.tx-dark > .fl-row-content-wrap, .tx-row.tx-lead.tx-light > .fl-row-content-wrap { padding-bottom: 0 !important; }
.tx-row.tx-lead + .tx-row.tx-dark > .fl-row-content-wrap, .tx-row.tx-lead + .tx-row.tx-light > .fl-row-content-wrap { padding-top: 44px !important; }
@media (max-width: 768px) {
  .tx-lead .fl-col-content::after { margin-top: 28px !important; }
  .tx-row.tx-lead + .tx-row.tx-dark > .fl-row-content-wrap, .tx-row.tx-lead + .tx-row.tx-light > .fl-row-content-wrap { padding-top: 28px !important; }
}