/* Korven site.css: built by build-site-css.ps1 from motion.css + system.css + repairs.css. Edit those files, then rebuild. */
/* ===== motion.css ===== */
/* 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%)}
  /* the 2px hover lift moved the button out from under the cursor at its bottom edge, so hover flickered and the roll froze half-way (owner screenshot 17 Oct): rolling buttons stay put and keep their glow */
  a.kv-rolls:hover,a.kv-rolls:focus-visible{transform:none}
}
/* 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}
}
/* ===== system.css ===== */
/* Korven page system (17 Oct 2026). One set of sizes, spacing and placement for every page, so sections line up and read the same
   everywhere. Navy/gold, Cormorant Garamond headings, Outfit text. Pages use these classes instead of their own inline sizes.
   1. Tokens   2. Sections and container   3. Type   4. Buttons   5. Proof strip   6. Cards and steps   7. Next-step block
   8. Breadcrumbs   9. Sticky phone bar   10. Smooth scroll (Lenis, desktop wheel only) */

/* ---------- 1. Tokens ---------- */
:root{
  --gut:clamp(20px,8.1vw,160px);
  --kv-navy:#07172a; --kv-navy-2:#0d2138; --kv-navy-3:#112a46; --kv-gold:#d4a843; --kv-gold-2:#efd491;
  --kv-ink:#ffffff; --kv-ink-2:rgba(255,255,255,.86); --kv-ink-3:rgba(255,255,255,.7); --kv-line:rgba(212,168,67,.14);
  --kv-wrap:1200px; --kv-gutter:var(--gut,clamp(20px,5vw,56px));
  --kv-sec:clamp(64px,8vw,112px); --kv-sec-tight:clamp(36px,4.5vw,52px);
  --kv-h1:clamp(42px,6.1vw,88px); --kv-h2:clamp(34px,3.7vw,52px); --kv-h3:clamp(19px,1.5vw,22px);
  --kv-lead:clamp(17px,1.35vw,19px); --kv-body:16px; --kv-small:13px; --kv-eyebrow:12px;
  --kv-radius:18px; --kv-ease:cubic-bezier(.22,1,.36,1);
}

/* ---------- 2. Sections and container ---------- */
/* scoped to .kv-pad sections: the homepage has its own .kv-sec (korven.css) and keeps its own backgrounds */
.kv-pad.kv-sec{position:relative;padding-block:var(--kv-sec);background:var(--kv-navy)}
.kv-pad.kv-sec--alt,.kv-band-alt{background:var(--kv-navy-2);border-top:1px solid var(--kv-line)}
.kv-pad.kv-sec--tight{padding-block:var(--kv-sec-tight)}
/* same as korven.css .kv-wrap: left-aligned on the site gutter, never a centred box */
.kv-wrap{width:100%;max-width:none;margin:0;padding-inline:var(--kv-gutter);box-sizing:border-box}
/* the site keeps one left edge for menu, hero, sections and footer: the --gut gutter (chrome.css). Inside sections the gutter comes from .kv-pad, so the container adds none and stays left-aligned */
.kv-pad .kv-wrap,.kv-pad.kv-wrap{max-width:1440px;margin-inline:0;padding-inline:0}
.kv-proof .kv-wrap{max-width:none;margin:0;padding-inline:var(--kv-gutter)}
.kv-sec-head{max-width:760px;margin-bottom:clamp(32px,4vw,52px)}
.kv-sec-head--center{margin-inline:auto;text-align:center}
.kv-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
@media(max-width:900px){.kv-split{grid-template-columns:1fr}}

