/* Vika Consulting brand layer (30.10.2026, Yaroslav chose the wordmark variant and «a light theme right away»).
   Published on every page by scripts/site/fix-brand.mjs as assets/css/brand-vk.perf-<hash>.css, after
   motion.css and before the theme overrides of fix-theme.mjs (theme-sky). What lives here:
   §1 Jost (OFL, cyrillic) for headings, eyebrows and the kicker; Manrope stays for text and buttons.
   §2 Type scale: Jost has a larger x-height than Cormorant, so the headings get smaller and heavier.
   §3 The wordmark in the header (deep blue) and footer (white), replacing the 3D NEXO picture.
   §4 Light sky surfaces: page variables, header, quiz blocks, cards.
   §5 Aurora background: two fixed layers of soft sky-blue blobs; motion.css §9 drifts them only on html.mx
   (no reduced-motion), without JS the same gradient stays still. Only transform animates, no filters.
   Colours here are already the final sky blues (hue 207–222), outside the teal range fix-theme recolours. */

/* §1 Fonts */
@font-face{font-family:Jost;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-400-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Jost;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Jost;font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-400-italic-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-400-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Jost;font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-400-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Jost;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jost-500-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jost-500-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Jost;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jost-500-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Jost;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/jost-600-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/jost-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Jost;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/jost-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* §2 Type scale */
:root{--font-display:"Jost","Manrope",system-ui,-apple-system,sans-serif;--vk-deep:#1d4f8f;--vk-sky:#3d92dc;--vk-sky-light:#a9d4f7;--vk-ink:#17304d;--vk-text:#2c4059;--vk-muted:#53657b}
html body[data-design=nexo]{--font-display:"Jost","Manrope",system-ui,-apple-system,sans-serif}
h1,h2,h3,h4,.serif{font-family:var(--font-display);font-weight:500;letter-spacing:-.015em;line-height:1.12;text-wrap:balance}
h1{font-weight:600;letter-spacing:-.02em;line-height:1.08}
html body[data-design=nexo] h1{font-size:clamp(32px,1.4rem + 2.9vw,56px)}
html body[data-page=home] .nx-hero h1{font-size:clamp(34px,1.5rem + 3.2vw,58px);margin-bottom:22px}
html body[data-design=nexo] .page-hero h1{font-size:clamp(32px,1.4rem + 2.9vw,54px);line-height:1.1}
html body[data-design=nexo] .article-hero h1{font-size:clamp(28px,1.3rem + 2.4vw,46px);line-height:1.14;letter-spacing:-.015em}
html body[data-design=nexo] h2{font-size:clamp(26px,1.2rem + 1.7vw,38px)}
html body[data-design=nexo] :is(.section-heading,.nx-head) h2{font-size:clamp(26px,1.2rem + 1.9vw,40px)}
html body[data-design=nexo] .nx-offer-copy h2{font-size:clamp(28px,1.3rem + 2.1vw,44px)}
html body[data-design=nexo] .nx-about-copy h2{font-size:clamp(26px,1.2rem + 1.7vw,38px)}
html body[data-design=nexo] :is(.article-body,.service-copy,.rm-body,.faq-list,.calc-page) h2{font-size:clamp(23px,1.1rem + 1.2vw,30px);line-height:1.22;letter-spacing:-.012em}
html body[data-design=nexo] h3{font-size:clamp(19px,1rem + .6vw,23px);line-height:1.3;letter-spacing:-.008em}
html body[data-design=nexo] .nx-person h3{font-size:clamp(21px,1.1rem + .8vw,26px)}
html body[data-design=nexo] :is(.eyebrow,.nx-kicker,.nx-quiz-meta,.nx-step-no,.footer-col h2){font-family:var(--font-display)}
html body[data-design=nexo] .eyebrow{font-size:12px;font-weight:500;letter-spacing:.14em}
/* eyebrows on light sections: 5.6:1 on the page background (the recoloured gold gave 4.5); dark bands keep theirs */
html body[data-design=nexo] .eyebrow:not(.nx-how *):not(.nx-en-dark *):not(.process *):not(.nx-en-process *):not(.v-cta *):not(.nx-en-quiz-band *):not(.site-footer *){color:#1d5f9a}
html body[data-page=home] .nx-kicker{font-size:14px;font-weight:500;letter-spacing:.03em}
html body[data-design=nexo] .nx-step-no{font-weight:500;letter-spacing:.04em}
html body[data-design=nexo] .footer-col h2{font-size:15px;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
html body[data-design=nexo] .nx-kinds-list strong{font-family:var(--font-display);font-weight:500;font-size:21px;letter-spacing:-.01em}
/* text links in articles: a quiet underline that thickens on hover, no colour jump */
html body[data-design=nexo] :is(.article-body,.service-copy,.rm-body,.re-guide,.faq-item div) p a:not(.btn){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--vk-sky)}
html body[data-design=nexo] :is(.article-body,.service-copy,.rm-body,.re-guide,.faq-item div) p a:not(.btn):hover{text-decoration-thickness:2px}

/* §3 Wordmark */
html body .brand-logo-glass{width:auto;height:auto;overflow:visible;display:inline-flex;align-items:center}
html body .brand-logo-glass img{position:static;transform:none;width:auto;max-width:none;height:30px;filter:none}
html body .site-header .brand-logo-glass img{height:30px}
html body .footer-brand .brand-logo-glass img{height:32px;filter:none}
@media (max-width:760px){html body .site-header .brand-logo-glass img{height:26px}html body .footer-brand .brand-logo-glass img{height:28px}}
@media (max-width:400px){html body .site-header .brand-logo-glass img{height:23px}}
@media (max-width:370px){html body .brand{zoom:1}}
.mx-curtain{background:#f3f8fe}
.mx-curtain img{width:min(300px,64vw)}
.mx-curtain:after{background:var(--vk-sky)}
html body .mx .reading-progress{background:var(--vk-sky)}

/* §4 Light sky surfaces */
html body[data-design=nexo]{--bg:#f4f8fc;--bg-2:#e8f0f8;--sky:#d9e8f8;--line:#cfdcea;--line-soft:#e2ebf4;--rx-mist:#f4f8fc;--rx-fog:#ebf2fa;--snow-1:#e6eefa;--snow-2:#eef4fb;--snow-3:#f6f9fd;background:transparent}
html{background:#fff}
html body[data-design=nexo] .site-header{background:rgba(246,249,254,.78)}
@supports not (backdrop-filter:blur(1px)){html body[data-design=nexo] .site-header{background:#f6f9fe}}
@media (max-width:760px){html body[data-design=nexo] .site-header.mx-scrolled{background:rgba(246,249,254,.9)!important}}
html body[data-design=nexo] .main-nav.open{background:rgba(246,249,254,.97)}
html body[data-design=nexo] .nx-quiz-invite{background:#edf3fb}
html body[data-design=nexo] .nx-quiz-prep{background:#f6f9fd}
html body[data-design=nexo] .nx-end-actions,html body[data-design=nexo] .quiz-result-note{background:#eef4fb}
html body[data-design=nexo] .quiz-options label:has(input:checked){background:#deeafa}
html body[data-design=nexo] :is(.btn.secondary,.quiz-switch button[aria-pressed=false]){background:linear-gradient(145deg,#ffffffd9,#e1ecf9b3);border-color:#9ab8d6}
html body[data-design=nexo] .nx-mobile-actions a:first-child{background:linear-gradient(145deg,#ffffffa6,#dbe8f780)!important}
html body[data-design=nexo] .nx-social-dock :is(button,a){background:#e8f0fbb3}
html body[data-design=nexo] .nx-quote{background:linear-gradient(160deg,#e9f1fb,#f6f9fd 80%)}
html body[data-design=nexo] .v-cta:not(.nx-cta){background:linear-gradient(180deg,var(--bg-2),#dce8f6)}
html body[data-page=home] .nx-offer-panel{background:linear-gradient(120deg,#ffffffb8,#dbe8f766)}
html body[data-page=home] .nx-art:before{background:#dbe8f74d}
html body[data-page=home] .nx-portrait{background:#d8e5f3}
html body[data-page=home] :is(.nx-service-image,.nx-about-photo){background:#e6eef8}
html body[data-design=nexo] .nx-kinds-list a,html body[data-design=nexo] .dnv-callout{background:rgba(255,255,255,.72);border-color:#d3e0ee}
html body[data-design=nexo] .nx-kinds-list a:hover{border-color:var(--vk-sky)}
html body .site-footer .brand img{filter:none}
html body[data-design=nexo] .site-footer{background:linear-gradient(135deg,#4a95dc,#5b9fe0 60%,#66a6e3)}

/* §5 Aurora background */
html body[data-design=nexo]:before{background:
  radial-gradient(ellipse 62% 48% at 82% -6%,#cfe3fb 0%,rgba(207,227,251,0) 70%),
  radial-gradient(ellipse 48% 40% at 2% 12%,#e2ecfb 0%,rgba(226,236,251,0) 70%),
  radial-gradient(ellipse 44% 34% at 58% 38%,#dfe7fb 0%,rgba(223,231,251,0) 70%),
  linear-gradient(180deg,#e9f1fb 0%,#f1f6fc 40%,#f7fafd 70%,#fff 100%)}
html body[data-design=nexo]:after{inset:-6%;opacity:1;background:
  radial-gradient(ellipse 50% 38% at 22% 6%,#d4e7fb 0%,rgba(212,231,251,0) 70%),
  radial-gradient(ellipse 46% 34% at 96% 46%,#e7edfb 0%,rgba(231,237,251,0) 70%),
  radial-gradient(ellipse 40% 30% at 40% 70%,#eef3fc 0%,rgba(238,243,252,0) 70%),
  linear-gradient(180deg,rgba(255,255,255,0) 55%,#fff 100%)}
.mx body[data-design=nexo]:before{animation:vk-drift-a 34s ease-in-out infinite alternate}
.mx body[data-design=nexo]:after{animation:vk-drift-b 46s ease-in-out -12s infinite alternate}
@keyframes vk-drift-a{from{transform:translate3d(-2.5%,-1.5%,0) scale(1.05) rotate(-.6deg)}to{transform:translate3d(2%,2%,0) scale(1.12) rotate(.6deg)}}
@keyframes vk-drift-b{from{transform:translate3d(2%,1.5%,0) scale(1.08) rotate(.8deg)}to{transform:translate3d(-2.5%,-2%,0) scale(1.14) rotate(-.8deg)}}
@media (prefers-reduced-motion:reduce){html body[data-design=nexo]:before,html body[data-design=nexo]:after{animation:none!important}}

/* §6 Text on azure fills (30.10 evening, Yaroslav: buttons and the solid dark blocks in azure #5b9fe0). White on
   #5b9fe0 is 3.1:1 and on the darker band #4a95dc 3.6:1: enough only for large text (24 px, or 19 px bold), so
   small text on azure is dark ink #0b1c36 (5.5–6:1); headings and bold step titles stay white. Nothing here is
   teal or gold, so fix-theme leaves it alone. */
:root{--vk-on-azure:#0b1c36}
html body[data-design=nexo] .btn:not(.secondary):not(.btn-ghost):not(.quiz-switch *){color:var(--vk-on-azure)}
html body[data-design=nexo] .btn:not(.secondary):not(.btn-ghost):hover{color:var(--vk-on-azure)}
html body .site-header .header-cta,html body .site-header .header-cta:hover{color:var(--vk-on-azure)}
html body[data-design=nexo] .nx-mobile-actions a:last-child{color:var(--vk-on-azure)!important}
html body .mx-side a{color:var(--vk-on-azure)}
html body .nx-lang-switch a[aria-current=page]{color:var(--vk-on-azure)}
html body .nxa-open,html body .nxa-open svg{color:var(--vk-on-azure)}
html body .nxa-head,html body .nxa-head *{color:var(--vk-on-azure)}
html body .nxa-send{color:var(--vk-on-azure)}
html body[data-design=nexo] :is(.nx-how,.nx-en-dark,.nx-en-process,.process) :is(p,li,.eyebrow,.tiny,small,a:not(.btn)){color:var(--vk-on-azure)}
html body[data-design=nexo] :is(.nx-how,.nx-en-dark,.nx-en-process,.process) :is(h2,h3){color:#fff}
html body[data-design=nexo] :is(.nx-how,.nx-en-dark,.nx-en-process,.process) .eyebrow:before{background:var(--vk-on-azure)}
html body[data-design=nexo] .nx-step-no{color:rgba(255,255,255,.85)!important}
html body[data-design=nexo] .nx-steps li:before{background:rgba(255,255,255,.55)}
html body[data-design=nexo] .v-cta :is(p,li,.eyebrow,.tiny){color:var(--vk-on-azure)}
html body[data-design=nexo] .v-cta.nx-cta h2{color:#fff}
/* the CTA band button is a deeper blue (the bundle's cyan accent, 5.6:1 with white) and keeps white text */
html body[data-design=nexo] .v-cta .btn:not(.secondary):not(.btn-ghost),html body[data-design=nexo] .v-cta .btn:not(.secondary):not(.btn-ghost):hover{color:#fff}
html body[data-design=nexo] .site-footer,html body[data-design=nexo] .site-footer :is(p,a,span,li,small,.tiny,.footer-contact,.footer-contact span,.footer-col a,.social-row a,.social-placeholder){color:var(--vk-on-azure)}
html body[data-design=nexo] .site-footer .footer-col h2{color:var(--vk-on-azure)}
html body[data-design=nexo] .site-footer .footer-slogan{color:#fff}
html body[data-design=nexo] .site-footer .footer-col a:hover{color:#fff}
html body[data-design=nexo] .site-footer :is(.social-row,.social-placeholder) svg{stroke:currentColor}
html body[data-design=nexo] .site-footer{border-top-color:transparent}
html body .mx .site-footer .footer-col a{background-image:linear-gradient(currentColor,currentColor)}
html body .skip{color:var(--vk-on-azure)}
/* links that used the gold accent as text: a readable sky-blue (6:1 on the page background) */
html body[data-design=nexo] :is(.gold-link,.text-link){color:#1d5f9a}
