/* why: house skin over Divi blocks; blocks.css keeps layout, inline styles need !important.
   ref: ux/mockups/site/site.css. no photo bg, dark bands, tracked caps. */
:is(.mf-page, .mf-blank__main) {
  font: 400 var(--t-16)/1.6 var(--sans);
  color: var(--ink);
  background: transparent;

  & [style*="background-image"]:not(.mf-btn) { background-image: none !important; }
  & .mf-divr { display: none; }
  & [style*="box-shadow"] { box-shadow: none !important; }
  & [style*="background-color"]:not(.mf-btn) { background-color: transparent !important; }
  & .mf-row[style*="background-color"] { background-color: var(--tint) !important; border: 1px solid var(--line); border-radius: var(--r-container); }
  /* trap: footer-block logo is white on a blue column; flattened bg needs it black */
  & .mf-col[style*="background-color"] .mf-img img { filter: brightness(0); }

  & .mf-sec { padding: var(--s-64) 0 !important; }
  & .mf-sec + .mf-sec { border-top: 1px solid var(--line); }
  & .mf-row { width: min(calc(var(--page) - 96px), calc(100% - 96px)); padding: 0 !important; }
  & .mf-row + .mf-row { margin-top: var(--s-48); }
  & .mf-row[style*="background-color"] { padding: var(--s-32) !important; }
  & .mf-col.mf-pad { padding: 0 !important; }
  & .mf-mod { margin-bottom: var(--s-24); }
  & .mf-mod.mf-pad { padding: 0 !important; }

  & .mf-text, & .mf-text p, & .mf-text li, & .mf-dark, & .mf-dark p, & .mf-dark li {
    font-size: var(--t-16) !important; line-height: 1.6 !important; color: var(--ink) !important; font-weight: 400 !important; }
  & .mf-text li { line-height: 1.6 !important; }
  & .mf-text p { max-width: var(--measure); margin: 0 0 var(--s-16); }
  & .mf-text { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; text-align: left; }
  & .mf-tc, & .mf-tr, & .mf-tj { text-align: left; }
  & .mf-text ul, & .mf-text ol { padding: 0 0 var(--s-16) 1.25em; list-style-position: outside; max-width: var(--measure); }
  & .mf-text ol { list-style: decimal; }
  & .mf-text :is(h1, h2, h3, h4) { font-family: var(--serif); color: var(--ink) !important; letter-spacing: -0.01em !important; text-transform: none !important; padding: 0; margin: 0 0 var(--s-16); line-height: 1.15 !important; font-kerning: none; }
  & .mf-text h1 { font-size: clamp(var(--t-40), 5vw, var(--t-56)) !important; font-weight: 400 !important; max-width: 14em; }
  & .mf-text h2 { font-size: var(--t-40) !important; font-weight: 400 !important; line-height: 1.12 !important; }
  & .mf-text h3 { font-size: var(--t-28) !important; font-weight: 400 !important; line-height: 1.2 !important; }
  & .mf-text h4 { font: 600 var(--t-14)/1.4 var(--sans) !important; color: var(--ink-2) !important; margin: 0 0 var(--s-8); }
  & .mf-col:is(.mf-col-1_3, .mf-col-1_4, .mf-col-1_5, .mf-col-1_6) .mf-text h2 { font-size: var(--t-28) !important; }
  & .mf-lk a, & .mf-text a { color: var(--accent-ink) !important; font-size: inherit; line-height: inherit; }

  & .mfam-toc a { color: var(--ink-2) !important; }
  & .mfam-toc a:hover { color: var(--accent-ink) !important; }
  & .mf-btnwrap { margin-top: var(--s-24) !important; }
  & .mf-btn { height: 40px; padding: 0 var(--s-16) !important; border-radius: var(--r-control); border: 1px solid var(--line-control) !important; background: transparent; color: var(--ink) !important; font: 500 var(--t-14)/1 var(--sans) !important; text-transform: none; letter-spacing: 0; }
  & .mf-btn:hover { border-color: var(--ink) !important; }
  & .mf-btn[style*="background-color:#1d48c0"] { background: var(--accent) !important; border-color: transparent !important; color: var(--on-accent) !important; }
  & .mf-btn[style*="background-color:#1d48c0"]:hover { background: var(--accent-hover) !important; }

  & .mf-img__wrap img, & .mf-img img { border-radius: var(--r-control); }
  & .mf-team__img { border-radius: var(--r-control); filter: grayscale(1); }
  & .mf-team__name { font: 500 var(--t-20)/1.3 var(--serif) !important; color: var(--ink) !important; padding: 0; margin: 0 0 var(--s-4); font-kerning: none; }
  & .mf-team__pos { font: 600 var(--t-14)/1.4 var(--sans) !important; color: var(--ink-2) !important; margin: 0 0 var(--s-8) !important; }
  & .mf-team p:not(.mf-team__pos) { font-size: var(--t-14) !important; line-height: 1.5 !important; color: var(--ink-2) !important; font-weight: 400 !important; }
  & .mf-social a, & .mf-team .mf-social a, & .mf-dark .mf-social a { color: var(--ink) !important; border: 1px solid var(--line-control); border-radius: var(--r-control); width: 32px; height: 32px; }
  & ul.mf-mod.mf-social a { width: 32px; height: 32px; }

  & .mf-blurb__title { font: 600 var(--t-16)/1.4 var(--sans) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--ink) !important; }
  & .mf-blurb, & .mf-blurb__body { font-size: var(--t-16) !important; color: var(--ink) !important; font-family: var(--sans) !important; }
  & .mf-blurb__ico { color: var(--ink); }

  & .mf-toggle, & .mf-tab { border-bottom: 0; border-top: 1px solid var(--line); padding: var(--s-16) 0 !important; }
  & .mf-toggle summary, & .mf-tab summary { font: 400 var(--t-20)/1.3 var(--serif) !important; color: var(--ink) !important; font-kerning: none; padding: 0; }
  & .mf-toggle[style*="--tg-i"] summary::after { background: linear-gradient(var(--ink-2), var(--ink-2)) center/8px 2px no-repeat, linear-gradient(var(--ink-2), var(--ink-2)) center/2px 8px no-repeat; border: 1px solid var(--line-control); }
  & .mf-toggle[style*="--tg-i"][open] summary::after { background: linear-gradient(var(--ink-2), var(--ink-2)) center/8px 2px no-repeat; }
  /* why: doc icon = dark square; scroll chevron is white-on-photo, orphaned without the photo */
  & .mf-blurb:not(.mf-blurb--top) .mf-blurb__ico { display: none; }
  & .mf-blurb__ico + .mf-blurb__body { white-space: normal; }
  & .mf-blurb:not(.mf-blurb--top) { margin-bottom: var(--s-8) !important; }
  & .mf-row:has(.mf-blurb--top a[href="#next"]) { display: none; }
  /* why: image-only column loses its photo to the skin and leaves a blank third */
  & .mf-col:has(> .mf-gap:only-child) { display: none; }
  & .mf-row:has(> .mf-col > .mf-gap:only-child) { justify-content: flex-start; gap: 0 var(--s-48); }
  & .mf-text :is(h1, h2, h3, h4):last-child { margin-bottom: 0; }
  & .mf-toggle__body { font-size: var(--t-16) !important; line-height: 1.6 !important; color: var(--ink-2) !important; padding-top: var(--s-12) !important; }

  & .mf-text table { width: 100%; border: 0; border-collapse: collapse; font-size: var(--t-14); margin: var(--s-24) 0; }
  & .mf-text th { padding: 0 var(--s-16) var(--s-8) 0; border: 0; border-bottom: 1px solid var(--line-strong); font-weight: 500; font-size: var(--t-13); color: var(--ink-2) !important; vertical-align: bottom; }
  & .mf-text td { padding: var(--s-8) var(--s-16) var(--s-8) 0; border: 0; border-bottom: 1px solid var(--line); font-size: var(--t-14) !important; font-variant-numeric: tabular-nums; vertical-align: top; }
  & .mf-text th:last-child, & .mf-text td:last-child { padding-right: 0; }
  & .mf-text blockquote { margin: var(--s-24) 0; padding: var(--s-16) 0; border-block: 1px solid var(--line-strong); font: 400 var(--t-20)/1.5 var(--serif); font-kerning: none; color: var(--ink-2); }
  & .mf-text blockquote p { margin: 0; max-width: none; }

  & .mf-hr { border-top-color: var(--line); }
  & .mf-post__title { font: 400 var(--t-20)/1.3 var(--serif); font-kerning: none; padding: 0 0 var(--s-8); }
  & .mf-post__title a { text-decoration: none; }
  & .mf-post__title a:hover { color: var(--accent-ink); }
  & .mf-post__meta { font: 400 var(--t-13)/1.5 var(--sans); color: var(--ink-3); margin: 0 0 var(--s-8); }
  & .mf-post__meta a { color: var(--ink-3); }
  & .mf-post__ex { font: 400 var(--t-16)/1.6 var(--sans); color: var(--ink-2); max-width: var(--measure); }
  & .mf-posts { gap: 0 var(--s-32); }
  & .mf-posts--list { grid-template-columns: 1fr; }
  & .mf-posts:not(.mf-posts--grid):not(.mf-posts--np) { padding-bottom: 0; }
  & .mf-post { padding: var(--s-24) 0 !important; border-top: 1px solid var(--line); }
  & .mf-posts--grid { gap: 0 var(--s-32); }
  & .mf-pager { font-size: var(--t-14); font-weight: 500; line-height: 1.5; margin-top: var(--s-24); }
  & .mf-pager a { color: var(--accent-ink); }

  & .mf-search { margin: 0 0 var(--s-24); }
  & .mf-search input { height: 40px; border: 1px solid var(--line-control); border-radius: var(--r-control); padding: 0 48px 0 var(--s-12); font: 400 var(--t-16) var(--sans); color: var(--ink); background: var(--field); }
  & .mf-search button { height: 40px; width: 40px; right: 0; color: var(--ink-2); }
  & .mf-search svg { width: 20px; height: 20px; }
  & .mf-text > .mf-search { margin: 0; max-width: var(--measure); }
  & .mf-text > .mf-search input, & .mf-text > .mf-search button { height: 40px; }
}

