/*
 * PairAndGo member-site typography contract.
 *
 * Font family, size, weight, style, line height, letter spacing, and text
 * transformation belong here and nowhere else in the member application.
 * Components choose semantic HTML or one of the shared roles below; they do
 * not create page-specific type systems.
 */
:root {
    --font-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
    --font-display: var(--font-sans);
    --text-xs: .6875rem;
    --text-sm: .875rem;
    --text-base: 1rem;
    --text-lg: 1.25rem;
    --text-title: clamp(2rem, 4vw, 3rem);
    --text-hero: var(--text-title);
    --type-0: var(--text-xs);
    --type-2: var(--text-lg);
    --type-3: var(--text-lg);
}

html,
body {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    font-weight: 400;
    line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6,
.type-page-title,
.type-section-title {
    font-family: var(--font-display);
    font-style: normal;
    letter-spacing: -.015em;
}

h1,
.type-page-title {
    font-size: var(--text-title);
    font-weight: 700;
    line-height: 1.1;
}

h2,
.type-section-title {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
}

h3 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
}

h4,
h5,
h6 {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
}

p,
li,
dd,
output,
.type-body,
.type-data {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: normal;
    text-transform: none;
}

strong,
b {
    font-weight: 700;
}

label,
legend,
dt,
.persona-photo-kind,
.verified-human-badge,
.type-label {
    font-family: var(--font-sans);
    font-size: var(--text-sm);
    font-style: normal;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: normal;
    text-transform: none;
}

dd,
output,
.type-data,
.private-profile-summary-facts dd,
.dating-about-group dd,
.trip-summary-facts dd {
    font-weight: 400;
}

small,
.type-supporting {
    font-family: var(--font-sans);
    font-size: var(--text-sm);
    font-style: normal;
    font-weight: 400;
    line-height: 1.45;
    letter-spacing: normal;
    text-transform: none;
}

.mobile-primary-nav a,
.type-compact {
    font-family: var(--font-sans);
    font-size: var(--text-xs);
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
}

button,
.button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.type-action,
.ad-action {
    font-family: var(--font-sans);
    font-size: .9375rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
}

input,
select,
textarea,
option,
.type-control {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    font-style: normal;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: normal;
    text-transform: none;
}

code,
pre,
kbd,
samp {
    font-family: var(--font-sans);
    font-size: .9375rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
}

.eyebrow,
.discover-kind,
.persona-profile-kind,
.account-state,
.type-eyebrow {
    font-family: var(--font-sans);
    font-size: var(--text-xs);
    font-style: normal;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ad-brand {
    font-family: var(--font-sans);
    font-size: .78rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ad-copy h1 {
    font-size: clamp(1.35rem, 4vw, 2.1rem);
    line-height: 1.12;
}

.brand-mark,
.account-menu-fallback,
.persona-result-fallback,
.promotion-target-photo > span {
    font-family: var(--font-display);
    font-style: normal;
    font-weight: 700;
    line-height: 1;
}

@media (max-width: 480px) {
    h1,
    .type-page-title {
        font-size: clamp(2rem, 11vw, 2.75rem);
    }

    h2,
    .type-section-title {
        font-size: 1.5rem;
    }
}

.event-accessibility-section > summary {
    font-weight: 600;
}

.activity-title-field > span {
    font-size: 1.17em;
    font-weight: 700;
    line-height: 1.3;
}
