@charset "UTF-8";
/* ============================================================================
   Trustline CFO Solutions Pvt. Ltd. — styles.css
   Design system follows the Jai Sidhi Enterprises reference site.

   01 Fonts · 02 Tokens · 03 Base · 04 Layout & type · 05 Buttons & links
   06 Header & menu · 07 Heroes · 08 Services · 09 Rows & lists
   10 Points · 11 Cases · 12 Process · 13 About & people · 14 Contact & form
   15 Footer · 16 Legal pages · 17 Utilities & print

   Type scale (Inter only)            desktop  mobile  weight
   Page heading (h1)                     48      34     600
   Section heading (h2)                  32      26     600
   Item heading (h3)                     22      20     600
   Lead text                             18      17     400
   Body                                  17      16     400
   Navigation, buttons, labels           15      15     500
   Notes and disclaimers                 14      14     400
   ========================================================================= */

/* 01 FONTS — Inter, self-hosted (SIL OFL 1.1, see fonts/OFL.txt) */
@font-face{
  font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("../fonts/inter-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("../fonts/inter-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;
}

/* 02 TOKENS */
:root{
  --navy:#071A2F;
  --navy-deep:#04101C;
  --ink:#14161A;
  --muted:#5C6169;
  --paper:#FFFFFF;
  --bone:#F7F6F3;
  --blue:#0067B9;
  --blue-dark:#00549A;
  --blue-on-dark:#86C2F2;
  --hair:#E2E1DC;
  --hair-2:#CCCAC3;
  --hair-dark:rgba(255,255,255,.14);
  --on-dark:#FFFFFF;
  --on-dark-2:#C5D2DF;
  --on-dark-3:#9FB0C2;
  --danger:#B42318;
  --danger-bg:#FEF3F2;
  --ok:#0B6B3A;
  --ok-bg:#EEF7F1;
  --wa:#1FAF55;

  --shell:1200px;
  --pad:clamp(16px,5vw,56px);
  --sec:clamp(48px,7vw,88px);

  --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --t-h1:48px; --t-h2:32px; --t-h3:22px;
  --t-lead:18px; --t-body:17px; --t-ui:15px; --t-note:14px;
  --lh-body:1.65; --lh-head:1.2;
  --head-gap:14px;
  --card-pad:28px;

  --hdr-h:68px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --t:.3s var(--ease);
  --t-fast:.18s cubic-bezier(.4,0,.2,1);
  color-scheme:light;
}
@media (min-width:1024px){ :root{ --hdr-h:76px } }
@media (max-width:767px){
  :root{ --t-h1:34px; --t-h2:26px; --t-h3:20px; --t-lead:17px; --t-body:16px; --card-pad:20px }
}

/* 03 BASE */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h) + 20px)}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--font);font-size:var(--t-body);line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;
}
h1,h2,h3,h4{margin:0;font-family:var(--font);font-weight:600;line-height:var(--lh-head);letter-spacing:-.015em;color:var(--ink);text-wrap:balance;text-align:left}
h1{font-size:var(--t-h1);letter-spacing:-.025em}
h2{font-size:var(--t-h2);letter-spacing:-.02em}
h3{font-size:var(--t-h3)}
h4{font-size:var(--t-body)}
p{margin:0;text-align:left}
a{color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
strong,b{font-weight:600}
img{max-width:100%}
abbr[title]{text-decoration:underline dotted;text-underline-offset:3px;cursor:help}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:1px}
.on-dark :focus-visible,.pftr :focus-visible,.pdrawer :focus-visible{outline-color:var(--blue-on-dark)}
[tabindex="-1"]:focus{outline:none}
.skip{position:absolute;left:-9999px;top:0;z-index:400;background:var(--blue);color:#fff;padding:12px 20px;font-weight:600;text-decoration:none}
.skip:focus{left:0}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
[hidden]{display:none!important}

/* 04 LAYOUT & TYPE */
.shell{width:100%;max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:var(--sec)}
.sec + .sec:not(.band-bone):not(.band-navy){border-top:1px solid var(--hair)}
.band-bone{background:var(--bone)}
.band-navy{background:var(--navy);color:#fff}
.eyebrow{
  display:flex;align-items:center;gap:12px;margin:0 0 14px;
  font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);line-height:1.5;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--blue);flex:none}
.on-dark .eyebrow{color:var(--on-dark-2)}
.on-dark .eyebrow::before{background:var(--blue-on-dark)}
.lead{font-size:var(--t-lead);line-height:1.6;color:var(--ink);max-width:62ch}
.muted{color:var(--muted)}
.fine{font-size:var(--t-note);line-height:1.6;color:var(--muted);max-width:80ch}
.num{display:block;font-size:var(--t-note);font-weight:600;letter-spacing:.02em;color:var(--blue);font-variant-numeric:tabular-nums}
.sec-head{display:grid;grid-template-columns:1fr;row-gap:0;margin-bottom:clamp(28px,4vw,48px)}
.sec-head .lead{margin-top:var(--head-gap)}
@media (min-width:900px){
  .sec-head.split{grid-template-columns:minmax(0,1fr) minmax(0,30rem);column-gap:56px;align-items:start}
  .sec-head.split .eyebrow{grid-column:1/-1}
  .sec-head.split .lead{margin-top:0;grid-column:2;grid-row:2}
}
.sec-foot{margin-top:clamp(24px,3vw,36px)}

