/* Korven motion layer, every page (17 Oct 2026). Navy and gold only, no libraries; js/motion.js adds the classes.
   1. Smooth page changes: pages cross-fade instead of flashing white, and the menu stays put.
   2. Section labels sit in gold brackets that open as they come into view.
   3. Headings rise in word by word.
   4. Fade-ins run on the browser's own scroll engine where supported (smoother on phones).
   5. Homepage: the service icons draw themselves. (Gold thread removed 17 Oct at the owner's request.)
   Reduced motion: everything shows in its final state. */

/* ---------- 1. Page changes ---------- */
@view-transition{navigation:auto}
#mainNav{view-transition-name:kv-nav}
::view-transition-old(root),::view-transition-new(root){animation-duration:.26s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-group(kv-nav){animation:none}
::view-transition-old(kv-nav){display:none}
::view-transition-new(kv-nav){animation:none}

/* ---------- 2. Gold bracket labels (pseudo-elements, so they survive scripts that rewrite the label text) ---------- */
.kv-ey .kv-ey-line{display:none!important}
.kv-ey.kv-ey::before,.kv-ey.kv-ey::after{display:inline-block;flex:none;width:auto;height:auto;background:none;font-weight:300;font-size:1.3em;line-height:.8;letter-spacing:0;color:rgba(212,168,67,.8);transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .8s cubic-bezier(.22,1,.36,1)}
.kv-ey.kv-ey::before{content:"["}
.kv-ey.kv-ey::after{content:"]";margin-left:-.26em}
.kv-ey.kv-ey:not(.open)::before{transform:translateX(.7em);opacity:0}
.kv-ey.kv-ey:not(.open)::after{transform:translateX(-.7em);opacity:0}

/* ---------- 3. Headings word by word ---------- */
.kv-w{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em .12em .2em;margin:-.04em -.12em -.2em}
.kv-w>span{display:inline-block;transform:translateY(112%);transition:transform .85s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--i, 0) * 45ms)}
.kv-wr.in .kv-w>span{transform:none}
/* the metallic gold on emphasis words moves onto each word, so it survives the split */
h2.kv-wr .kv-mg{background:none}
h2.kv-wr .kv-mg .kv-w>span{background:linear-gradient(135deg,#8F6D28 0%,#C1953C 28%,#EFD491 52%,#D4A843 70%,#9D782D 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ---------- 4. Scroll-driven fade-ins ---------- */
@keyframes kvSdRise{from{opacity:0;translate:0 26px}to{opacity:1;translate:none}}
@supports (animation-timeline:view()){
  @media(prefers-reduced-motion:no-preference){
    .kv-sd{animation:kvSdRise linear both;animation-timeline:view();animation-range:entry 0% entry calc(170px + var(--sd, 0) * 36px)}
  }
}

/* ---------- 5b. Line-drawn service icons (homepage cards) ---------- */
.kv-ico{position:absolute;top:26px;right:22px;width:34px;height:34px;fill:none;stroke:#D4A843;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;opacity:.9;pointer-events:none;overflow:visible}
.kv-ico>*{stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s cubic-bezier(.22,1,.36,1)}
.kv-ico>*:nth-child(2){transition-delay:.18s}.kv-ico>*:nth-child(3){transition-delay:.36s}.kv-ico>*:nth-child(4){transition-delay:.5s}.kv-ico>*:nth-child(5){transition-delay:.62s}
.kv-ico.on>*{stroke-dashoffset:0}
.kv-svt-audit .kv-ico{stroke:#07172a}
@media(max-width:560px){.kv-ico{top:20px;right:18px;width:28px;height:28px}}

@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .kv-ey.kv-ey::before,.kv-ey.kv-ey::after,.kv-w>span,.kv-ico>*{transition:none}
  .kv-ey.kv-ey:not(.open)::before,.kv-ey.kv-ey:not(.open)::after{transform:none;opacity:1}
  .kv-w>span{transform:none}
  .kv-ico>*{stroke-dashoffset:0}
}

/* ---------- 6. Polish from the oryzo.ai study (17 Oct) ---------- */
/* rolling button labels: on hover the label rolls up and an identical copy rolls in (desktop pointers only; motion.js adds the spans) */
.kv-roll-w{position:relative;display:inline-block;overflow:hidden;vertical-align:bottom}
.kv-roll-a{display:inline-block}
.kv-roll-b{position:absolute;left:0;top:100%;display:inline-block;white-space:nowrap}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .kv-roll-a,.kv-roll-b{transition:transform .4s cubic-bezier(.22,1,.36,1)}
  .kv-rolls:hover .kv-roll-a,.kv-rolls:hover .kv-roll-b,.kv-rolls:focus-visible .kv-roll-a,.kv-rolls:focus-visible .kv-roll-b{transform:translateY(-100%)}
}
/* formula notes beside the finance instruments */
.kv-formula{display:flex;flex-direction:column;gap:3px;margin-top:14px}
.kv-formula .k{font-family:Outfit,sans-serif;font-size:10px;font-weight:600;letter-spacing:.24em;color:rgba(255,255,255,.55)}
.kv-formula .f{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(17px,1.6vw,20px);line-height:1.3;color:#D4A843;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}

/* ---------- 7. Menu fits at laptop widths (17 Oct) ---------- */
/* 981-1100px: logo + links + button were ~45px wider than the bar, so the button ran under the scrollbar */
@media (min-width:981px) and (max-width:1100px){
  #mainNav{padding-left:20px;padding-right:20px}
  #mainNav .nav-links>li>a,#mainNav #svcDropBtn{padding:10px 8px}
  #mainNav .nav-audit{padding-left:16px;padding-right:16px;margin-left:6px}
}