/* Shared Intecrator typography: locally hosted to preserve zero external requests. */
@font-face{
  font-family: 'Avenir Next Cyr';
  src: url('/assets/fonts/AvenirNextCyr-Light.woff2') format('woff2');
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}


@font-face {
  font-family: 'Avenir Next Cyr';
  src: url('/assets/fonts/AvenirNextCyr-Regular.woff2') format('woff2');
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
}


@font-face {
  font-family: 'Avenir Next Cyr';
  src: url('/assets/fonts/AvenirNextCyr-Bold.woff2') format('woff2');
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}
:root{
  --font-sans: 'Avenir Next Cyr', Arial, sans-serif;
  --font-heading: 'Avenir Next Cyr', Arial, sans-serif;
  --font-mono: 'Avenir Next Cyr', Arial, sans-serif;
  --font-body: 'Avenir Next Cyr', Arial, sans-serif;
}
/* Keep the first keyboard destination visible only when it is needed. */
.skip-link{
  position: fixed;
  z-index: 1000;
  top: 14px;
  left: 14px;
  padding: 11px 15px;
  border-radius: 6px;
  background: var(--teal);
  color: var(--navy-deep);
  font-weight: 700;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform var(--transition-fast);
}
.skip-link:focus{ transform: translateY(0); }
/* Headings should look deliberate,
without a second visual voice. */
h1,
h2,
h3,
h4,
.hero-title,
.section-title,
.page-hero h1,
.iv-single-title{
  font-family: var(--font-heading);
}
body{
  text-rendering: optimizeLegibility;
}
/* The original code-like labels read as a product dashboard. A small rule
   keeps the hierarchy while giving the advisory site a quieter,
editorial cue. */
.eyebrow::before{
  content: '';
  width: 22px;
  height: 1px;
  background: currentColor;
  opacity: 0.72;
}
/* The five-item navigation is too wide for an in-between tablet layout.
   Switch to the existing full-screen menu before controls begin to clip. */
@media (max-width: 1140px){
  body.nav-open { overflow: hidden; }

  .header-inner { gap: 14px; }
  .nav-toggle { display: inline-flex; order: 3; }
  .header-right { order: 2; margin-left: auto; }

  .nav {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 4px;
    padding: 110px var(--gutter) 40px;
    overflow-y: auto;
    background:
      linear-gradient(180deg, rgba(6, 18, 32, 0.985), rgba(11, 26, 48, 0.985)),
      radial-gradient(circle at 80% 15%, rgba(0, 201, 167, 0.1), transparent 35%);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transition-fast), visibility var(--transition-fast);
  }

  body.nav-open .nav { opacity: 1; visibility: visible; }

  .nav a {
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    padding: 18px 4px;
    border-bottom: 1px solid var(--line);
    color: var(--text);
    font-size: clamp(20px, 5vw, 28px);
    line-height: 1.2;
    letter-spacing: 0;
  }

  .nav a .nav-text::after { display: none; }
  .nav .nav-cta {
    display: block;
    margin-top: 28px;
    padding: 18px 26px;
    border: 0;
    border-radius: 8px;
    background: var(--teal);
    color: var(--navy-deep);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-align: center;
    text-transform: uppercase;
  }
}
/* Error states should retain the same calm,
high-trust visual language. */
.iv-404{
  display: grid;
  min-height: 78vh;
  place-items: center;
  padding: 160px 0 110px;
  background:
    radial-gradient(circle at 72% 34%, rgba(0, 201, 167, 0.12), transparent 28%),
    linear-gradient(180deg, #061220 0%, var(--navy) 100%);
}
.iv-404__inner{ max-width: 720px; }
.iv-404__code{
  margin: 0 0 -0.14em;
  color: rgba(0, 201, 167, 0.14);
  font-size: clamp(112px, 20vw, 240px);
  font-weight: 800;
  letter-spacing: -0.08em;
  line-height: 0.9;
}
.iv-404 h1{
  position: relative;
  margin: 0;
  font-size: clamp(38px, 6vw, 68px);
  line-height: 1;
}
.iv-404 h1 + p{
  position: relative;
  max-width: 52ch;
  margin-top: 24px;
  color: var(--text-soft);
  font-size: 18px;
}
.iv-404__actions{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
}
@media (max-width: 640px){.iv-404{ min-height: 72vh; padding: 132px 0 82px; }
.iv-404 h1 + p{ font-size: 16px; }
.iv-404__actions{ display: grid; }
.iv-404__actions .btn{ justify-content: center; }

}
