/* One humanist family, with roles shared across every public page. */
@font-face {
    font-family: 'Source Sans 3';
    src: url('../fonts/source-sans-3.ttf') format('truetype');
    font-style: normal;
    font-weight: 200 900;
    font-display: optional;
}
:root {
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --font-text: 'Source Sans 3', 'Segoe UI', sans-serif;
    --type-display: clamp(2rem, 3.4vw, 3rem);
    --type-heading: clamp(1.75rem, 3vw, 2.5rem);
    --type-title: 1.25rem;
    --type-lead: 1.1875rem;
    --type-control: 1rem;
    --type-body: 1.0625rem;
    --type-small: .9375rem;
    --bs-body-font-family: var(--font-text);
}
body { font-weight: var(--weight-regular); font-family: var(--font-text); font-size: var(--type-body); line-height: 1.6; font-kerning: normal; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-text); font-weight:var(--weight-semibold); text-wrap: balance; }
:root body h1 { font-size: var(--type-display); line-height: 1.13; letter-spacing: -.025em; font-weight:var(--weight-semibold); max-width: 29ch; }
:root body h2, :root body .section-title { font-size: var(--type-heading); line-height: 1.18; letter-spacing: -.02em; font-weight:var(--weight-semibold); }
:root body h5, :root body h6 { font-size: var(--type-title); line-height: 1.3; letter-spacing: -.01em; font-weight:var(--weight-semibold); }
:root body p, :root body .check-list li { font-size: var(--type-body); line-height: 1.6; }
body p { max-width: 68ch; text-wrap: pretty; }
:root body .hero-copy, :root body [class*='-hero'] .lead { font-size: var(--type-lead); line-height: 1.55; max-width: 52ch; }
body .gradient { color: inherit; }
/* Consistent uppercase labels for hero badges and section eyebrows. */
body .eyebrow, body .section-eyebrow, body .hero-badge {
    font-family: var(--font-text); font-size: var(--type-body); font-weight:var(--weight-medium);
    letter-spacing: 0; text-transform: uppercase; line-height: 1.5;
    border: 0; background: none; border-radius: 0; padding: 0;
}
body .nav-link, body .dropdown-item, body .btn, body .form-control, body .form-select, body .form-label {
    font-family: var(--font-text); font-size: var(--type-control); font-weight:var(--weight-semibold); letter-spacing: 0;
}
body .form-control, body .form-select { font-weight:var(--weight-regular); }
body .industry span, body .stat span, body .work-content small { font-size: var(--type-small); letter-spacing: 0; }
body .stat strong { font-weight:var(--weight-semibold); font-variant-numeric: tabular-nums; }
:root body footer h6 { font-size: var(--type-control); font-weight:var(--weight-semibold); }
body footer p, body footer a, body .footer-bottom { font-size: var(--type-small) !important; line-height: 1.6; }
body .navbar-brand { letter-spacing: 0; }
.brand-logo { display: block; width: 220px; height: auto; max-width: 100%; }
a { text-underline-offset: .18em; }
::selection { color: #fff; background: #1264e8; }
:focus-visible { outline: 3px solid #1264e8; outline-offset: 4px; }
@media (max-width: 575px) {
    :root { --type-display: 2rem; --type-lead: var(--type-body); }
    .row.g-5 { --bs-gutter-x: 1.5rem; }
    .brand-logo { width: 200px; }
}
/* Interface previews keep their compact typesetting rather than inheriting prose sizes. */
:root body .mission-main p { font-size: .8125rem; line-height: 1.5; }
:root body .mission-main h5 { font-size: var(--type-control); }
body .pricing-name, body .pricing-badge {
    font-size: var(--type-small); font-weight:var(--weight-semibold); letter-spacing: 0; text-transform: none;
}
body .pricing-price { font-weight:var(--weight-semibold); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
body .pricing-price span, body .pricing-setup, body .pricing-note,
body .pricing-list li, body .pricing-table th, body .pricing-table td { font-size: var(--type-small); line-height: 1.6; }

/* Shared secondary roles: details, lists, form help and pricing annotations. */
:root body h3, :root body h4 {
    font-size: var(--type-title); line-height: 1.3; letter-spacing: -.01em; font-weight:var(--weight-semibold);
}
:root body .principle strong { font-size: var(--type-title); line-height: 1.3; font-weight:var(--weight-semibold); }
:root body .principle span { font-size: var(--type-body); line-height: 1.6; }
:root body .form-text, :root body .invalid-feedback, :root body .valid-feedback,
:root body .pricing-note, :root body .pricing-setup, :root body .pricing-price span,
:root body .stat span, :root body .work-content small {
    font-size: var(--type-small); line-height: 1.6;
}

/* Semantic emphasis and browser defaults use the same weight as other emphasis. */
:root body strong, :root body b, :root body th {
    font-weight: var(--weight-semibold);
}
:root body input, :root body textarea, :root body select {
    font-weight: var(--weight-regular);
}

/* Center section headings on phones without changing desktop alignment. */
@media (max-width: 767px) {
    :root body section h2,
    :root body section .section-title {
        text-align: center;
        margin-inline: auto;
    }
    body section .section-eyebrow { text-align: center; }
}
@media (max-width: 767px) {
    body .hero-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }
    body .hero-actions .btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-width: 0;
        padding-inline: 10px;
        white-space: normal;
    }
}
@media (max-width: 767px) {
    body .hero,
    body .about-hero,
    body .software-hero,
    body .data-hero,
    body .web-hero,
    body .consult-hero {
        padding-top: 32px !important;
    }
}
@media (max-width: 767px) {
    body section a.btn {
        display: table;
        margin-inline: auto;
        text-align: center;
    }
}
@media (max-width: 767px) {
    body :is(.contact, .about-cta, .software-cta, .data-cta, .web-cta, .consult-cta) p {
        text-align: center;
        margin-inline: auto;
    }
}
@media (max-width: 767px) {
    body section :is(.section-eyebrow, .section-title, h2) {
        text-align: center;
        margin-inline: auto;
    }
    body section :is(.section-copy, h2 ~ p, .section-title ~ p) {
        text-align: center;
        margin-inline: auto;
    }
}
@media (max-width: 767px) {
    body section .pricing-card .section-copy {
        text-align: left;
        margin-inline: 0;
    }
}
@media (max-width: 767px) {
    .contact-details { text-align: center; }
}
@media (min-width: 992px) {
    .web-benefits-layout {
        grid-template-columns: calc(41.666667% - 28px) minmax(0, 1fr);
        column-gap: 48px;
    }
    .web-intro .row { align-items: flex-start !important; }
}