/* ---------- 3. Type ---------- */
.kv-eyebrow{display:flex;align-items:center;gap:12px;font-family:Outfit,sans-serif;font-size:var(--kv-eyebrow);font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--kv-gold);margin:0}
.kv-sec-head--center .kv-eyebrow{justify-content:center}
.kv-title-1{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:var(--kv-h1);line-height:1.05;letter-spacing:-.005em;color:var(--kv-ink);margin:18px 0 0;max-width:16ch}
.kv-title-2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:var(--kv-h2);line-height:1.1;color:var(--kv-ink);margin:14px 0 0}
.kv-title-1 em,.kv-title-2 em{font-style:italic;font-weight:400;color:var(--kv-gold)}
.kv-title-3{font-family:Outfit,sans-serif;font-weight:500;font-size:var(--kv-h3);line-height:1.3;color:var(--kv-ink);margin:0}
.kv-lead{font-family:Outfit,sans-serif;font-weight:300;font-size:var(--kv-lead);line-height:1.65;color:var(--kv-ink-2);margin:18px 0 0;max-width:60ch}
.kv-text{font-family:Outfit,sans-serif;font-weight:300;font-size:var(--kv-body);line-height:1.7;color:var(--kv-ink-3);margin:12px 0 0}
.kv-fine{font-family:Outfit,sans-serif;font-size:var(--kv-small);line-height:1.6;color:var(--kv-ink-3);margin:14px 0 0}
.kv-num{font-family:'Cormorant Garamond',serif;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}

/* ---------- 4. Buttons (one size everywhere) ---------- */
.kv-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:30px}
.kv-sec-head--center .kv-actions{justify-content:center}
.kv-textlink{font-family:Outfit,sans-serif;font-size:15px;font-weight:500;color:var(--kv-ink);text-decoration:none;border-bottom:1px solid rgba(212,168,67,.5);padding-bottom:2px}
.kv-textlink:hover{color:var(--kv-gold-2);border-bottom-color:var(--kv-gold)}

/* ---------- 5. Proof strip: the one stat bar used on every page ---------- */
.kv-proof{background:var(--kv-navy-2);border-block:1px solid var(--kv-line);padding-block:clamp(26px,3.2vw,36px)}
.kv-proof-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:clamp(18px,3vw,40px)}
.kv-proof-item{display:flex;flex-direction:column;gap:6px;min-width:0}
.kv-proof-item b{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(28px,2.6vw,36px);line-height:1;color:var(--kv-gold);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1;white-space:nowrap}
.kv-proof-item b.kv-proof-word{white-space:normal}
.kv-proof-item span{font-family:Outfit,sans-serif;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--kv-ink-3);line-height:1.45}
@media(max-width:560px){.kv-proof-row{grid-template-columns:1fr 1fr}}

/* ---------- 6. Cards and steps ---------- */
.kv-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,24px)}
@media(max-width:900px){.kv-cards{grid-template-columns:1fr}}
.kv-card{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));border:1px solid var(--kv-line);border-radius:var(--kv-radius);padding:clamp(22px,2.4vw,30px)}
.kv-card .kv-k{font-family:'Cormorant Garamond',serif;font-size:30px;line-height:1;color:var(--kv-gold);font-feature-settings:"lnum" 1;display:block;margin-bottom:14px}
.kv-card .kv-text{margin-top:10px}
.kv-steps{counter-reset:kvstep;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,24px)}
@media(max-width:900px){.kv-steps{grid-template-columns:1fr}}

/* ---------- 7. Next-step block (every page ends with one clear next step) ---------- */
.kv-next{text-align:center}
.kv-next .kv-title-2{margin-inline:auto;max-width:22ch}
.kv-next .kv-lead{margin-inline:auto}
.kv-next .kv-actions{justify-content:center}

/* ---------- 8. Breadcrumbs ---------- */
.kv-crumbs{font-family:Outfit,sans-serif;font-size:13px;color:var(--kv-ink-3);margin:0 0 18px}
.kv-crumbs a{color:var(--kv-ink-3);text-decoration:none}
.kv-crumbs a:hover{color:var(--kv-gold)}
.kv-crumbs span{margin:0 8px;color:rgba(212,168,67,.6)}

