/* Fees-page typography, explanatory images and open editorial layouts. */
@layer fees-visual-refinements {
  body[data-fees-visuals] h1 [data-hero-signature] {
    font-size: 1em !important;
    line-height: 1.5 !important;
  }
  html:not(.js) body[data-fees-visuals] .faq-answer {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
  }
  html:not(.js) body[data-fees-visuals] .faq-question { cursor: default !important; }
  html:not(.js) body[data-fees-visuals] .faq-question > [aria-hidden="true"] { display: none !important; }
  body[data-fees-visuals] main .fees-art-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr) !important;
    gap: clamp(24px, 4vw, 56px) !important;
    align-items: center !important;
  }
  body[data-fees-visuals] main .fees-art {
    display: block !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }
  body[data-fees-visuals] main .fees-art::before,
  body[data-fees-visuals] main .fees-art::after { content: none !important; }
  body[data-fees-visuals] main .fees-art img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 2 !important;
    object-fit: contain !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
  }
  body[data-fees-visuals] main .fees-art-copy h2 {
    margin: 12px 0 20px !important;
    font-size: clamp(1.75rem, 2.7vw, 2.6rem) !important;
    line-height: 1.35 !important;
    text-wrap: balance;
  }
  body[data-fees-visuals] main .fees-art-copy > p { margin: 0 0 20px !important; }
  body[data-fees-visuals] main .fees-quote-checks { margin: 0 0 24px; }
  body[data-fees-visuals] main .fees-quote-checks > div {
    padding: 16px 0;
    border-top: 1px solid var(--lifa-line, #dce2e9);
  }
  body[data-fees-visuals] main .fees-quote-checks dt {
    color: var(--lifa-brand-navy) !important;
    font: 600 1rem/1.5 var(--font-ui, Montserrat, sans-serif) !important;
  }
  body[data-fees-visuals] main .fees-quote-checks dd { margin: 6px 0 0; line-height: 1.8; }
  body[data-fees-visuals] main .fees-quote-checks dd p { margin: 0; }
  body[data-fees-visuals] main .fees-art-copy .feature-list li::before {
    background: var(--lifa-brand-teal) !important;
    box-shadow: none !important;
  }
  body[data-fees-visuals] main .fees-models {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(24px, 4vw, 56px);
  }
  body[data-fees-visuals] main .fees-model {
    padding: 24px 0 0;
    border-top: 2px solid var(--lifa-brand-teal);
    min-width: 0;
  }
  body[data-fees-visuals] main .fees-model h3 { font-size: 1.4rem !important; margin: 0 0 14px !important; }
  body[data-fees-visuals] main .fees-model strong { color: var(--lifa-brand-navy); }
  body[data-fees-visuals] main .fees-model p { margin: 0 0 16px !important; }
  body[data-fees-visuals] main .fees-ethics-note { margin: 28px 0 0; max-width: 85ch; }
  body[data-fees-content] main .fees-ethics-note { margin-top: 28px !important; }
  body[data-fees-content] main :is(.fees-model, .fees-reading, .fees-art-copy) a:not(.btn) {
    color: var(--lifa-brand-teal) !important;
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
  }
  body[data-fees-content] main .fees-reading > .container > h2 {
    text-align: left !important;
    margin: 0 0 24px !important;
    font-size: clamp(1.75rem, 2.7vw, 2.6rem) !important;
    line-height: 1.35 !important;
  }
  body[data-fees-content] main .fees-reading :is(h2,h3)::after { content: none !important; }
  body[data-fees-content] main .fees-reading h3 {
    font: 400 1.25rem/1.5 Prata, Georgia, serif !important;
    margin: 0 0 12px !important;
    text-align: left !important;
  }
  body[data-fees-content] main .fees-reading p { margin: 0 0 16px !important; line-height: 1.8; }
  body[data-fees-content] main .fees-reading { background: #fff !important; }
  body[data-fees-content] main #company-fees-11 { background: var(--lifa-brand-ivory) !important; }
  body[data-fees-content] main .fees-answer { max-width: 88ch; margin: 28px 0; }
  body[data-fees-content] main .fees-cost-ledger { margin: 28px 0; }
  body[data-fees-content] main .fees-cost-ledger > div {
    display: grid; grid-template-columns: minmax(0,.65fr) minmax(0,1.35fr);
    gap: 24px 48px; padding: 22px 0; border-top: 1px solid #dce2e9;
  }
  body[data-fees-content] main .fees-cost-ledger dt {
    font: 600 1.05rem/1.6 Montserrat, sans-serif !important; color: var(--lifa-brand-navy) !important;
  }
  body[data-fees-content] main .fees-cost-ledger dd { margin: 0; line-height: 1.8; }
  body[data-fees-content] main .fees-cost-ledger dd p { margin: 10px 0 0 !important; }
  body[data-fees-content] main .fees-payment-steps {
    display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px;
    padding: 0; margin: 32px 0 0; list-style: none; counter-reset: payment;
  }
  body[data-fees-content] main .fees-payment-steps li { counter-increment: payment; min-width: 0; }
  body[data-fees-content] main .fees-payment-steps li::before {
    content: counter(payment, decimal-leading-zero); display: block;
    font: 400 1.8rem/1.6 Reey, cursive; color: var(--lifa-brand-teal); margin-bottom: 12px;
  }
  body[data-fees-content] main .fees-proof-layout { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 48px; }
  body[data-fees-content] main .fees-project { border-left: 3px solid var(--lifa-brand-teal); padding-left: 24px; }
  body[data-fees-content] main .fees-project .eyebrow { display: block; margin-bottom: 16px; }
  body[data-fees-content] main .fees-resource-columns { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; }
  body[data-fees-content] main .fees-resources { list-style: none; padding: 0; margin: 0; }
  body[data-fees-content] main .fees-resources li { padding: 18px 0; border-top: 1px solid #dce2e9; }
  body[data-fees-content] main .fees-resources a { font-weight: 600; }
  body[data-fees-content] main .fees-resources p { font-size: .94rem; margin: 8px 0 0 !important; }
  body[data-fees-content] main .package-start ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
  body[data-fees-content] main :is(.fees-reading,.fees-models,.fees-art-copy) a:focus-visible {
    outline: 3px solid var(--lifa-brand-teal); outline-offset: 4px;
  }
  body[data-fees-visuals] main .fees-comparison-disclosure {
    margin-top: 24px;
    border-block: 1px solid #dce2e9;
  }
  body[data-fees-visuals] main .fees-comparison-disclosure > summary {
    padding: 20px 8px;
    cursor: pointer;
    font: 600 1rem/1.6 var(--font-ui, Montserrat, sans-serif);
    color: var(--lifa-brand-navy);
  }
  body[data-fees-visuals] main .fees-comparison-disclosure > summary:focus-visible {
    outline: 3px solid var(--lifa-brand-teal);
    outline-offset: 3px;
  }
  body[data-fees-visuals] main #company-fees-6 .fees-art { order: -1; }
  body[data-fees-visuals] main :is(#company-fees-2, #company-fees-6, #company-fees-9) { background: #fff !important; }
  @media (max-width: 800px) {
    body[data-fees-visuals] main .fees-art-layout,
    body[data-fees-visuals] main .fees-models { grid-template-columns: minmax(0, 1fr) !important; }
    body[data-fees-visuals] main .fees-art { max-width: 680px; width: 100%; margin-inline: auto !important; order: -1; }
    body[data-fees-visuals] main .fees-art-copy h2 { max-width: none !important; }
    body[data-fees-content] main :is(.fees-payment-steps,.fees-proof-layout,.fees-resource-columns,.package-start ol) { grid-template-columns: minmax(0,1fr); gap: 26px; }
    body[data-fees-content] main .fees-cost-ledger > div { grid-template-columns: minmax(0,1fr); gap: 8px; }
    body[data-fees-content] main .fees-project { padding-left: 18px; }
  }
}