/* 05 BUTTONS & LINKS */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:50px;padding:12px 24px;border-radius:2px;
  font-size:var(--t-ui);font-weight:500;line-height:1.3;text-align:center;text-decoration:none;white-space:normal;
  border:1px solid transparent;cursor:pointer;
  transition:background-color var(--t-fast),color var(--t-fast),border-color var(--t-fast);
}
.btn svg{flex:none;transition:transform var(--t-fast)}
.btn:hover svg.arrow{transform:translateX(3px)}
.btn-solid{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-solid:hover{background:var(--blue-dark);border-color:var(--blue-dark)}
.btn-ink{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-ink:hover{background:var(--navy);border-color:var(--navy)}
.btn-line{background:#fff;color:var(--ink);border-color:var(--hair-2)}
.btn-line:hover{border-color:var(--ink)}
.btn-light{background:#fff;color:var(--navy);border-color:#fff}
.btn-light:hover{background:var(--bone);border-color:var(--bone)}
.btn-wa .wa{color:var(--wa)}
.btn-ink.btn-wa .wa{color:#5BE08F}
.btn[disabled]{opacity:.6;cursor:progress}
.row-btns{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px}
@media (max-width:479px){ .row-btns .btn{width:100%} }
.tlink{
  display:inline-flex;align-items:center;gap:9px;padding:8px 0;position:relative;
  font-size:var(--t-ui);font-weight:500;line-height:1.3;color:var(--blue-dark);text-decoration:none;
}
.tlink::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:currentColor;opacity:.35;transition:opacity var(--t)}
.tlink:hover::after{opacity:1}
.tlink svg{flex:none;transition:transform var(--t-fast)}
.tlink:hover svg{transform:translateX(3px)}
.on-dark .tlink{color:#fff}
.prose a,.inline-link{color:var(--blue-dark);font-weight:500;text-underline-offset:3px}
.prose a:hover,.inline-link:hover{color:var(--blue)}

/* 06 HEADER & MENU */
.phdr{position:sticky;top:0;z-index:200;background:rgba(255,255,255,.98);border-bottom:1px solid var(--hair)}
.phdr.scrolled{box-shadow:0 1px 0 rgba(7,26,47,.04)}
.phdr-in{display:flex;align-items:center;gap:18px;height:var(--hdr-h)}
.brand{display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none;color:var(--ink)}
.brand-logo{display:block;flex:none;height:36px;width:auto;object-fit:contain}
@media (min-width:1024px){ .brand-logo{height:42px} }
.brand-logo + .brand-name{padding-left:12px;border-left:1px solid var(--hair)}
.brand-name{font-size:var(--t-ui);font-weight:600;letter-spacing:-.01em;line-height:1.25;white-space:nowrap}
.brand-name span{font-weight:500;color:var(--muted)}
@media (max-width:419px){ .brand-name{display:none} .brand.no-logo .brand-name{display:block;white-space:normal} }

.pnav{display:none}
@media (min-width:1080px){ .phdr-in > nav{margin-left:auto} .pnav{display:flex;gap:2px} }
.pnav a{
  display:block;padding:8px 12px;position:relative;white-space:nowrap;text-decoration:none;
  font-size:var(--t-ui);font-weight:500;line-height:1.3;color:var(--muted);transition:color var(--t-fast);
}
.pnav a::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:1.5px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .28s var(--ease)}
.pnav a:hover{color:var(--ink)}
.pnav a:hover::after,.pnav a[aria-current="page"]::after{transform:scaleX(1)}
.pnav a[aria-current="page"]{color:var(--ink)}
.phdr-cta{display:none}
@media (min-width:1080px){
  .phdr-cta{display:inline-flex;min-height:42px;padding:0 18px;margin-left:10px;flex:none}
}
.pburger{
  margin-left:auto;margin-right:-10px;flex:none;width:48px;height:48px;
  display:inline-flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:var(--ink);
}
@media (min-width:1080px){ .pburger{display:none} }
.pburger span{display:block;width:22px;height:10px;position:relative}
.pburger span::before,.pburger span::after{content:"";position:absolute;left:0;right:0;height:1.6px;background:currentColor;transition:transform var(--t),top var(--t)}
.pburger span::before{top:0}
.pburger span::after{top:8px}
.pburger[aria-expanded="true"] span::before{top:4px;transform:rotate(45deg)}
.pburger[aria-expanded="true"] span::after{top:4px;transform:rotate(-45deg)}
body.menu-open{overflow:hidden}

.pdrawer{
  position:fixed;left:0;right:0;top:var(--hdr-h);bottom:0;z-index:190;background:var(--navy);color:#fff;
  padding:8px 0 32px;overflow-y:auto;overscroll-behavior:contain;
  opacity:0;visibility:hidden;transition:opacity var(--t),visibility 0s linear .3s;
}
.pdrawer.open{opacity:1;visibility:visible;transition:opacity var(--t),visibility 0s}
.pdrawer nav a{
  display:flex;justify-content:space-between;align-items:center;gap:16px;padding:15px 0;
  border-bottom:1px solid var(--hair-dark);text-decoration:none;color:#fff;
  font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.2;
}
.pdrawer nav a span{font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--on-dark-3)}
.pdrawer nav a[aria-current="page"]{color:var(--blue-on-dark)}
.drawer-foot{margin-top:28px;display:grid;gap:12px}
.drawer-foot .btn{width:100%}
.drawer-foot p{font-size:var(--t-ui);color:var(--on-dark-2)}
.drawer-foot p a{color:#fff;text-decoration:none;font-weight:600}
@media (min-width:1080px){ .pdrawer{display:none} }

/* 07 HEROES */
.hero{background:var(--navy);color:#fff}
.hero-in{padding-block:clamp(56px,9vw,120px) clamp(48px,7vw,88px)}
.hero h1{color:#fff;max-width:20ch}
.hero .lead{margin-top:18px;color:#E3EAF2;max-width:56ch}
.hero .row-btns{margin-top:32px}
.hero-facts{
  margin-top:clamp(40px,6vw,64px);padding-top:18px;border-top:1px solid var(--hair-dark);
  display:grid;gap:14px 40px;grid-template-columns:1fr;
}
@media (min-width:760px){ .hero-facts{grid-template-columns:repeat(3,minmax(0,1fr))} }
.hero-facts li{font-size:var(--t-ui);line-height:1.45;color:var(--on-dark-2)}
.hero-facts b{display:block;color:#fff;font-weight:600;font-size:var(--t-body)}

.phero{background:var(--navy);color:#fff}
.phero-in{padding-block:clamp(48px,7vw,96px) clamp(40px,6vw,72px)}
.phero h1{color:#fff}
.phero .lead{margin-top:18px;color:#E3EAF2}
.phero .row-btns{margin-top:28px}
.phero .jump{margin-top:clamp(32px,5vw,48px);padding-top:16px;border-top:1px solid var(--hair-dark);display:flex;flex-wrap:wrap;gap:4px 28px}
.phero .jump a{font-size:var(--t-ui);font-weight:500;color:var(--on-dark-2);text-decoration:none;padding:6px 0}
.phero .jump a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}

/* 08 CORE SERVICES (three equal columns) */
.svc3{display:grid;grid-template-columns:1fr;border-top:1px solid var(--hair)}
@media (min-width:900px){ .svc3{grid-template-columns:repeat(3,minmax(0,1fr))} }
.svc{display:flex;flex-direction:column;padding:clamp(24px,3vw,36px) 0;border-bottom:1px solid var(--hair)}
@media (min-width:900px){
  .svc{padding-inline:clamp(24px,3vw,40px);border-bottom:0}
  .svc:first-child{padding-left:0}
  .svc:last-child{padding-right:0}
  .svc + .svc{border-left:1px solid var(--hair)}
}
.svc h3{margin-top:12px}
.svc p{margin-top:12px;flex:1}
.svc .tlink{margin-top:18px;align-self:flex-start}

/* 09 NUMBERED ROWS & LISTS */
.prows{border-top:1px solid var(--hair)}
.prow{display:grid;gap:10px 32px;grid-template-columns:1fr;padding-block:clamp(24px,2.8vw,32px);border-bottom:1px solid var(--hair)}
@media (min-width:860px){ .prow{grid-template-columns:56px minmax(0,.85fr) minmax(0,1.35fr);align-items:start} .prow .num{padding-top:4px} }
.prow .ex{margin-top:8px;color:var(--muted)}
.dlist{display:grid;gap:0}
.dlist li{padding:12px 0;border-bottom:1px solid var(--hair)}
.dlist li:first-child{padding-top:0}
.dlist li:last-child{border-bottom:0;padding-bottom:0}
.dlist b{display:block;font-weight:600}
.dlist span{display:block;margin-top:2px;color:var(--muted);font-size:var(--t-ui);line-height:1.55}
.plist{display:flex;flex-wrap:wrap;gap:8px}
.plist li{font-size:var(--t-note);line-height:1.4;color:var(--ink);padding:6px 11px;border:1px solid var(--hair);background:var(--paper);border-radius:2px}
.ticks{display:grid;gap:10px}
.ticks li{position:relative;padding-left:26px}
.ticks li::before{content:"";position:absolute;left:2px;top:.62em;width:12px;height:6px;border-left:1.6px solid var(--blue);border-bottom:1.6px solid var(--blue);transform:rotate(-45deg) translateY(-50%)}
.cols2{display:grid;grid-template-columns:1fr;gap:28px 64px}
@media (min-width:900px){ .cols2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }
.panel{border:1px solid var(--hair);background:var(--paper);padding:var(--card-pad)}
.panel h3 + p,.panel h3 + ul{margin-top:12px}

/* 10 POINTS (2 x 2 grid) */
.usps{display:grid;grid-template-columns:1fr;border-top:1px solid var(--hair)}
@media (min-width:760px){ .usps{grid-template-columns:1fr 1fr} }
.usp{padding:clamp(24px,3vw,36px) 0;border-bottom:1px solid var(--hair)}
@media (min-width:760px){
  .usp:nth-child(odd){padding-right:clamp(24px,4vw,56px);border-right:1px solid var(--hair)}
  .usp:nth-child(even){padding-left:clamp(24px,4vw,56px)}
}
.usp h3{margin-top:12px}
.usp p{margin-top:12px;color:var(--muted);max-width:52ch}

/* 11 CASES */
.txs{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:1000px){ .txs{grid-template-columns:repeat(3,minmax(0,1fr))} }
.tx{display:flex;flex-direction:column;padding:var(--card-pad);border:1px solid var(--hair);background:var(--paper)}
.tx-type{display:inline-block;align-self:flex-start;margin-top:12px;font-size:13px;font-weight:600;line-height:1.3;padding:5px 9px;border-radius:2px;background:var(--bone);color:var(--navy)}
.tx-type.advisory{background:#EAF3FB;color:var(--blue-dark)}
.tx h3{margin-top:14px}
.tx-part{margin-top:16px}
.tx-part h4{margin:0 0 4px;font-size:var(--t-note);font-weight:600;color:var(--muted);line-height:1.4}
.tx-part p{font-size:var(--t-ui);line-height:1.6}
.tx-result{margin-top:auto;padding-top:16px}
.tx-result > div{margin-top:18px;padding-top:14px;border-top:1px solid var(--hair)}
.tx-result h4{margin:0 0 4px;font-size:var(--t-note);font-weight:600;color:var(--blue-dark)}
.tx-result p{font-weight:500;font-size:var(--t-ui);line-height:1.55}
.tx-attr{margin-top:12px;font-size:13px;line-height:1.5;color:var(--muted)}

/* 12 PROCESS */
.steps{display:grid;grid-template-columns:1fr;gap:0;counter-reset:step;border-top:1px solid var(--hair)}
@media (min-width:760px){ .steps{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px} }
@media (min-width:1000px){ .steps{grid-template-columns:repeat(4,minmax(0,1fr))} }
.step{padding:22px 0 24px;border-bottom:1px solid var(--hair)}
@media (min-width:1000px){ .step{border-bottom:0} }
.step h3{margin-top:10px;display:flex;align-items:center;gap:10px}
.step p{margin-top:10px;color:var(--muted);font-size:var(--t-ui);line-height:1.6}
.step-arrow{color:var(--hair-2);font-weight:400}
@media (max-width:999px){ .step-arrow{display:none} }

/* 13 ABOUT & PEOPLE */
.about{display:grid;gap:32px 64px;grid-template-columns:1fr}
@media (min-width:900px){ .about{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }
.about h2{margin-bottom:var(--head-gap)}
.about p + p{margin-top:12px}
.about .tlink{margin-top:16px}
.aside-block{padding-top:4px}
@media (min-width:900px){ .aside-block{padding-left:40px;border-left:1px solid var(--hair)} }
.timeline{border-top:1px solid var(--hair)}
.timeline li{display:grid;grid-template-columns:1fr;gap:4px 32px;padding:20px 0;border-bottom:1px solid var(--hair)}
@media (min-width:760px){ .timeline li{grid-template-columns:140px minmax(0,1fr)} }
.timeline .yr{font-weight:600;color:var(--blue-dark);font-variant-numeric:tabular-nums}
.timeline p{color:var(--ink)}
.people{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:900px){ .people{grid-template-columns:1fr 1fr} }
.person{display:grid;grid-template-columns:88px minmax(0,1fr);gap:20px;align-items:start;padding:var(--card-pad);border:1px solid var(--hair);background:var(--paper)}
@media (max-width:479px){ .person{grid-template-columns:1fr} }
.person.no-photo{grid-template-columns:1fr}
.person img{width:88px;height:110px;object-fit:cover;background:var(--bone);display:block}
.person .role{display:block;margin-top:4px;font-size:var(--t-note);font-weight:500;color:var(--blue-dark)}
.person p{margin-top:12px;font-size:var(--t-ui);line-height:1.65}
.facts{display:grid;grid-template-columns:1fr;border-top:1px solid var(--hair)}
.facts div{display:grid;grid-template-columns:1fr;gap:2px 24px;padding:14px 0;border-bottom:1px solid var(--hair)}
@media (min-width:640px){ .facts div{grid-template-columns:180px minmax(0,1fr)} }
.facts dt{font-size:var(--t-note);font-weight:500;color:var(--muted)}
.facts dd{margin:0;font-weight:500;overflow-wrap:anywhere}

/* 14 CONTACT & FORM */
.contact{display:grid;gap:40px 64px;grid-template-columns:1fr}
@media (min-width:1000px){ .contact{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)} }
.contact h2{margin-bottom:var(--head-gap)}
.clist{margin-top:26px;border-top:1px solid var(--hair)}
.clist > li{padding:16px 0;border-bottom:1px solid var(--hair)}
.clist .lbl{display:block;font-size:var(--t-note);font-weight:500;color:var(--muted);line-height:1.4}
.clist .val{display:inline-block;margin-top:4px;font-size:21px;font-weight:600;letter-spacing:-.015em;line-height:1.25;color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.clist .val.sm{font-size:18px}
.clist a.val:hover{color:var(--blue-dark)}
.clist .acts{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px}
.clist .acts .btn{min-height:44px;padding:8px 16px}
.offices{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--hair)}
@media (min-width:900px){ .offices{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:40px} }
.office{padding:22px 0;border-bottom:1px solid var(--hair)}
.office h3{font-size:var(--t-body)}
.office address{margin-top:8px;font-style:normal;color:var(--ink);font-size:var(--t-ui);line-height:1.6}
.office a{display:inline-block;margin-top:8px}

.form-card{background:var(--bone);border:1px solid var(--hair);padding:var(--card-pad)}
.form-card h3{font-size:var(--t-h3)}
.form-card .intro{margin-top:8px;font-size:var(--t-ui);color:var(--muted);line-height:1.55}
.fgrid{margin-top:22px;display:grid;gap:18px;grid-template-columns:1fr;align-items:start}
@media (min-width:640px){ .fgrid{grid-template-columns:1fr 1fr} .fgrid .full{grid-column:1/-1} }
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field > label,.field .lab{font-size:var(--t-ui);font-weight:500;line-height:1.3;color:var(--ink)}
.opt{font-weight:400;color:var(--muted)}
.req-mark{color:var(--danger)}
.hint{font-size:13px;color:var(--muted);line-height:1.45}
.field input,.field select,.field textarea{
  width:100%;min-height:48px;padding:10px 12px;background:#fff;border:1px solid var(--hair-2);border-radius:2px;
  font-size:16px;line-height:1.4;color:var(--ink);transition:border-color var(--t-fast),box-shadow var(--t-fast);
  -webkit-appearance:none;appearance:none;min-width:0;
}
.field select{
  padding-right:36px;text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235C6169' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
}
.field textarea{min-height:104px;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--muted)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,103,185,.18)}
.field [aria-invalid="true"]{border-color:var(--danger)}
.err{font-size:13px;color:var(--danger);font-weight:500;line-height:1.45}
.err:empty{display:none}
.more{border-top:1px solid var(--hair);padding-top:14px}
.more summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;min-height:40px;font-size:var(--t-ui);font-weight:500;color:var(--blue-dark)}
.more summary::-webkit-details-marker{display:none}
.more summary svg{transition:transform var(--t-fast)}
.more[open] summary svg{transform:rotate(180deg)}
.more .fgrid{margin-top:10px}
.check{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start}
.field .check input{-webkit-appearance:checkbox;appearance:auto;width:20px;height:20px;min-height:0;padding:0;margin:2px 0 0;border:0;box-shadow:none;accent-color:var(--blue);cursor:pointer}
.field .check input:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.check label{font-size:var(--t-ui);font-weight:400;color:var(--ink);line-height:1.55}
.check label a{color:var(--blue-dark);font-weight:500;text-underline-offset:3px}
.form-actions{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
@media (max-width:479px){ .form-actions .btn{width:100%} }
.form-foot{margin-top:12px;font-size:13px;color:var(--muted);line-height:1.5}
.err-summary{margin-top:18px;padding:14px 16px;background:var(--danger-bg);border-left:3px solid var(--danger)}
.err-summary h4{margin:0;font-size:var(--t-ui);font-weight:600;color:var(--danger)}
.err-summary ul{margin-top:6px;display:grid;gap:3px;list-style:disc;padding-left:20px}
.err-summary a{color:var(--danger);font-size:var(--t-note)}
.status{margin-top:18px;padding:16px 18px;border:1px solid var(--hair);background:#fff}
.status h4{margin:0;font-size:var(--t-body);font-weight:600}
.status p{margin-top:6px;font-size:var(--t-ui);line-height:1.6}
.status .row-btns{margin-top:14px;gap:10px}
.status.ok{border-left:3px solid var(--ok);background:var(--ok-bg)}
.status.fail{border-left:3px solid var(--danger);background:var(--danger-bg)}
.status.handoff{border-left:3px solid var(--blue)}

/* CTA band */
.cta-band .shell{display:grid;gap:20px 56px;grid-template-columns:1fr;align-items:end}
@media (min-width:900px){ .cta-band .shell{grid-template-columns:minmax(0,1fr) auto} }
.cta-band h2{color:#fff}
.cta-band p{margin-top:12px;color:var(--on-dark-2);max-width:56ch}

/* 15 FOOTER */
.pftr{background:var(--navy-deep);color:var(--on-dark-2);padding-block:48px 28px;font-size:var(--t-ui)}
.pftr-top{display:grid;gap:32px 48px;grid-template-columns:1fr}
@media (min-width:900px){ .pftr-top{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr) minmax(0,1fr)} }
.brand-full{display:inline-flex;align-items:center;gap:10px;background:#fff;padding:12px 16px;border-radius:2px;text-decoration:none;color:var(--ink)}
.brand-full img{display:block;width:220px;max-width:100%;height:auto}
.brand-full .brand-name{display:none}
.brand-full.no-logo .brand-name{display:block}
.pftr .about-line{margin-top:14px;color:var(--on-dark-2);max-width:40ch;line-height:1.6}
.pftr h2{font-size:var(--t-note);font-weight:500;letter-spacing:0;color:var(--on-dark-3);margin-bottom:10px}
.pftr ul li{line-height:1.4}
.pftr a{color:var(--on-dark-2);text-decoration:none}
.pftr a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.pftr .fnav a,.pftr .fcontact a{display:inline-block;padding:5px 0}
.pftr .fcontact li{color:var(--on-dark-2)}
.pftr .fcontact .k{display:block;font-size:13px;color:var(--on-dark-3);margin-top:8px}
.other-companies{margin-top:36px;padding-top:24px;border-top:1px solid var(--hair-dark)}
.other-company-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 36px;max-width:760px}
@media (max-width:639px){ .other-company-grid{grid-template-columns:1fr} }
.company-name{font-weight:600;font-size:var(--t-body);color:#fff}
.other-companies p{font-size:var(--t-note);color:var(--on-dark-2);margin-top:4px;line-height:1.5}
.pftr-legal{margin-top:28px;padding-top:18px;border-top:1px solid var(--hair-dark);display:grid;gap:10px;font-size:13px;color:var(--on-dark-3);line-height:1.6}
@media (min-width:900px){ .pftr-legal{grid-template-columns:1fr auto;align-items:start} }
.pftr-legal ul{display:flex;flex-wrap:wrap;gap:4px 20px}
.pftr-legal a{color:var(--on-dark-2)}
.pftr-legal .disc{grid-column:1/-1;max-width:110ch}

/* 16 LEGAL PAGES */
.prose{max-width:72ch}
.prose > * + *{margin-top:14px}
.prose h2{font-size:var(--t-h3);margin-top:36px}
.prose h2:first-child{margin-top:0}
.prose ul{list-style:disc;padding-left:22px;display:grid;gap:6px}
.prose .updated{font-size:var(--t-note);color:var(--muted)}

/* 17 UTILITIES & PRINT */
.mt-s{margin-top:12px}.mt-m{margin-top:24px}.mt-l{margin-top:40px}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}
@media print{
  .phdr,.pdrawer,.form-card,.pburger{display:none!important}
  .hero,.phero,.band-navy{background:#fff;color:#000}
  .hero h1,.phero h1,.hero .lead,.phero .lead{color:#000}
}
.pftr .brand-full,.pftr .brand-full:hover{color:var(--ink);text-decoration:none}

/* ============================================================================
   18 VISUAL LAYER — dashboard, charts, client stories, tools, motion
   One palette for every chart: navy base, blue accent (#0067B9 / #86C2F2),
   warm neutrals for "before" states. Illustrative data is always tagged.
   ========================================================================= */
:root{
  --c-base:#0067B9;          /* primary series */
  --c-add:#7FB8E6;           /* added / second series */
  --c-muted:#CCCAC3;         /* before / reference */
  --c-dark-1:#86C2F2;        /* primary series on navy */
  --c-dark-2:rgba(255,255,255,.28);
  --anim:.9s cubic-bezier(.22,.61,.36,1);
}

/* hero with dashboard */
.hero-grid{display:grid;grid-template-columns:1fr;gap:40px;align-items:center}
@media (min-width:1024px){ .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:64px} }
.hero-copy h1{max-width:18ch}
.hero .hero-facts{margin-top:clamp(40px,5vw,56px)}

.dash{margin:0;background:rgba(255,255,255,.035);border:1px solid var(--hair-dark);border-radius:4px;padding:20px;color:#fff;min-width:0}
@media (min-width:640px){ .dash{padding:24px} }
.dash-top,.tool-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.dash-title,.tool-top > span:first-child{font-size:var(--t-ui);font-weight:600;letter-spacing:-.005em}
.dash-right{display:flex;align-items:center;gap:6px}
.tag-illus{font-size:12px;font-weight:600;line-height:1;padding:6px 8px;border-radius:2px;background:rgba(134,194,242,.14);color:var(--c-dark-1);letter-spacing:.02em}
.tag-illus.light{background:#EAF3FB;color:var(--blue-dark)}
.dash-replay{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--hair-dark);background:transparent;color:var(--on-dark-2);border-radius:2px;cursor:pointer;transition:color var(--t-fast),border-color var(--t-fast)}
.dash-replay:hover{color:#fff;border-color:rgba(255,255,255,.4)}
.dstats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair-dark);border:1px solid var(--hair-dark)}
.dstat{background:var(--navy);padding:12px 14px;display:flex;flex-direction:column;gap:2px;min-width:0;transition:background-color var(--t-fast)}
.dstat:hover{background:#0B2440}
.dstat-l{font-size:13px;color:var(--on-dark-2);line-height:1.35}
.dstat-v{font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.25;font-variant-numeric:tabular-nums}
.dstat-d{font-size:12px;line-height:1.35;color:var(--on-dark-3)}
.dstat-d.up{color:#7FD8A6}
.dstat .meter{margin-top:6px}
.meter{display:block;height:4px;background:rgba(255,255,255,.12);border-radius:2px;overflow:hidden}
.meter i{display:block;height:100%;width:var(--w);background:var(--c-dark-1);border-radius:2px}
.meter.light{background:var(--hair)}
.meter.light i{background:var(--c-base)}
.dblock{margin-top:18px}
.dlabel{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--on-dark-2);margin-bottom:8px;line-height:1.35}
.dlabel.dark{color:var(--muted)}
.capbar{display:flex;height:10px;border-radius:2px;overflow:hidden;background:rgba(255,255,255,.08)}
.capbar i{display:block;height:100%;width:var(--w)}
.capbar .debt,.caplegend .debt{background:var(--c-dark-1)}
.capbar .equity,.caplegend .equity{background:var(--c-dark-2)}
.capbar .equity{border-left:2px solid var(--navy)}
.caplegend{display:flex;gap:18px;margin-top:8px;font-size:13px;color:var(--on-dark-2)}
.caplegend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}

.cfchart{position:relative;height:108px;touch-action:pan-y;cursor:crosshair}
.cfchart svg{display:block;width:100%;height:100%;overflow:visible}
.cfchart .grid{stroke:rgba(255,255,255,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.cf-area{fill:rgba(134,194,242,.1)}
.cf-line{fill:none;stroke:var(--c-dark-1);stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
.cfchart svg{clip-path:inset(-10px -10px -10px -10px);transition:clip-path 1.2s cubic-bezier(.4,0,.2,1)}
.cf-dot{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#fff;border:2px solid var(--c-dark-1);left:100%;top:6.4%;pointer-events:none;transition:left .12s linear,top .12s linear}
.cf-tip{position:absolute;top:0;left:100%;transform:translateX(-100%);padding:5px 8px;border-radius:2px;background:#fff;color:var(--navy);font-size:12px;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s}
.cfchart.active .cf-tip{opacity:1}
.cfaxis{display:flex;justify-content:space-between;margin-top:6px;font-size:12px;color:var(--on-dark-3)}
.dfac ul{border-top:1px solid var(--hair-dark)}
.dfac li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--hair-dark);font-size:13px;color:#E3EAF2;line-height:1.4;transition:background-color var(--t-fast)}
.dfac li:hover{background:rgba(255,255,255,.03)}
.st{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:var(--on-dark-2)}
.st i{width:7px;height:7px;border-radius:50%;background:#7FD8A6}
.st.wait i{background:#F2C57C}
.dash-foot{margin-top:14px;font-size:12px;line-height:1.5;color:var(--on-dark-3)}
.dash-foot.dark{color:var(--muted)}
@media (max-width:420px){ .dstat-v{font-size:19px} .dstat{padding:10px 12px} }

/* service cards: whole card is the link */
a.svc{text-decoration:none;color:inherit;transition:background-color var(--t-fast)}
a.svc h3{transition:color var(--t-fast)}
a.svc:hover h3{color:var(--blue-dark)}
a.svc:hover .tlink::after{opacity:1}
a.svc:hover .tlink svg{transform:translateX(3px)}
a.svc:focus-visible{outline-offset:6px}

/* client stories */
.stories{display:grid;gap:24px}
.story{display:grid;grid-template-columns:1fr;gap:28px 48px;background:var(--paper);border:1px solid var(--hair);padding:var(--card-pad);transition:border-color var(--t-fast)}
.story:hover{border-color:var(--hair-2)}
@media (min-width:960px){ .story{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-rows:auto 1fr;row-gap:0;padding:36px} .story-vis{grid-column:2;grid-row:1 / span 2} .story-foot{grid-column:1;grid-row:2} }
.story-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.story-meta .tx-type{margin-top:0}
.story-sector{font-size:var(--t-note);color:var(--muted)}
.story h3{margin-top:14px}
.story-steps{margin:18px 0 0;display:grid;gap:14px}
.story-steps div{display:grid;grid-template-columns:1fr;gap:2px}
@media (min-width:640px){ .story-steps div{grid-template-columns:128px minmax(0,1fr);gap:16px} }
.story-steps dt{font-size:var(--t-note);font-weight:600;color:var(--muted);line-height:1.6}
.story-steps dd{margin:0;font-size:var(--t-ui);line-height:1.6}
.story-steps .res dt{color:var(--blue-dark)}
.story-steps .res dd{font-weight:600}
.story-more{margin-top:0}
@media (min-width:960px){ .story-more{margin-top:18px} }
.story-more-in{padding:4px 0 6px;display:grid;gap:10px;max-width:62ch}
.story-more-in p{font-size:var(--t-ui);line-height:1.65}
.story .tx-attr{margin-top:14px}
.story-vis{background:var(--bone);border:1px solid var(--hair);padding:22px;align-self:start;min-width:0}
.vis-title{font-size:var(--t-note);font-weight:600;color:var(--ink);margin-bottom:14px}
.cmp{display:grid;gap:12px}
.cmp-row{display:grid;grid-template-columns:58px minmax(0,1fr);gap:4px 12px;align-items:center}
.cmp-l{font-size:13px;color:var(--muted)}
.cmp-track{display:flex;height:22px;background:#fff;border:1px solid var(--hair);border-radius:2px;overflow:hidden}
.cmp-track i{display:block;height:100%;width:var(--w)}
.cmp-track i + i{border-left:2px solid #fff}
.cmp-v{grid-column:2;font-size:var(--t-ui);font-weight:600;font-variant-numeric:tabular-nums;line-height:1.3}
.muted-seg{background:var(--c-muted)}
.base-seg{background:var(--c-base)}
.add-seg{background:var(--c-add)}
.vis-keys{margin-top:16px;display:grid;gap:6px}
.vis-keys li{position:relative;padding-left:18px;font-size:var(--t-note);line-height:1.45}
.vis-keys li > i{position:absolute;left:0;top:.4em;width:10px;height:10px;border-radius:2px}
.vis-keys i.rate{background:none;border:2px solid var(--c-base);border-radius:50%}
.vis-keys.chips{display:flex;flex-wrap:wrap;gap:6px}
.vis-keys.chips li{padding:5px 9px;padding-left:9px;background:#fff;border:1px solid var(--hair);border-radius:2px}
.vis-note{margin-top:14px;padding-top:12px;border-top:1px solid var(--hair);font-size:13px;line-height:1.55;color:var(--muted)}

/* testimonials (rendered only from approved entries) */
.tms{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:900px){ .tms{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))} }
.tm{margin:0;border-top:1px solid var(--hair-dark);padding-top:22px}
.tm blockquote{margin:0;font-size:var(--t-lead);line-height:1.55;color:#fff}
.tm blockquote::before{content:"“";display:block;font-size:40px;line-height:.8;color:var(--c-dark-1);margin-bottom:8px}
.tm figcaption{margin-top:16px;font-size:var(--t-ui);color:var(--on-dark-2);line-height:1.5}
.tm figcaption b{display:block;color:#fff}

/* tools and illustrative panels on light backgrounds */
.vis-split{align-items:center}
.tool,.report{margin:0;background:var(--paper);border:1px solid var(--hair);padding:var(--card-pad);min-width:0}
.rq{border:0;margin:0;padding:14px 0;border-top:1px solid var(--hair);min-width:0}
.rq legend{float:left;width:100%;padding:0;margin-bottom:10px;font-size:var(--t-ui);font-weight:600}
.rq-opts{clear:both;display:flex;flex-wrap:wrap;gap:8px}
.opt-pill{position:relative;display:inline-flex}
.opt-pill input{position:absolute;opacity:0;width:1px;height:1px}
.opt-pill span{display:inline-flex;align-items:center;min-height:40px;padding:8px 12px;border:1px solid var(--hair-2);border-radius:2px;font-size:var(--t-note);line-height:1.3;cursor:pointer;background:#fff;transition:border-color var(--t-fast),background-color var(--t-fast),color var(--t-fast)}
.opt-pill:hover span{border-color:var(--muted)}
.opt-pill input:checked + span{border-color:var(--blue);background:#EAF3FB;color:var(--blue-dark);font-weight:500}
.opt-pill input:focus-visible + span{outline:2px solid var(--blue);outline-offset:2px}
.tool .err{margin-top:10px}
.rd-result{margin-top:20px;padding:18px;background:var(--bone);border:1px solid var(--hair)}
.rd-head{display:flex;gap:16px;align-items:flex-start}
.rd-score{flex:none;font-size:34px;font-weight:600;letter-spacing:-.03em;line-height:1;color:var(--blue-dark);font-variant-numeric:tabular-nums}
.rd-score span + span{font-size:16px;color:var(--muted);font-weight:500}
.rd-head h3{font-size:var(--t-body)}
.rd-head p{margin-top:4px;font-size:var(--t-ui);line-height:1.55}
.rd-result .meter{margin-top:14px;height:6px}
.rd-result .meter i{transition:width var(--anim)}
.rd-result .tlink{margin-top:10px}

.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--hair);margin-bottom:20px}
.kpis div{padding:12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.kpis div + div{border-left:1px solid var(--hair)}
.k-l{font-size:12px;color:var(--muted);line-height:1.35}
.k-v{font-size:22px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.25}
@media (max-width:420px){ .k-v{font-size:19px} }
.bc{display:flex;align-items:flex-end;gap:10px;height:140px;border-bottom:1px solid var(--hair);padding-bottom:0}
.bc-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;min-width:0}
.bc-bars{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:3px}
.bc-bars i{display:block;width:min(14px,40%);height:var(--h);border-radius:2px 2px 0 0}
.bc-bars .b{background:var(--c-muted)}
.bc-bars .a{background:var(--c-base)}
.bc-col span{font-size:12px;color:var(--muted);margin-top:6px;transform:translateY(100%);height:0;line-height:1}
.bc{margin-bottom:22px}
.bc-legend{display:flex;gap:18px;font-size:13px;color:var(--muted)}
.bc-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.bc-legend .b{background:var(--c-muted)}.bc-legend .a{background:var(--c-base)}
.ticks.sm li{font-size:var(--t-ui);line-height:1.5}
.prog{display:grid;gap:16px}
.prog li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;font-size:var(--t-ui)}
.prog .meter{grid-column:1/-1;height:6px}
.p-v{font-weight:600;font-variant-numeric:tabular-nums;color:var(--blue-dark)}

/* ---------- motion ---------- */
.grow{transition:width var(--anim),height var(--anim)}
.js .anim:not(.in) .grow{width:0!important}
.js .anim:not(.in) .bc-bars .grow{width:min(14px,40%)!important;height:0!important}
.js .anim:not(.in) .cfchart svg{clip-path:inset(-10px 100% -10px -10px)}
.cf-dot{transition:left .12s linear,top .12s linear,opacity .3s ease 1s}
.js .anim:not(.in) .cf-dot{opacity:0;transition:none}
.anim .cmp-track i:nth-child(2){transition-delay:.25s}
.js .r{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .r.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js .r{opacity:1;transform:none}
  .js .anim:not(.in) .grow{width:var(--w)!important}
  .js .anim:not(.in) .bc-bars .grow{height:var(--h)!important}
  .js .anim:not(.in) .cfchart svg{clip-path:none}
  .js .anim:not(.in) .cf-dot{opacity:1}
  .dash-replay{display:none}
}
@media print{ .js .r{opacity:1;transform:none} }

/* ============================================================================
   19 EQUITY & PRIVATE CAPITAL + compact client stories
   ========================================================================= */
.story-result{margin-top:14px;font-size:var(--t-body);font-weight:600;line-height:1.5;max-width:46ch}
.story-result span{display:block;font-size:var(--t-note);font-weight:600;color:var(--blue-dark);margin-bottom:2px}
.story-more .story-steps{margin:6px 0 4px}
@media (min-width:960px){ .story-foot{align-self:end} }

.hero-note{margin-top:18px;display:inline-block;padding:10px 14px;border-left:2px solid var(--c-dark-1);background:rgba(134,194,242,.08);color:#fff;font-weight:500;font-size:var(--t-ui);line-height:1.5}
.fine-dark{margin-top:10px!important;font-size:var(--t-note);color:var(--on-dark-3)!important}

.rtag{display:inline-block;align-self:flex-start;font-size:12px;font-weight:600;letter-spacing:.04em;line-height:1;padding:6px 8px;border-radius:2px}
.rtag.eq{background:#EAF3FB;color:var(--blue-dark)}
.rtag.dt{background:var(--ink);color:#fff}

.routes{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:1080px){ .routes{grid-template-columns:repeat(3,minmax(0,1fr))} }
.route{display:flex;flex-direction:column;border:1px solid var(--hair);background:var(--paper);padding:var(--card-pad);border-top:3px solid var(--c-base);transition:border-color var(--t-fast)}
.route:hover{border-color:var(--hair-2);border-top-color:var(--c-base)}
.route.debt{background:var(--bone);border-top-color:var(--ink)}
.route.debt:hover{border-top-color:var(--ink)}
.route h3{margin-top:14px}
.route > p{margin-top:12px;font-size:var(--t-ui);line-height:1.65}
.route-vis{margin:auto 0 0;padding-top:20px}
.route-vis > .vis-title{padding-top:18px;border-top:1px solid var(--hair)}
.route .vis-keys.chips li{background:var(--bone)}

.own-row{display:flex;align-items:center;gap:20px}
.donut{flex:none;width:112px;height:112px;transform:rotate(-90deg)}
.donut circle{fill:none;stroke-width:6}
.d-track{stroke:var(--c-base)}
.d-inv{stroke:var(--c-add);stroke-dasharray:var(--p) calc(100 - var(--p));stroke-dashoffset:0;transition:stroke-dasharray .9s var(--ease)}
.js .anim:not(.in) .d-inv{stroke-dasharray:0 100}
.own-legend{display:grid;gap:8px}
.own-legend li{position:relative;padding-left:18px;font-size:var(--t-ui);line-height:1.4}
.own-legend i{position:absolute;left:0;top:.3em;width:10px;height:10px;border-radius:2px}
.own-legend b{display:block;font-size:22px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.own-slider{display:grid;gap:6px;margin-top:16px;font-size:var(--t-note);color:var(--muted)}
.own-slider input{width:100%;accent-color:var(--blue);min-height:28px;cursor:pointer}

.flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:10px}
.flow .node{display:inline-block;padding:6px 10px;border:1px solid var(--hair-2);background:#fff;border-radius:2px;font-size:var(--t-note);font-weight:600;line-height:1.3}
.flow .arr{color:var(--muted);display:inline-flex}
.flow p{flex-basis:100%;font-size:var(--t-note);line-height:1.5;color:var(--muted)}
.ps-item + .ps-item{margin-top:20px;padding-top:20px;border-top:1px solid var(--hair)}
.ps-item h3{font-size:var(--t-body)}

.cmpcards{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:900px){ .cmpcards{grid-template-columns:repeat(3,minmax(0,1fr))} }
.cmpcard{display:flex;flex-direction:column;border:1px solid var(--hair);padding:var(--card-pad);background:var(--paper)}
.cmpcard.debt{background:var(--bone)}
.cmpcard h3{margin-top:12px}
.cmpcard dl{margin:16px 0 0;display:grid;gap:0}
.cmpcard dl div{padding:10px 0;border-top:1px solid var(--hair)}
.cmpcard dt{font-size:13px;font-weight:600;color:var(--muted);line-height:1.4}
.cmpcard dd{margin:2px 0 0;font-size:var(--t-ui);line-height:1.5}
.cmpcard dl div:first-child dd{font-weight:500}
@media (prefers-reduced-motion:reduce){ .js .anim:not(.in) .d-inv{stroke-dasharray:var(--p) calc(100 - var(--p))} }

.route-vis .ticks{margin-bottom:18px}

/* ============================================================================
   20 FLOATING CONTACT ACTIONS + GUIDED CHAT (all pages)
   Order top → bottom: chat · call · WhatsApp. Sits below the header (z 200)
   and mobile menu (z 190), above page content.
   ========================================================================= */
:root{ --fab-size:52px; --fab-gap:12px; --fab-right:24px; --fab-bottom:24px; --wa-green:#1A9E4B; --wa-green-dark:#15833E }
@media (max-width:767px){ :root{ --fab-size:48px; --fab-gap:10px; --fab-right:14px; --fab-bottom:calc(16px + env(safe-area-inset-bottom, 0px)) } }

.fab{position:fixed;right:var(--fab-right);bottom:var(--fab-bottom);z-index:150;display:flex;flex-direction:column;gap:var(--fab-gap);
  transform:translateY(calc(-1 * var(--fab-lift, 0px)));transition:opacity .2s ease,visibility .2s,transform .2s ease}
.fab-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--fab-size);height:var(--fab-size);
  border-radius:50%;border:1px solid rgba(255,255,255,.26);color:#fff;text-decoration:none;cursor:pointer;padding:0;
  box-shadow:0 6px 18px rgba(7,26,47,.18),0 1px 3px rgba(7,26,47,.14);
  transition:transform var(--t-fast),background-color var(--t-fast),box-shadow var(--t-fast)}
.fab-btn svg{display:block}
.fab-chat{background:var(--blue)}
.fab-chat:hover{background:var(--blue-dark)}
.fab-chat[aria-expanded="true"]{background:var(--navy)}
.fab-call{background:var(--navy)}
.fab-call:hover{background:#0E2A47}
.fab-wa{background:var(--wa-green)}
.fab-wa:hover{background:var(--wa-green-dark)}
.fab-btn:hover{transform:scale(1.06);box-shadow:0 8px 22px rgba(7,26,47,.22),0 2px 4px rgba(7,26,47,.14)}
.fab-btn:active{transform:scale(.97)}
.fab-btn:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.fab-tip{position:absolute;right:calc(100% + 10px);top:50%;transform:translate(4px,-50%);white-space:nowrap;pointer-events:none;
  padding:6px 10px;border-radius:2px;background:var(--navy);color:#fff;font-size:13px;font-weight:500;line-height:1.2;
  opacity:0;visibility:hidden;transition:opacity .15s ease,transform .15s ease,visibility .15s}
@media (hover:hover) and (pointer:fine){
  .fab-btn:hover .fab-tip,.fab-btn:focus-visible .fab-tip{opacity:1;visibility:visible;transform:translate(0,-50%)}
}
@media (hover:none){ .fab-tip{display:none} }
.fab-wa.nudge{animation:fab-nudge 1.6s ease-out 1}
@keyframes fab-nudge{0%{box-shadow:0 6px 18px rgba(7,26,47,.18),0 0 0 0 rgba(26,158,75,.35)}100%{box-shadow:0 6px 18px rgba(7,26,47,.18),0 0 0 12px rgba(26,158,75,0)}}
body.menu-open .fab,body.fab-hidden .fab{opacity:0;visibility:hidden;pointer-events:none}

/* guided chat panel */
.chatbot{position:fixed;z-index:160;right:calc(var(--fab-right) + var(--fab-size) + 14px);bottom:var(--fab-bottom);
  width:340px;max-height:min(520px,calc(100vh - var(--hdr-h) - 48px));display:flex;flex-direction:column;
  background:var(--paper);color:var(--ink);border:1px solid var(--hair);border-radius:4px;overflow:hidden;
  box-shadow:0 18px 48px rgba(7,26,47,.18),0 2px 6px rgba(7,26,47,.08)}
.chatbot[hidden]{display:none!important}
.chatbot.opening{animation:chat-in .18s ease-out}
@keyframes chat-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.chatbot-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 14px 14px 18px;background:var(--navy);color:#fff}
.chatbot-head h2{font-size:var(--t-ui);font-weight:600;color:#fff;letter-spacing:-.005em}
.chatbot-head p{font-size:13px;color:var(--on-dark-2);line-height:1.4;margin-top:2px}
.chatbot-close{flex:none;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:#fff;border:1px solid var(--hair-dark);border-radius:2px;cursor:pointer;transition:border-color var(--t-fast)}
.chatbot-close:hover{border-color:rgba(255,255,255,.5)}
.chatbot-close:focus-visible{outline:2px solid var(--blue-on-dark);outline-offset:2px}
.chatbot-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 16px 8px;display:flex;flex-direction:column;gap:10px;background:var(--bone)}
.cb-msg{max-width:88%;padding:10px 12px;border-radius:4px;font-size:var(--t-note);line-height:1.55}
.cb-bot{align-self:flex-start;background:#fff;border:1px solid var(--hair)}
.cb-user{align-self:flex-end;background:var(--navy);color:#fff}
.cb-opts{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.cb-opt{display:inline-flex;align-items:center;min-height:38px;padding:7px 12px;border:1px solid var(--hair-2);border-radius:2px;background:#fff;color:var(--ink);font-size:var(--t-note);font-weight:500;line-height:1.3;cursor:pointer;text-align:left;text-decoration:none;transition:border-color var(--t-fast),color var(--t-fast)}
.cb-opt:hover{border-color:var(--blue);color:var(--blue-dark)}
.cb-opt.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.cb-opt.primary:hover{background:var(--blue-dark);color:#fff}
.cb-opt.link{border:0;background:none;padding:4px 0;min-height:32px;color:var(--blue-dark);text-decoration:underline;text-underline-offset:3px}
.chatbot-foot{padding:10px 16px 12px;font-size:12px;line-height:1.45;color:var(--muted);border-top:1px solid var(--hair);background:#fff}
@media (max-width:767px){
  .chatbot{left:14px;right:14px;width:auto;bottom:var(--fab-bottom);max-height:min(560px,72vh)}
  body.chat-open .fab{opacity:0;visibility:hidden;pointer-events:none}
}
@media (prefers-reduced-motion:reduce){ .fab-wa.nudge,.chatbot.opening{animation:none} .fab-btn:hover{transform:none} }
@media print{ .fab,.chatbot{display:none!important} }
/* keep the first-screen call to action clear of the floating buttons on phones */
@media (max-width:767px){ .hero .row-btns,.phero .row-btns{padding-right:calc(var(--fab-size) + var(--fab-right))} }

/* ============================================================================
   21 PREMIUM LAYER — editorial type, hero atmosphere, cards, motion system
   Builds on the existing tokens. All motion is opacity/transform only and is
   switched off under prefers-reduced-motion.
   ========================================================================= */
:root{ --rise:16px; --dur:.7s; --ease-out:cubic-bezier(.16,1,.3,1); --lift:-5px;
  --shadow-card:0 1px 2px rgba(7,26,47,.04),0 12px 32px -12px rgba(7,26,47,.18) }
@media (max-width:767px){ :root{ --rise:8px; --lift:0px } }

/* editorial display type */
@media (min-width:1024px){
  .hero h1{font-size:clamp(48px,4.4vw,62px);letter-spacing:-.032em;line-height:1.06}
  .phero h1{font-size:clamp(44px,3.8vw,56px);letter-spacing:-.03em;line-height:1.08}
  h2{letter-spacing:-.025em}
}
.sec-head h2{max-width:24ch}

/* hero atmosphere: soft light-blue glow + fine grid, masked (static, no animation) */
.hero,.phero{position:relative;isolation:isolate;overflow:hidden}
.hero::before,.phero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 480px at 88% 8%,rgba(0,103,185,.30),transparent 62%),
    radial-gradient(700px 420px at 0% 100%,rgba(134,194,242,.08),transparent 60%)}
.hero::after,.phero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 70% 80% at 80% 30%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 80% at 80% 30%,#000 20%,transparent 75%)}
.dash{background:rgba(9,32,58,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}

/* compact header once scrolled */
.phdr-in{transition:height .3s var(--ease-out)}
.brand-logo{transition:height .3s var(--ease-out)}
.phdr{transition:box-shadow .3s ease,background-color .3s ease}
.phdr.scrolled{background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);box-shadow:0 1px 0 var(--hair),0 8px 24px -16px rgba(7,26,47,.25)}
@media (min-width:1024px){
  .phdr.scrolled .phdr-in{height:64px}
  .phdr.scrolled .brand-logo{height:36px}
}
body.menu-open .phdr.scrolled .phdr-in{height:var(--hdr-h)}

/* service cards */
.svc3.cards{border-top:0;gap:20px}
@media (min-width:900px){ .svc3.cards{gap:24px} }
.svc3.cards .svc{padding:28px;border:1px solid var(--hair);border-radius:4px;background:var(--paper);
  transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .35s ease,background-color .35s ease}
@media (min-width:900px){ .svc3.cards .svc,.svc3.cards .svc:first-child,.svc3.cards .svc:last-child{padding:32px} .svc3.cards .svc + .svc{border-left:1px solid var(--hair)} }
.svc-top{display:flex;justify-content:space-between;align-items:center}
.svc-ico,.ind-ico{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:4px;background:#EEF4FA;color:var(--blue-dark);transition:transform .35s var(--ease-out),background-color .35s ease}
.svc3.cards .svc h3{margin-top:22px}
@media (hover:hover){
  .svc3.cards .svc:hover{transform:translateY(var(--lift));box-shadow:var(--shadow-card);border-color:#CFDDEB;background:#FCFDFE}
  .svc3.cards .svc:hover .svc-ico{transform:translateY(-2px);background:#E3EEF8}
}

/* who we work with */
.inds{display:grid;grid-template-columns:1fr;gap:1px;background:var(--hair);border:1px solid var(--hair)}
@media (min-width:640px){ .inds{grid-template-columns:1fr 1fr} }
@media (min-width:1080px){ .inds{grid-template-columns:repeat(4,minmax(0,1fr))} }
.ind{background:var(--paper);padding:28px;transition:background-color .3s ease}
.ind h3{margin-top:18px;font-size:var(--t-body)}
.ind p{margin-top:8px;font-size:var(--t-ui);line-height:1.6;color:var(--muted)}
@media (hover:hover){ .ind:hover{background:#FAFBFD} .ind:hover .ind-ico{transform:translateY(-2px)} }

/* premium trust band */
.trust{position:relative;isolation:isolate;overflow:hidden}
.trust::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(800px 400px at 100% 0%,rgba(0,103,185,.22),transparent 60%)}
.trust .usps{border-top-color:var(--hair-dark)}
.trust .usp{border-bottom-color:var(--hair-dark)}
@media (min-width:760px){ .trust .usp:nth-child(odd){border-right-color:var(--hair-dark)} }
.trust .usp h3{color:#fff}
.trust .usp p{color:var(--on-dark-2)}
.trust .num{color:var(--blue-on-dark)}
.lenders{margin-top:clamp(36px,5vw,56px);display:grid;gap:12px 40px;grid-template-columns:1fr;align-items:baseline}
@media (min-width:1000px){ .lenders{grid-template-columns:auto 1fr} }
.lenders-h{font-size:var(--t-note);font-weight:600;color:var(--on-dark-2)}
.lenders ul{display:flex;flex-wrap:wrap;gap:8px}
.lenders li{padding:7px 12px;border:1px solid var(--hair-dark);border-radius:2px;font-size:var(--t-note);font-weight:500;color:#fff;background:rgba(255,255,255,.03)}
.lenders-note{grid-column:1/-1;font-size:13px;color:var(--on-dark-3)}

/* guides / insights cards */
.guides{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:640px){ .guides{grid-template-columns:1fr 1fr} }
@media (min-width:1080px){ .guides{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px} }
.guide{display:flex;flex-direction:column;border:1px solid var(--hair);border-radius:4px;overflow:hidden;background:var(--paper);text-decoration:none;color:inherit;
  transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .35s ease}
.thumb{display:block;aspect-ratio:5/3;overflow:hidden;border-bottom:1px solid var(--hair)}
.thumb-svg{display:block;width:100%;height:100%;transition:transform .6s var(--ease-out)}
.guide-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 18px}
.guide-tag{font-size:12px;font-weight:600;color:var(--blue-dark);letter-spacing:.02em}
.guide h3{margin-top:8px;font-size:var(--t-body);line-height:1.4;flex:1}
.guide .tlink{margin-top:14px;align-self:flex-start}
@media (hover:hover){
  .guide:hover{transform:translateY(var(--lift));box-shadow:var(--shadow-card);border-color:#CFDDEB}
  .guide:hover .thumb-svg{transform:scale(1.045)}
  .guide:hover .tlink::after{opacity:1}
  .guide:hover .tlink svg{transform:translateX(3px)}
}

/* other cards: gentle lift */
@media (hover:hover){
  .route,.cmpcard,.story{transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .35s ease}
  .route:hover,.cmpcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-card)}
  .story:hover{box-shadow:var(--shadow-card)}
}

/* final CTA band */
.cta-band{position:relative;isolation:isolate;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(700px 360px at 90% 120%,rgba(0,103,185,.35),transparent 65%)}
.cta-band h2{font-size:clamp(28px,3vw,40px);letter-spacing:-.025em}

/* footer refinement */
.pftr{position:relative}
.pftr::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(134,194,242,.45),transparent)}

/* ---------- motion system ---------- */
/* hero: staggered entrance on load */
@keyframes rise-in{from{opacity:0;transform:translateY(var(--rise))}to{opacity:1;transform:none}}
@keyframes fade-left{from{opacity:0;transform:translateX(calc(var(--rise) * 1.25))}to{opacity:1;transform:none}}
.js .hero-copy > *,.js .phero-in > *{animation:rise-in var(--dur) var(--ease-out) both}
.js .hero-copy > :nth-child(1),.js .phero-in > :nth-child(1){animation-delay:.05s}
.js .hero-copy > :nth-child(2),.js .phero-in > :nth-child(2){animation-delay:.17s}
.js .hero-copy > :nth-child(3),.js .phero-in > :nth-child(3){animation-delay:.29s}
.js .hero-copy > :nth-child(4),.js .phero-in > :nth-child(4){animation-delay:.41s}
.js .phero-in > :nth-child(5){animation-delay:.53s}
.js .phero-in > :nth-child(6){animation-delay:.62s}
.js .hero .dash{animation:fade-left .8s var(--ease-out) .5s both}
.js .hero .hero-facts{animation:rise-in var(--dur) var(--ease-out) .65s both}
/* hero chart and bars begin after the panel has arrived */
.hero .dash .grow,.hero .dash .cfchart svg{transition-delay:.75s}

/* scroll reveals: opacity + short rise; siblings stagger via --i (set in JS) */
.js .r{transform:translateY(var(--rise));transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);transition-delay:calc(var(--i, 0) * 90ms)}
.js .r.in{transform:none}
.js .r.r-x{transform:translateX(calc(var(--rise) * -1))}
.js .r.r-x.in{transform:none}
/* card hover must win over reveal transform once revealed */
@media (hover:hover){
  .js .svc3.cards .svc.r.in:hover,.js .guide.r.in:hover{transform:translateY(var(--lift))}
  .js .route.r.in:hover,.js .cmpcard.r.in:hover{transform:translateY(-4px)}
}

/* CTA band entrance */
.js .cta-band .shell > *{opacity:0;transform:translateY(var(--rise));transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.js .cta-band .shell > :nth-child(2){transition-delay:.15s}
.js .cta-band.in .shell > *{opacity:1;transform:none}

/* chatbot: softer opening */
@keyframes chat-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.chatbot{transform-origin:100% 100%}
.chatbot.opening{animation:chat-in .26s var(--ease-out)}

@media (prefers-reduced-motion:reduce){
  .js .hero-copy > *,.js .phero-in > *,.js .hero .dash,.js .hero .hero-facts{animation:none}
  .js .r,.js .r.r-x{transform:none;transition:none}
  .js .cta-band .shell > *{opacity:1;transform:none;transition:none}
  .svc3.cards .svc,.guide,.thumb-svg,.route,.cmpcard,.story,.phdr-in,.brand-logo{transition:none}
  .guide:hover .thumb-svg{transform:none}
  .hero .dash .grow,.hero .dash .cfchart svg{transition-delay:0s}
}
@media print{ .hero::before,.hero::after,.phero::before,.phero::after{display:none} .js .cta-band .shell > *{opacity:1;transform:none} }
.band-navy .sec-head h2,.band-navy h2{color:#fff}
.band-navy .sec-head .lead{color:var(--on-dark-2)}

/* ============================================================================
   22 INNER-PAGE HERO — one rule set for Finance, Virtual CFO, Equity,
   About Us, Contact (and 404). The hero uses the global .shell, so the label,
   heading, paragraph and button share the page's left edge. The heading gets
   the full content column on desktop and wraps naturally; no nowrap, no
   font-size change. This is the ONLY place .phero measures are set.
   ========================================================================= */
.phero-in > *{margin-inline:0}                       /* nothing centred: one left edge */
.phero h1{max-width:min(100%,64rem);line-height:1.1;text-wrap:pretty}
.phero .lead{max-width:min(100%,46rem);margin-top:16px}
.phero .hero-note{max-width:min(100%,46rem)}
.phero .row-btns{margin-top:28px}

@media (min-width:1280px){
  .phero-in{padding-block:clamp(56px,5.5vw,88px) clamp(40px,4.5vw,64px)}
  .phero h1{max-width:100%;line-height:1.08}         /* full content column */
  .phero .lead{max-width:min(100%,62rem)}            /* ~992px */
  .phero .hero-note{max-width:min(100%,62rem)}
}
@media (max-width:767px){
  .phero h1{max-width:100%;line-height:1.14}
  .phero .lead,.phero .hero-note{max-width:100%}
  .phero .jump{padding-right:calc(var(--fab-size) + var(--fab-right))}
}

/* ============================================================================
   23 PAGE GRID — one container for every page
   Wider desktop measure so content is not a narrow column in the middle, with
   the side gutters kept generous. Same container for the header, every
   section, the heroes and the footer, so all edges line up.
   ========================================================================= */
:root{ --shell:1320px }
@media (min-width:1600px){ :root{ --shell:1360px } }
.shell{width:min(100% - var(--pad) * 2, var(--shell));max-width:none;margin-inline:auto;padding-inline:0}

/* two-column sections: balanced columns, a little more air between them */
@media (min-width:900px){
  .about,.cols2{column-gap:clamp(48px,5vw,88px)}
}
@media (min-width:1000px){
  .contact{column-gap:clamp(48px,5vw,88px)}
}
@media (min-width:1024px){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,500px);column-gap:clamp(48px,4.5vw,80px)}
  .hero-copy h1{max-width:100%}
}