/* Navigation refinement. Preserve the original single-row proportions. */
.site-header, .r-header { position: relative; top: auto; }
.site-header { box-shadow: 0 5px 18px rgba(9, 19, 28, .13); }
.r-header { box-shadow: 0 5px 18px rgba(9, 19, 28, .13); }

/* An active section/page gets a restrained cool underline, with no size shift. */
.site-header .site-nav a:not(.nav-cta)[aria-current="true"] { color: #f7fafb; }
.site-header .site-nav a:not(.nav-cta)[aria-current="true"]::after {
  height: 2px; background: #b2c6d2;
}
.r-header .r-nav a:not(.r-nav-cta) { position: relative; }
.r-header .r-nav a:not(.r-nav-cta)::after {
  content: ""; position: absolute; bottom: 2px; left: 0; right: 0;
  height: 2px; background: #b2c6d2;
  transform: scaleX(0); transform-origin: left;
  transition: transform .2s ease;
}
.r-header .r-nav a:not(.r-nav-cta):hover,
.r-header .r-nav a:not(.r-nav-cta)[aria-current="page"] { color: #f7fafb; }
.r-header .r-nav a:not(.r-nav-cta):hover::after,
.r-header .r-nav a:not(.r-nav-cta)[aria-current="page"]::after { transform: scaleX(1); }
.r-header .r-nav .r-nav-cta[aria-current="page"] {
  background: #dce7eb; color: #142636;
}
.site-header :focus-visible, .r-header :focus-visible {
  outline: 2px solid #dce9f0; outline-offset: 3px;
}

/* With headers in document flow, section links land beside their headings. */
html { scroll-padding-top: 20px; }
main section[id], #for-agents, #contact, #team, #resources, #podcast,
#owen, #owen-conversation { scroll-margin-top: 24px; }

/* At intermediate widths, use the existing working menu instead of
   squeezing every REAL tool or main-site link into one row. */
@media (min-width: 1221px) and (max-width: 1400px) {
  .site-header { height: 86px; }
  .site-header .nav-inner { width: calc(100% - 48px); }
  .site-header .brand { width: 300px; max-width: calc(100% - 80px); }
  .site-header .menu-button { display: block; width: 46px; height: 46px;
    flex: none; padding: 12px; border: 1px solid #7a8695; background: #ffffff06; }
  .site-header .site-nav, .r-header .r-nav {
    position: absolute; inset: 100% 0 auto; display: none;
    flex-direction: column; align-items: stretch; gap: 0;
    max-height: calc(100dvh - 88px); overflow-y: auto;
    padding: 16px 24px 24px; background: #111e2d;
    border-top: 1px solid #536173; box-shadow: 0 20px 30px #0003;
  }
  .site-header .site-nav.is-open, .r-header .r-nav.r-open { display: flex; }
  .site-header .site-nav a, .r-header .r-nav a {
    min-height: 48px; padding: 12px 4px; font-size: 14px;
    border-bottom: 1px solid #ffffff21; justify-content: flex-start;
  }
  .site-header .site-nav a::after, .r-header .r-nav a::after { display: none; }
  .site-header .site-nav .nav-cta, .r-header .r-nav .r-nav-cta {
    margin: 14px 0 0; padding: 12px 15px; justify-content: space-between;
  }
  .r-header .r-menu { display: block; }
  .r-header .r-header-inner { min-height: 88px; }
  .site-header .menu-button[aria-expanded="true"] > span:nth-child(1),
  .r-header .r-menu[aria-expanded="true"] > span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .site-header .menu-button[aria-expanded="true"] > span:nth-child(2),
  .r-header .r-menu[aria-expanded="true"] > span:nth-child(2) { opacity: 0; }
  .site-header .menu-button[aria-expanded="true"] > span:nth-child(3),
  .r-header .r-menu[aria-expanded="true"] > span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
}

/* Mobile active state remains visible where the desktop underline is hidden. */
@media (max-width: 1400px) {
  .site-header .site-nav a:not(.nav-cta)[aria-current="true"],
  .r-header .r-nav a:not(.r-nav-cta)[aria-current="page"] {
    padding-left: 14px; background: rgba(191, 213, 224, .13);
    box-shadow: inset 2px 0 #b2c6d2;
  }
  .r-header .r-nav a:not(.r-nav-cta)::after { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header .site-nav a::after, .r-header .r-nav a::after { transition: none; }
}

/* Ilja has a dedicated page in the primary navigation. */
.site-header .site-nav a:not(.nav-cta)[aria-current="page"]{color:#f7fafb}
.site-header .site-nav a:not(.nav-cta)[aria-current="page"]::after{transform:scaleX(1)}
@media(max-width:1400px){.site-header .site-nav a:not(.nav-cta)[aria-current="page"]{padding-left:14px;background:rgba(191,213,224,.13);box-shadow:inset 2px 0 #b2c6d2}}
