/*
 * Vastkind Experience Foundation v1
 * BR1 slice 01: shared focus and reduced-motion behavior.
 * BR1 slice 02: shared shell typography and core-color semantic roles.
 * BR1 slice 03: shared Button and Card semantic-role adapters.
 */

@font-face {
    font-family: "Manrope";
    src: url("../fonts/vastkind-home/manrope-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Manrope";
    src: url("../fonts/vastkind-home/manrope-latin-600-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "Newsreader";
    src: url("../fonts/vastkind-home/newsreader-latin-500-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}

:root {
    --vk-experience-focus-color: #6d38ff;
    --vk-experience-focus-width: 2px;
    --vk-experience-focus-offset: 3px;
    --vk-experience-reduced-motion-duration: 0.01ms;
    --vk-experience-type-display: "Newsreader", Georgia, serif;
    --vk-experience-type-body: "Manrope", Arial, sans-serif;
    --vk-experience-type-technical: "IBM Plex Mono", monospace;
    --vk-experience-color-stage: #000917;
    --vk-experience-color-page: #f4ecdb;
    --vk-experience-color-page-raised: #f6ebd9;
    --vk-experience-color-raised-dark: #07111f;
    --vk-experience-color-text-on-dark: #f3eadb;
    --vk-experience-color-muted-on-dark: #aab4ca;
    --vk-experience-color-text-on-light: #07111f;
    --vk-experience-color-muted-on-light: #4a5260;
    --vk-experience-color-border-on-dark: #40516f;
    --vk-experience-color-action-primary: #5b50d6;
    --vk-experience-color-live-verified: #65e8c3;
    --vk-experience-button-min-target: 44px;
    --vk-experience-button-touch-target: 48px;
    --vk-experience-button-type: var(--vk-experience-type-body);
    --vk-experience-button-weight: 600;
    --vk-experience-card-type-body: var(--vk-experience-type-body);
    --vk-experience-card-type-display: var(--vk-experience-type-display);
    --vk-experience-card-type-technical: var(--vk-experience-type-technical);
    --vk-experience-card-surface: var(--vk-experience-color-page-raised);
    --vk-experience-card-text: var(--vk-experience-color-text-on-light);
    --vk-experience-card-muted: var(--vk-experience-color-muted-on-light);
    --vk-experience-card-border: var(--vk-experience-color-border-on-dark);
}

:where(.header, .mobile-menu-container, .footer, .vk-home-header, .vk-home-footer) {
    --vk-experience-shell-stage: var(--vk-experience-color-stage);
    --vk-experience-shell-surface: var(--vk-experience-color-raised-dark);
    --vk-experience-shell-text: var(--vk-experience-color-text-on-dark);
    --vk-experience-shell-text-muted: var(--vk-experience-color-muted-on-dark);
    --vk-experience-shell-border: var(--vk-experience-color-border-on-dark);
    --vk-experience-shell-action: var(--vk-experience-color-action-primary);
    --vk-experience-shell-live: var(--vk-experience-color-live-verified);
    --vk-experience-shell-focus: var(--vk-experience-focus-color);
    --vk-experience-shell-type-body: var(--vk-experience-type-body);
    --vk-experience-shell-type-display: var(--vk-experience-type-display);
    --vk-experience-shell-type-technical: var(--vk-experience-type-technical);
    font-family: var(--vk-experience-shell-type-body);
}

:where(.header, .mobile-menu-container, .vk-home-header) {
    --vk-shell-bg: var(--vk-experience-shell-stage);
    --vk-shell-surface: var(--vk-experience-shell-surface);
    --vk-shell-text: var(--vk-experience-shell-text);
    --vk-shell-text-muted: var(--vk-experience-shell-text-muted);
    --vk-shell-border: var(--vk-experience-shell-border);
    --vk-shell-accent: var(--vk-experience-shell-live);
    --vk-shell-focus: var(--vk-experience-shell-focus);
    --vk-shell-type-body: var(--vk-experience-shell-type-body);
    --vk-shell-type-label: var(--vk-experience-shell-type-technical);
}

:where(.footer, .vk-home-footer) {
    --vk-footer-shell-bg: var(--vk-experience-shell-stage);
    --vk-footer-shell-surface: var(--vk-experience-shell-surface);
    --vk-footer-shell-panel: var(--vk-experience-shell-stage);
    --vk-footer-shell-text: var(--vk-experience-shell-text);
    --vk-footer-shell-text-muted: var(--vk-experience-shell-text-muted);
    --vk-footer-shell-border: var(--vk-experience-shell-border);
    --vk-footer-shell-accent: var(--vk-experience-shell-live);
    --vk-footer-shell-type-body: var(--vk-experience-shell-type-body);
    --vk-footer-shell-type-label: var(--vk-experience-shell-type-technical);
}

.footer {
    --font-family-body: var(--vk-experience-shell-type-body);
    --font-family-titles: var(--vk-experience-shell-type-display);
}

:is(.header, .footer, .vk-home-header, .vk-home-footer)
    :is(a, button, input, select, textarea, summary, [role="button"], [tabindex]):focus-visible,
:is(
        .vk-home-button--primary,
        .vk-briefing__form button,
        .btn,
        .tier-card__btn,
        .vk-home-button--secondary,
        .vk-ledger-button,
        .vk-horizon__cta,
        .vk-pressure-card__link,
        .post-card-small__heading-link
    ):focus-visible,
:is(
        .vk-ledger-feature,
        .post-card-big-primary,
        .vk-v212-briefing__lead,
        .vk-ledger-secondary,
        .post-card-default,
        .post-card-medium,
        .post-card-big-secondary,
        .post-card-slide,
        .post-card-small,
        .vk-v212-briefing__item,
        .vk-pressure-card,
        .vk-v214-evidence-card,
        .vk-dossier-essential-card,
        .vk-dossier-corridor-card,
        .vk-briefing__card,
        .tier-card
    )
    :is(a, button):focus-visible {
    outline: var(--vk-experience-focus-width) solid var(--vk-experience-focus-color);
    outline-offset: var(--vk-experience-focus-offset);
}

:is(.vk-home-button--primary, .vk-briefing__form button, .btn, .tier-card__btn) {
    --vk-button-role: primary;
    --vk-button-surface: var(--vk-experience-color-action-primary);
    --vk-button-text: var(--vk-experience-color-text-on-dark);
    --vk-button-border: var(--vk-experience-color-action-primary);
}

.vk-home-button--secondary {
    --vk-button-role: secondary;
    --vk-button-surface: transparent;
    --vk-button-text: var(--vk-experience-color-text-on-dark);
    --vk-button-border: var(--vk-experience-color-border-on-dark);
}

:is(.vk-ledger-button, .vk-horizon__cta) {
    --vk-button-role: quiet;
    --vk-button-surface: transparent;
    --vk-button-text: currentColor;
    --vk-button-border: currentColor;
}

:is(.vk-pressure-card__link, .post-card-small__heading-link) {
    --vk-button-role: textLink;
    --vk-button-surface: transparent;
    --vk-button-text: currentColor;
    --vk-button-border: transparent;
    font-family: var(--vk-experience-button-type);
    font-weight: var(--vk-experience-button-weight);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
}

:is(
        .vk-home-button--primary,
        .vk-briefing__form button,
        .btn,
        .tier-card__btn,
        .vk-home-button--secondary,
        .vk-ledger-button,
        .vk-horizon__cta
    ) {
    min-block-size: var(--vk-experience-button-min-target);
    font-family: var(--vk-experience-button-type);
    font-weight: var(--vk-experience-button-weight);
}

:is(
        .vk-home-button--primary,
        .vk-briefing__form button,
        .btn,
        .tier-card__btn,
        .vk-home-button--secondary
    ) {
    background-color: var(--vk-button-surface);
    border-color: var(--vk-button-border);
    color: var(--vk-button-text);
}

:is(.vk-ledger-feature, .post-card-big-primary, .vk-v212-briefing__lead) {
    --vk-card-role: lead;
    --vk-card-type: var(--vk-experience-card-type-display);
    --vk-card-surface: transparent;
    --vk-card-border: var(--vk-experience-color-border-on-dark);
    --vk-card-accent: #e7b56e;
    --vk-card-spacing: 32px;
    --vk-card-media-reserve: 0px;
}

:is(
        .vk-ledger-secondary,
        .post-card-default,
        .post-card-medium,
        .post-card-big-secondary,
        .post-card-slide
    ) {
    --vk-card-role: story;
    --vk-card-type: var(--vk-experience-card-type-body);
    --vk-card-surface: transparent;
    --vk-card-border: var(--vk-experience-color-border-on-dark);
    --vk-card-accent: #e7b56e;
    --vk-card-spacing: 24px;
    --vk-card-media-reserve: 0px;
}

:is(.post-card-small, .vk-v212-briefing__item) {
    --vk-card-role: compactLedger;
    --vk-card-type: var(--vk-experience-card-type-body);
    --vk-card-surface: transparent;
    --vk-card-border: var(--vk-experience-color-border-on-dark);
    --vk-card-accent: var(--vk-experience-color-live-verified);
    --vk-card-spacing: 16px;
    --vk-card-media-reserve: 0px;
}

:is(
        .vk-pressure-card,
        .vk-v214-evidence-card,
        .vk-dossier-essential-card,
        .vk-dossier-corridor-card
    ) {
    --vk-card-role: evidenceSignal;
    --vk-card-type: var(--vk-experience-card-type-technical);
    --vk-card-surface: transparent;
    --vk-card-border: var(--vk-experience-color-border-on-dark);
    --vk-card-accent: #ff8a62;
    --vk-card-spacing: 24px;
    --vk-card-media-reserve: 0px;
}

:is(.vk-briefing__card, .tier-card) {
    --vk-card-role: cta;
    --vk-card-type: var(--vk-experience-card-type-body);
    --vk-card-surface: var(--vk-experience-card-surface);
    --vk-card-border: var(--vk-experience-color-action-primary);
    --vk-card-accent: #9865ef;
    --vk-card-spacing: 32px;
    --vk-card-media-reserve: 0px;
}

:is(
        .vk-ledger-feature,
        .post-card-big-primary,
        .vk-v212-briefing__lead,
        .vk-ledger-secondary,
        .post-card-default,
        .post-card-medium,
        .post-card-big-secondary,
        .post-card-slide,
        .post-card-small,
        .vk-v212-briefing__item,
        .vk-pressure-card,
        .vk-v214-evidence-card,
        .vk-dossier-essential-card,
        .vk-dossier-corridor-card,
        .vk-briefing__card,
        .tier-card
    ) {
    --vk-card-text: var(--vk-experience-card-text);
    --vk-card-muted: var(--vk-experience-card-muted);
    border-color: var(--vk-card-border);
    font-family: var(--vk-experience-card-type-body);
}

@media (prefers-reduced-motion: reduce) {
    :where(.header, .footer, .vk-home-header, .vk-home-footer, .vk-home-header__mobile-menu) {
        scroll-behavior: auto;
    }

    :where(.header, .footer, .vk-home-header, .vk-home-footer)
        :where(a, button, input, select, textarea, summary, [role="button"], [tabindex], [aria-expanded], [hidden]),
    :is(
            .vk-home-button--primary,
            .vk-briefing__form button,
            .btn,
            .tier-card__btn,
            .vk-home-button--secondary,
            .vk-ledger-button,
            .vk-horizon__cta,
            .vk-pressure-card__link,
            .post-card-small__heading-link,
            .vk-ledger-feature,
            .post-card-big-primary,
            .vk-v212-briefing__lead,
            .vk-ledger-secondary,
            .post-card-default,
            .post-card-medium,
            .post-card-big-secondary,
            .post-card-slide,
            .post-card-small,
            .vk-v212-briefing__item,
            .vk-pressure-card,
            .vk-v214-evidence-card,
            .vk-dossier-essential-card,
            .vk-dossier-corridor-card,
            .vk-briefing__card,
            .tier-card
        ) {
        animation-duration: var(--vk-experience-reduced-motion-duration);
        animation-iteration-count: 1;
        transition-delay: 0ms;
        transition-duration: var(--vk-experience-reduced-motion-duration);
        scroll-behavior: auto;
    }
}

@media (forced-colors: active) {
    :is(.header, .footer, .vk-home-header, .vk-home-footer)
        :is(a, button, input, select, textarea, summary, [role="button"], [tabindex]):focus-visible {
        outline-color: Highlight;
    }
}