@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700;800&display=swap');

html {
    font-family: 'Sora', system-ui, sans-serif;
}

.htmx-indicator {
    opacity: 0;
    transition: opacity 150ms ease;
}

.htmx-request.htmx-indicator,
.htmx-request .htmx-indicator {
    opacity: 1;
}

/* Keeps page content clear of the fixed bottom nav (4rem tall) and the device home bar */
.affiliate-main {
    padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
}

.bottom-nav {
    padding-bottom: env(safe-area-inset-bottom, 0px);
}

/* ── Partners brand lockup: MagspirePrep wordmark + Partners label ── */
.pbrand {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    color: inherit;
    text-decoration: none;
}
.pbrand .brand-name {
    display: inline-flex;
    align-items: baseline;
    white-space: nowrap;
    line-height: 1;
    font-family: 'Sora', system-ui, sans-serif;
    font-size: 1rem;                 /* 16px, same as the site header */
    font-weight: 700;
    letter-spacing: -.01em;          /* -0.16px at 16px */
}
.pbrand .brand-prep {
    font-size: .75em;                /* 12px, same as the site header */
    font-weight: inherit;
    color: var(--color-primary);
}
.pbrand-div {
    width: 1px;
    height: 1rem;
    background: var(--color-base-300);
}
.pbrand-tag {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .75rem;
    font-weight: 600;
    color: color-mix(in oklab, var(--color-base-content) 65%, transparent);
}

@media (max-width: 360px) {
    .pbrand-div { display: none; }
}