.versai-section {
    width: 100%;
    padding-block: var(--versai-section-space);
    padding-inline: var(--versai-page-gutter);
}

.versai-section--flush {
    padding-inline: 0;
}

.versai-section--cream {
    background: var(--versai-color-cream);
}

.versai-section--surface {
    background: var(--versai-color-surface);
}

.versai-section--dark {
    color: var(--versai-color-white);
    background: var(--versai-color-primary-deep);
}

.versai-reading-width {
    width: min(100%, var(--versai-reading-width));
}

.versai-rounded {
    border-radius: var(--versai-radius-lg);
}

.versai-shadow {
    box-shadow: var(--versai-shadow-md);
}

.versai-icon {
    display: inline-block;
    flex: 0 0 auto;
    vertical-align: -0.125em;
}

.versai-btn-primary {
    --bs-btn-color: var(--versai-color-white);
    --bs-btn-bg: var(--versai-color-primary);
    --bs-btn-border-color: var(--versai-color-primary);
    --bs-btn-hover-color: var(--versai-color-white);
    --bs-btn-hover-bg: var(--versai-color-primary-dark);
    --bs-btn-hover-border-color: var(--versai-color-primary-dark);
    --bs-btn-focus-shadow-rgb: var(--versai-color-accent-rgb);
    --bs-btn-active-color: var(--versai-color-white);
    --bs-btn-active-bg: var(--versai-color-primary-deep);
    --bs-btn-active-border-color: var(--versai-color-primary-deep);
    min-height: 3rem;
    padding: 0.65rem 1.4rem;
    border-radius: var(--versai-radius-pill);
    font-weight: 600;
}

.versai-skip-link {
    position: fixed;
    z-index: 100000;
    top: calc(var(--versai-admin-bar-offset) + 0.75rem);
    right: 0.75rem;
    padding: 0.75rem 1rem;
    color: var(--versai-color-white);
    background: var(--versai-color-primary-deep);
    border-radius: var(--versai-radius-sm);
}