/* ---------- 9. Sticky phone bar: the free review is always one tap away ---------- */
.kv-stickbar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:900;display:none;transform:translateY(140%);transition:transform .45s var(--kv-ease)}
.kv-stickbar.on{transform:none}
.kv-stickbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border-radius:999px;background:linear-gradient(120deg,#d4a843,#b08a2c);color:#07172a;font-family:Outfit,sans-serif;font-size:16px;font-weight:600;text-decoration:none;box-shadow:0 12px 30px rgba(0,0,0,.4)}
@media(max-width:900px){.kv-stickbar{display:block}}
@media(prefers-reduced-motion:reduce){.kv-stickbar{transition:none}}

/* ---------- 9b. Pieces used by the service-page transform ---------- */
.kv-eyebrow{display:inline-flex}
.kv-eyebrow-line{display:inline-block;width:28px;height:1px;background:rgba(212,168,67,.7)}
.kv-eyebrow--center{justify-content:center}
.kv-title-center{margin-inline:auto;max-width:24ch}
.kv-stack{display:grid;grid-template-columns:1fr;gap:40px}
.kv-sec-head .kv-title-2{max-width:22ch}
.kv-pad.kv-sec--guarantee{padding-block:var(--kv-sec-tight);background:radial-gradient(680px 300px at 50% 50%,rgba(212,168,67,.06),transparent 70%),var(--kv-navy);border-top:1px solid rgba(212,168,67,.16)}
.kv-hero-lead{max-width:52ch}
.kv-hero-proof{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-family:Outfit,sans-serif;font-size:14px;color:var(--kv-ink-3);margin:22px 0 0}
.kv-hero-proof .kv-stars{color:var(--kv-gold);letter-spacing:.12em;font-size:13px}
.kv-hero-proof i{font-style:normal;color:rgba(212,168,67,.6)}
a.kv-primary{font-size:16px;padding:17px 34px}
.kv-card--link{display:flex;flex-direction:column;gap:6px;text-decoration:none;transition:border-color .3s var(--kv-ease),transform .3s var(--kv-ease),background .3s var(--kv-ease)}
.kv-card--link .kv-textlink{align-self:flex-start;margin-top:auto;padding-top:14px;border-bottom:0}
.kv-card--link:hover{border-color:rgba(212,168,67,.45);background:linear-gradient(180deg,rgba(212,168,67,.06),rgba(255,255,255,.012))}
.kv-card--link:hover .kv-textlink{color:var(--kv-gold-2)}
/* FAQ answers were capped at 320px, which cut long answers on phones */
.kv-faq[open] .ans{max-height:1400px}


/* the enquiry form block lines up with the other sections (same container and left edge) */
.kv-enquiry{max-width:none;padding-inline:var(--kv-gutter)!important}
.kv-enquiry .kv-enquiry-layout{max-width:1440px;margin-inline:0}
/* ---------- 10. Smooth scroll (Lenis on desktop wheel/trackpad; phones keep native scrolling) ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-smooth iframe{pointer-events:none}

/* ---------- 11. The Richmond page's own rc- template on the same sizes, spacing and left edge ---------- */
.rc-wrap{max-width:none;margin:0;padding-left:var(--kv-gutter);padding-right:var(--kv-gutter)}
.rc-wrap>*{max-width:1440px}
.rc-hero{padding-top:64px;padding-bottom:var(--kv-sec)}
.rc-section{padding-top:var(--kv-sec);padding-bottom:var(--kv-sec)}
.rc-band{background:var(--kv-navy-2);border-top:1px solid var(--kv-line);border-bottom:0}
.rc-eyebrow.kv-eyebrow{font-size:var(--kv-eyebrow)!important;font-weight:600!important;letter-spacing:.24em;line-height:1.4!important;margin:0 0 14px!important}
.rc-hero h1{font-size:var(--kv-h1);line-height:1.05;letter-spacing:-.005em}
.rc-wrap h2{font-size:var(--kv-h2);line-height:1.1;margin:0 0 26px}
.rc-wrap .rc-process-card h2{font-size:clamp(26px,2.4vw,32px)}
.rc-wrap .rc-lead{font-size:var(--kv-lead)}
.rc-wrap p{line-height:1.7}
.rc-actions a.kv-primary{padding:17px 34px;font-size:16px}
.rc-actions a.kv-textlink{padding:0 0 2px;font-size:15px}

/* ---------- 12. Pages kept in their own layout (About, Contact, Free Review): same section spacing as everywhere else ---------- */
.kv-sec-pad{padding-top:var(--kv-sec)!important;padding-bottom:var(--kv-sec)!important}
@media(max-width:640px){:root{--gut:25px}}

/* ---------- 13. Homepage price cards ---------- */
.kv-cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){.kv-cards--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.kv-cards--4{grid-template-columns:1fr}}
.kv-price-mini-k{font-family:Outfit,sans-serif;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--kv-gold)}
.kv-price-mini-amt{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(38px,3.4vw,48px);line-height:1;color:var(--kv-ink);font-feature-settings:"lnum" 1;margin:12px 0 4px}
.kv-price-mini-amt small{font-family:Outfit,sans-serif;font-size:13px;font-weight:400;color:var(--kv-ink-3);letter-spacing:0}
.kv-price-mini-amt small:first-child{display:block;margin-bottom:6px;text-transform:uppercase;letter-spacing:.14em;font-size:11px}
#prices .kv-cards{margin-top:clamp(28px,3vw,40px)}
#prices .kv-fine{margin-top:22px}