/* why: contact/lead form = house fields, label is the placeholder so it stays quiet */
.mf-form { display: grid; gap: var(--s-16); justify-items: start; max-width: 36rem; margin-inline: 0; }
.mf-form input, .mf-form textarea { width: 100%; font: 400 var(--t-16)/1.4 var(--sans); color: var(--ink); background: var(--field); border: 1px solid var(--line-control); border-radius: var(--r-control); padding: 9px var(--s-12); }
.mf-form input:not(.mf-hp):not([type=hidden]) { height: 40px; }
.mf-form textarea { height: auto; min-height: 128px; resize: vertical; }
.mf-form input::placeholder, .mf-form textarea::placeholder { color: var(--ink-3); opacity: 1; }
.mf-form input:focus, .mf-form textarea:focus { outline: 2px solid var(--accent-ink); outline-offset: 0; border-color: var(--accent-ink); }
.mf-form .btn { font: 500 var(--t-14)/1 var(--sans); letter-spacing: 0; text-transform: none; height: 40px; padding: 0 var(--s-16); border: 1px solid transparent; border-radius: var(--r-control); background: var(--accent); color: var(--on-accent); }
.mf-form .btn:hover { background: var(--accent-hover); }
.mf-form__done, .mf-form__err { text-align: left; margin: 0; }
.mf-form__err { color: var(--neg); }
.mf-page .mf-formwrap { max-width: 36rem !important; margin-left: 0 !important; margin-right: 0 !important; }

.mf-blank__main { background: var(--bg); padding: var(--s-64) var(--s-48); font-family: var(--sans); color: var(--ink); }
.mf-blank__main .entry-content { display: block; max-width: var(--page); margin: 0 auto; }

@media (max-width: 980px) {
  :is(.mf-page, .mf-blank__main) {
    & .mf-row { width: calc(100% - 32px); }
    & .mf-sec { padding: var(--s-48) 0 !important; }
    & .mf-row + .mf-row { margin-top: var(--s-32); }
    & .mf-text h2 { font-size: var(--t-28) !important; }
    & .mf-text h3 { font-size: var(--t-20) !important; }
    & .mf-row > .mf-col:not(:last-child) { margin-bottom: var(--s-24); }
    & .mf-row > .mf-col:has(+ .mf-col:empty) { margin-bottom: 0; }
    & .mf-sec:has(h1) { padding-bottom: var(--s-32) !important; }
  }
  .mf-blank__main { padding: var(--s-48) var(--s-16); }
}