/* css/rky-calc-content.css
 *
 * Shared polish for the CONTENT inside every calculator, the same type
 * scale the personal tools use (css/rky-content.css there). Styling only —
 * no calculator's code or behaviour changes.
 *
 * Link it LAST, after the calculator's own stylesheet. Every rule starts
 * with :root so it wins over the calculator's older styles without
 * needing !important.
 *
 * Type scale:
 *   section title  16px / 650, full ink, sentence case
 *   card title     15px / 650
 *   label          12.5px / 500, secondary ink, sentence case
 *   table header   12px / 500, secondary ink, sentence case
 */

/* =====================================================================
   1. Section titles — tiny grey CAPITALS between lines become calm
      sentence-case titles ("Result", "Your figures", …)
   ===================================================================== */

:root .section-rule{
    display:block;
    margin:30px 2px 12px;
    font-size:16px;
    font-weight:650;
    letter-spacing:-.01em;
    text-transform:none;
    line-height:1.3;
    color:var(--rky-ink);
}

:root .section-rule::before,
:root .section-rule::after{display:none}

/* the first one sits closer to the top bar */
:root main > .section-rule:first-of-type,
:root .wrap > .section-rule:first-of-type{margin-top:22px}

/* =====================================================================
   2. Small headings inside cards and panels
   ===================================================================== */

/* a card whose only title is an eyebrow ("Recovery timeline") */
:root .card-head .eyebrow{
    font-size:15px;
    font-weight:650;
    letter-spacing:-.01em;
    text-transform:none;
    color:var(--rky-ink);
}

:root .eyebrow,
:root .hero-eyebrow,
:root .collapse-eyebrow,
:root .ason-eyebrow{
    font-size:12.5px;
    font-weight:600;
    letter-spacing:0;
    text-transform:none;
    color:var(--rky-ink-2);
}

:root .hero-eyebrow{margin-bottom:10px}

:root .g-h{
    font-size:13.5px;
    font-weight:650;
    letter-spacing:-.005em;
    text-transform:none;
    color:var(--rky-ink);
}

:root .entry-form-title{
    font-size:13px;
    font-weight:600;
    letter-spacing:0;
    text-transform:none;
    color:var(--rky-ink-2);
}

/* =====================================================================
   3. Labels
   ===================================================================== */

:root .field label,
:root .field-label,
:root .stat-label,
:root .hero-label,
:root .facts-title{
    font-size:12.5px;
    font-weight:500;
    letter-spacing:0;
    text-transform:none;
    color:var(--rky-ink-2);
}

:root .sticky-label{
    font-size:11px;
    font-weight:500;
    letter-spacing:0;
    text-transform:none;
}

/* small tags stay tags, just not shouting */
:root .now-tag,
:root .method-tag,
:root .pin-tag,
:root .credit-tip-label{
    letter-spacing:0;
    text-transform:none;
}

/* =====================================================================
   4. Tables — calm, sentence-case headers
   ===================================================================== */

:root th,
:root table.sched th,
:root .cmp-head{
    font-size:12px;
    font-weight:500;
    letter-spacing:0;
    text-transform:none;
    color:var(--rky-ink-2);
}

/* =====================================================================
   5. True Cost — its own small capitals
   ===================================================================== */

:root .rate-summary .title{
    letter-spacing:0;
    text-transform:none;
    font-size:12.5px;
}