/* ---------- 14. Fixes after the rollout check (17 Oct) ---------- */
/* proof strip: every value the same size and on one line on wide screens; labels line up along the bottom even when a value wraps */
.kv-proof-row{align-items:stretch}
.kv-proof-item{justify-content:flex-end}
.kv-proof-item b,.kv-proof-item b.kv-proof-word{font-size:clamp(26px,2.2vw,32px);white-space:nowrap}
@media(max-width:900px){.kv-proof-item b,.kv-proof-item b.kv-proof-word{white-space:normal}}
/* Richmond: the hero proof line at the same size as everywhere else; the process-card label keeps its opening bracket */
.rc-wrap .kv-hero-proof{font-size:14px;line-height:1.5;margin:22px 0 0;color:var(--kv-ink-3)}
.rc-process-card .rc-eyebrow.kv-ey::before{display:inline-block}
/* Richmond: the questions now sit in their own band, so they need the normal section spacing at the top */
.rc-faq-band .rc-faqs{padding-top:var(--kv-sec)}

/* "See it in practice" line under the Keep-exploring cards: case study and guide links */
.kv-seeit{margin-top:30px;font-size:15px;line-height:1.7}
.kv-seeit i{font-style:normal;color:var(--kv-gold);margin:0 6px}
.kv-seeit a{color:var(--kv-gold);text-decoration:none;border-bottom:1px solid rgba(212,168,67,.4);padding-bottom:1px}
.kv-seeit a:hover{border-bottom-color:var(--kv-gold)}

/* ---------- 15. Tap targets and contrast (PageSpeed accessibility, 17 Oct) ---------- */
/* close-day counter: the "/ 15" at readable contrast */
.kv-mc-dial .num small{color:rgba(255,255,255,.72)}
/* review dots: same 6px dot, drawn inside a 24px tap area */
.kv-revgrid button[aria-label^="Show review"]{box-sizing:content-box!important;padding:9px!important;background-clip:content-box!important}
/* phones: small links get a taller tap area without moving anything (padding taken back by negative margin) */
@media (pointer:coarse),(max-width:768px){
  .kv-crumbs a,.rc-service a{display:inline-block;padding-block:6px;margin-block:-6px}
  .kv-foot-social a{display:inline-flex;align-items:center;justify-content:center;padding:4px;margin:-4px}
}
/* ===== repairs.css ===== */
/* Functional repairs only; retain the existing visual system. */
:is(a,button,summary,input,select,textarea,[role="button"]):focus-visible{outline:2px solid #D4A843;outline-offset:3px}
#svcDrop.kv-menu-dismissed:not(.open) .nav-drop-menu{visibility:hidden;opacity:0}
@media(max-width:980px){
  #burger{z-index:10001}
}
/* Let chart grid cells shrink to the available width instead of widening the page. */
.cgrid > .cc{min-width:0}
.cgrid canvas{max-width:100%}
/* Preserve table data; allow horizontal scrolling inside a narrow article. */
.kv-table-scroll{display:contents}
#kvContactForm input,#kvContactForm select,#kvContactForm textarea{min-width:0;max-width:100%}
@media(max-width:380px){
  .kv-table-scroll{display:block;max-width:100%;overflow-x:auto}
  body[data-kv-page="contact"] .kv-grid>div{min-width:0;overflow-wrap:anywhere}
  body[data-kv-page="guides"] div[style*="minmax(320px"]{grid-template-columns:minmax(0,1fr)!important}
  body[data-kv-page="index"] .kv-diff-grid{grid-template-columns:minmax(0,1fr)}
  body[data-kv-page="index"] .kv-diff-grid>div{min-width:0}
  body[data-kv-page="fractional-cfo"] div:has(>span>.sc-interp){gap:0!important}
}