/* Blue Chip Advantage — canonical replica of current Figma flat design (deJrGOEVgnyeW6g6TuqFys)
   Frames: HOME 33:5, ABOUT 63:450, CONTACT 64:774, PRE LOADER 58:188. Design width 1904. */
:root{
  --navy:#162838;
  --blue:#0075E6;
  --blue2:#3383FD;
  --orange:#BF5626;
  --orange2:#94371E;
  --light:#EBF2F5;
  --ink:#161616;
  --grey:#80807D;
  --line:#787878;
  --pill:#1E242C;
  --pagew:1904px;     /* figma design width */
  --gutter:60px;      /* figma left/right content margin */
  --maxw:1784px;      /* content area at 1904 (1904 - 60*2) */
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,.disp{font-family:'Montserrat',system-ui,sans-serif;font-weight:400}
.wrap{width:var(--maxw);max-width:calc(100% - (var(--gutter) * 2));margin:0 auto}

/* ---------- PRE LOADER (58:188 -> 58:420 -> 58:435) — 3-beat sequence ---------- */
#preloader{position:fixed;inset:0;z-index:9999;background:var(--navy);color:#fff;overflow:hidden;will-change:transform;transition:transform .9s cubic-bezier(.76,0,.24,1)}
#preloader.done{transform:translateY(-100%)}
body.preloading{overflow:hidden;height:100vh}
/* center stage: line 1 text, then the B monogram */
.pl-stage{position:absolute;left:0;right:0;top:48.4%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;min-height:100px;pointer-events:none}
.pl-line{position:absolute;font-family:'Montserrat';font-weight:500;font-size:24px;letter-spacing:-.005em;color:#fff;opacity:0;transition:opacity .55s ease}
.pl-mark{position:absolute;width:100px;height:auto;opacity:0;transition:opacity .55s ease}
/* lower line: reads as one sentence across the beats */
.pl-low{position:absolute;left:0;right:0;bottom:8.9%;height:26px;text-align:center}
.pl-low span{position:absolute;left:0;right:0;font-family:'Montserrat';font-weight:400;font-size:20px;letter-spacing:-.075em;color:#fff;opacity:0;transform:translateY(10px);transition:opacity .75s cubic-bezier(.22,.61,.36,1),transform .75s cubic-bezier(.22,.61,.36,1)}
/* progress bar */
.pl-track{position:absolute;left:var(--gutter);right:var(--gutter);bottom:3.95%;height:.5px;background:rgba(255,255,255,.4)}
.pl-bar{position:absolute;left:0;top:-.75px;height:2px;background:#fff;width:0;transition:width 1.15s cubic-bezier(.45,0,.15,1)}
/* beats */
#preloader.beat1 .pl-line1{opacity:1}
#preloader.beat1 .pl-low1{opacity:1;transform:none}
#preloader.beat1 .pl-bar{width:34%}
#preloader.beat2 .pl-mark{opacity:1}
#preloader.beat2 .pl-low2{opacity:1;transform:none;transition-delay:.12s}
#preloader.beat2 .pl-bar{width:76%}
#preloader.beat3 .pl-mark{opacity:1}
#preloader.beat3 .pl-low2{opacity:1;transform:none}
#preloader.beat3 .pl-bar{width:100%}

/* ---------- SHARED HEADER / NAV ---------- */
.topbar{position:absolute;top:0;left:0;right:0;z-index:40}
.topbar .inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:36px}
.logo img{height:46px;width:auto;filter:brightness(0) invert(1)}
.nav{display:flex;align-items:center;gap:40px}
.nav a{font-family:'Montserrat';font-size:13px;font-weight:500;letter-spacing:.02em;text-transform:uppercase;color:#fff;opacity:.95}
.nav a:hover{opacity:.6}
.apply{display:inline-flex;align-items:center;gap:9px;background:var(--blue);color:#fff;font-family:'Montserrat';font-weight:400;font-size:13px;letter-spacing:.02em;text-transform:uppercase;padding:14px 22px;border-radius:99px;transition:background .25s}
.apply:hover{background:var(--orange)}
.apply .dot{width:11px;height:11px;border-radius:50%;background:var(--blue2)}
.navtoggle{display:none;background:none;border:0;color:#fff;font-size:26px;cursor:pointer;z-index:60}

/* ---------- HERO ---------- */
.hero{position:relative;height:1163px;max-height:86vh;min-height:560px;color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-bg::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.2)}
.hero-inner{position:relative;z-index:3;height:100%;display:flex;flex-direction:column;justify-content:flex-start;padding-top:455px}
.hero h1{font-family:'Montserrat';font-weight:400;line-height:1.0;letter-spacing:-.004em;font-size:70px;max-width:900px}
.hero-sub{margin-top:40px;max-width:460px;font-family:'Montserrat';font-weight:400;font-size:22px;line-height:1.5;letter-spacing:-.002em}

/* ---------- DARK INTRO BAND (navy) ---------- */
.introband{background:var(--navy);color:#fff;padding:190px 0}
.introband .row{display:grid;grid-template-columns:380px 1fr 320px;gap:72px;align-items:start}
.introband .statement{font-family:'Montserrat';font-weight:500;font-size:40px;line-height:1.05;letter-spacing:-.005em}
.introband .para{font-family:'Montserrat';font-weight:400;font-size:22px;line-height:1.45;letter-spacing:-.002em}
.introband .para p+p{margin-top:1.1em}
.introband .photo{width:100%;aspect-ratio:479/648;object-fit:cover}
.introband .sublabel{font-family:'Inter';font-size:13px;color:rgba(255,255,255,.6);margin-top:24px}

/* ---------- STATS (white) ---------- */
.stats{padding:130px 0}
.stats .lead{font-family:'Montserrat';font-weight:400;font-size:22px;line-height:1.35;letter-spacing:-.002em;color:var(--navy);max-width:380px;margin-bottom:70px}
.stat-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:40px;padding:26px 0;border-top:1px solid #d8dde1}
.stat-row:last-child{border-bottom:1px solid #d8dde1}
.stat-row .num{grid-column:2;font-family:'Montserrat';font-weight:300;font-size:106px;line-height:1.0;color:var(--navy);text-align:right;letter-spacing:-.01em}
.stat-row .lbl{grid-column:3;font-family:'Montserrat';font-weight:400;font-size:18px;color:var(--navy);justify-self:start;padding-left:48px}
.stat-row .num.pending{color:var(--navy);opacity:.38}   /* placeholder figures: same hue, muted so the row reads clean + aligned */

/* ---------- CENTERED LEAD ---------- */
.lead-block{padding:30px 0 110px}
.lead-block h2{font-family:'Montserrat';font-weight:500;font-size:40px;line-height:1.08;letter-spacing:-.01em;color:var(--navy);max-width:790px}

/* ---------- TWO CARDS (services) ---------- */
.cards2{display:grid;grid-template-columns:1fr 1fr;gap:72px;padding-bottom:120px}
.svc .ph{width:100%;aspect-ratio:873/766;overflow:hidden}
.svc .ph img{width:100%;height:100%;object-fit:cover}
.svc h3{font-family:'Montserrat';font-weight:500;font-size:34px;line-height:1.1;letter-spacing:-.01em;color:var(--navy);margin:32px 0 18px}
.svc p{font-family:'Montserrat';font-weight:400;font-size:16px;line-height:1.55;color:#3a3f45;max-width:46ch;margin-bottom:30px}
.pill{display:inline-flex;align-items:center;gap:10px;background:var(--blue);color:#fff;font-family:'Montserrat';font-weight:400;font-size:13px;letter-spacing:.02em;padding:14px 24px;border-radius:99px;transition:background .25s}
.pill:hover{background:var(--orange)}
.pill .dot{width:11px;height:11px;border-radius:50%;background:var(--blue2)}

/* ---------- FULL-WIDTH BAND w/ overlay ---------- */
.band{position:relative;width:100%;height:800px;max-height:60vw;overflow:hidden;color:#fff}
.band>img{width:100%;height:100%;object-fit:cover}
.band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,16,26,.15),rgba(8,16,26,.5))}
.band .overlay{position:absolute;inset:0;z-index:3}
.band .overlay .in{position:absolute;left:var(--gutter);right:var(--gutter);bottom:60px;display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:end}
.band h2{font-family:'Montserrat';font-weight:400;font-size:70px;line-height:1.0;letter-spacing:-.004em}
.band .copy p{font-family:'Montserrat';font-weight:400;font-size:16px;line-height:1.6;margin-bottom:24px;max-width:50ch}

/* ---------- PERFORMANCE / INVESTMENT SERVICES (light) ---------- */
.perf{background:var(--light);padding:140px 0}
.perf .head{display:grid;grid-template-columns:1fr 1fr;gap:72px;margin-bottom:50px;align-items:start}
.perf .head h2{font-family:'Montserrat';font-weight:500;font-size:40px;line-height:1.1;letter-spacing:-.01em;color:var(--navy)}
.perf .head p{font-family:'Montserrat';font-weight:400;font-size:16px;line-height:1.55;color:#3a3f45}
.chartcard{background:#fff;border-radius:8px;padding:38px;box-shadow:0 24px 60px -28px rgba(22,40,56,.28);max-width:1150px;margin:0 auto}
.chart-tabs{display:flex;gap:26px;border-bottom:1px solid #e7e7ea;margin-bottom:22px}
.chart-tabs button{background:none;border:0;font-family:'Inter';font-size:16px;font-weight:500;color:#9aa0a6;cursor:pointer;padding:0 0 14px;display:flex;align-items:center;gap:8px;border-bottom:2px solid transparent;margin-bottom:-1px}
.chart-tabs button.on{color:var(--blue);border-bottom-color:var(--blue)}
.chart-tabs svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.chart-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.ranges{display:inline-flex;background:#f1f3f5;border-radius:8px;padding:4px;gap:2px}
.ranges button{border:0;background:none;font-family:'Inter';font-size:14px;font-weight:600;color:#5f6469;padding:8px 18px;border-radius:6px;cursor:pointer}
.ranges button.on{background:var(--blue);color:#fff}
.bench{display:flex;align-items:center;gap:12px;font-family:'Inter';font-size:15px;color:#3a3f45}
.toggle{position:relative;width:46px;height:26px;border-radius:99px;background:#d4d7db;border:0;cursor:pointer;transition:background .2s;flex:0 0 auto}
.toggle::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.toggle.on{background:var(--blue)}
.toggle.on::after{left:23px}
.chart-wrap{position:relative;height:460px}
.chart-wrap.hide{display:none}
#perfTable{width:100%;border-collapse:collapse;font-family:'Inter';font-size:14px;display:none}
#perfTable.show{display:table}
#perfTable th,#perfTable td{text-align:left;padding:10px 14px;border-bottom:1px solid #eef0f2}
#perfTable th{color:#9aa0a6;font-weight:600;text-transform:uppercase;font-size:12px;letter-spacing:.05em}
.legend{display:flex;gap:28px;justify-content:center;margin-top:20px;font-family:'Inter';font-size:15px;color:#3a3f45}
.legend span{display:inline-flex;align-items:center;gap:9px}
.legend .ln{width:26px;height:3px;border-radius:2px}

/* ---------- CAPABILITIES ---------- */
.caps{padding:140px 0}
.caps .wrap{width:1564px;max-width:calc(100% - 380px)}
.caps .sub{font-family:'Montserrat';font-weight:500;font-size:20px;color:var(--navy);margin-bottom:30px}
.caps h2{font-family:'Montserrat';font-weight:500;font-size:40px;line-height:1.12;letter-spacing:-.01em;color:var(--navy);max-width:730px;margin-bottom:60px}
.caps .grid{display:grid;grid-template-columns:1fr 1fr;gap:42px}
.caps .item{position:relative;color:#fff}
.caps .item .ph{width:100%;aspect-ratio:742/391;overflow:hidden}
.caps .item .ph img{width:100%;height:100%;object-fit:cover}
.caps .item .cap{position:absolute;left:30px;bottom:26px;display:flex;align-items:center;gap:14px;font-family:'Montserrat';font-weight:500;font-size:22px}
.caps .item .arr{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:18px}

/* ---------- CAN WE HELP (home/about) ---------- */
.help{padding:90px 0 60px}
.help-top{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;flex-wrap:wrap;margin-bottom:46px}
.help h2{font-family:'Montserrat';font-weight:500;font-size:40px;letter-spacing:-.001em;line-height:1;color:var(--navy)}
.help-social{display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.help-social a{display:flex;align-items:center;gap:10px;font-family:'Montserrat';font-size:12px;font-weight:400;text-transform:uppercase;letter-spacing:-.015em;color:var(--navy)}
.help-social .d{width:8px;height:8px;border-radius:50%;background:var(--navy)}
.tiles{display:grid;grid-template-columns:repeat(4,221px);justify-content:space-between;gap:26px}
.tiles .ph{aspect-ratio:1/1;overflow:hidden}
.tiles .ph img{width:100%;height:100%;object-fit:cover}

/* ---------- FOOTER ---------- */
footer{background:var(--navy);color:#fff;padding:72px 0 36px}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr auto;gap:40px;align-items:start;margin-bottom:54px}
.foot-grp h4{font-family:'Montserrat';font-weight:500;font-size:20px;margin-bottom:24px}
.foot-grp a,.foot-grp p{display:block;font-family:'Montserrat';font-weight:400;font-size:13px;text-transform:uppercase;letter-spacing:.01em;color:rgba(255,255,255,.85);margin-bottom:12px;line-height:1.7}
.foot-grp p{text-transform:none;letter-spacing:0;color:rgba(255,255,255,.7)}
.foot-brand{justify-self:end;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.foot-brand img{height:54px;width:auto;filter:brightness(0) invert(1);opacity:.95}
.foot-brand .view{display:inline-flex;gap:8px;align-items:center;font-family:'Inter';font-size:15px;opacity:.92}
.foot-brand .smsf{font-family:'Inter';font-size:9.4px;letter-spacing:.29em;opacity:.7;text-transform:uppercase}
.foot-bottom{display:flex;gap:60px;flex-wrap:wrap;padding-top:22px;border-top:1px solid rgba(255,255,255,.14)}
.foot-bottom span{font-family:'Montserrat';font-size:11.3px;font-weight:400;letter-spacing:.022em;color:rgba(255,255,255,.6)}

/* ---------- ABOUT PAGE ---------- */
.about-intro{padding:140px 0}
.about-intro .row{display:grid;grid-template-columns:380px 1fr;gap:80px;align-items:start}
.about-intro .statement{font-family:'Montserrat';font-weight:400;font-size:40px;line-height:1.05;letter-spacing:-.005em;color:var(--navy)}
.about-intro .para{font-family:'Montserrat';font-weight:400;font-size:22px;line-height:1.45;color:var(--navy)}
.about-intro .photo{grid-column:2;margin-top:30px;width:611px;max-width:100%;aspect-ratio:611/378;object-fit:cover}
.about-band{position:relative;width:100%;height:1190px;max-height:62vw;overflow:hidden;color:#fff}
.about-band>img{width:100%;height:100%;object-fit:cover}
.about-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,16,26,.1),rgba(8,16,26,.45))}
.about-band .bandtext{position:absolute;left:158px;bottom:120px;z-index:3;font-family:'Montserrat';font-weight:400;font-size:61px;line-height:1.16;color:#fff}
.about-band .bandpara{position:absolute;right:195px;top:50%;transform:translateY(-50%);z-index:3;width:361px;font-family:'Montserrat';font-weight:400;font-size:16px;line-height:1.55;color:#fff}

/* ---------- CONTACT PAGE ---------- */
.contact{position:relative;background:var(--navy);color:#fff;min-height:1163px;overflow:hidden}
.contact .union{position:absolute;left:56.5%;top:27%;width:51%;height:auto;opacity:1;z-index:0}
.contact-inner{position:relative;z-index:3;padding-top:200px;padding-bottom:60px}
.contact h1{font-family:'Montserrat';font-weight:500;font-size:40px;letter-spacing:-.001em;margin-bottom:50px}
.cform{width:600px;max-width:100%}
.cform .tabs{display:flex;gap:30px;font-family:'Montserrat';font-weight:400;font-size:14px;text-transform:uppercase;letter-spacing:-.012em;margin-bottom:14px}
.cform .tabs .on{color:#fff}
.cform .tabs .off{color:#A0C5CF}
.cform .field{border-bottom:1px solid rgba(255,255,255,.4);margin-bottom:36px}
.cform input,.cform textarea{width:100%;background:transparent;border:0;color:#fff;font-family:'Montserrat';font-weight:400;font-size:13px;letter-spacing:-.02em;padding:6px 8px 9px;outline:none}
.cform input::placeholder,.cform textarea::placeholder{color:rgba(255,255,255,.9);text-transform:uppercase;font-size:10px;letter-spacing:.01em}
.cform textarea{resize:vertical;min-height:80px}
.cform .row2{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.cform .meta{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.cform .hear{font-family:'Montserrat';font-size:10px;text-transform:uppercase;color:rgba(255,255,255,.9)}
.cform .submit{background:none;border:0;color:#fff;font-family:'Montserrat';font-weight:400;font-size:14px;text-transform:uppercase;letter-spacing:-.012em;cursor:pointer}
.contact-foot{position:relative;z-index:3;display:flex;gap:60px;flex-wrap:wrap;padding-top:40px;margin-top:40px;border-top:1px solid var(--line)}
.contact-foot .cf{font-family:'Montserrat';font-weight:400;font-size:12px;text-transform:uppercase;letter-spacing:-.016em;line-height:1.9;color:#fff;white-space:pre-line}

/* ---------- MOTION LAYER (progressive enhancement, gated on html.js) ---------- */
html.js .introband,html.js .stats,html.js .lead-block,html.js #fund,html.js .band .overlay .in,html.js .perf .head,html.js .perf .chartcard,html.js .caps .sub,html.js .caps h2,html.js .caps .grid,html.js .help-top,html.js .tiles,html.js .about-intro .row,html.js .about-band .bandtext,html.js .about-band .bandpara,html.js .contact-inner{opacity:0;transform:translateY(26px);transition:opacity .85s cubic-bezier(.22,.61,.36,1),transform .85s cubic-bezier(.22,.61,.36,1)}
html.js .is-in{opacity:1 !important;transform:none !important}
/* hero entrance after the pre-scroller wipe */
html.js .hero h1,html.js .hero-sub{opacity:0;transform:translateY(22px);transition:opacity 1s cubic-bezier(.22,.61,.36,1),transform 1s cubic-bezier(.22,.61,.36,1)}
html.js body.entered .hero h1{opacity:1;transform:none;transition-delay:.05s}
html.js body.entered .hero-sub{opacity:1;transform:none;transition-delay:.24s}
/* nav: sticky + condense on scroll */
.topbar{position:fixed;transition:background .4s ease,backdrop-filter .4s ease}
.topbar .inner{transition:padding .4s ease}
.topbar.scrolled{background:rgba(18,32,46,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.topbar.scrolled .inner{padding-top:18px;padding-bottom:18px}
/* micro hover */
.svc .ph img,.caps .item .ph img,.tiles .ph img{transition:transform .7s cubic-bezier(.22,.61,.36,1)}
.svc:hover .ph img,.caps .item:hover .ph img,.tiles .ph:hover img{transform:scale(1.035)}
@media(prefers-reduced-motion:reduce){
  html.js .introband,html.js .stats,html.js .lead-block,html.js #fund,html.js .band .overlay .in,html.js .perf .head,html.js .perf .chartcard,html.js .caps .sub,html.js .caps h2,html.js .caps .grid,html.js .help-top,html.js .tiles,html.js .about-intro .row,html.js .about-band .bandtext,html.js .about-band .bandpara,html.js .contact-inner,html.js .hero h1,html.js .hero-sub{opacity:1;transform:none;transition:none}
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1300px){
  .hero h1,.band h2{font-size:clamp(2.4rem,5.6vw,70px)}
  .stat-row .num{font-size:clamp(3.2rem,8vw,106px)}
  .about-band .bandtext{font-size:clamp(2.2rem,5vw,61px);left:var(--gutter)}
  .about-band .bandpara{right:var(--gutter)}
  .caps .wrap{max-width:calc(100% - 120px)}
}
@media(max-width:980px){
  :root{--gutter:24px}
  .nav{position:fixed;inset:0;background:var(--navy);flex-direction:column;align-items:center;justify-content:center;gap:30px;transform:translateX(100%);transition:transform .3s;z-index:50}
  .nav.open{transform:translateX(0)}
  .nav a{font-size:18px}
  .apply{position:relative;z-index:60}
  .navtoggle{display:block}
  .hero-inner{padding-top:0;justify-content:center}
  .hero h1{font-size:clamp(2.2rem,8vw,52px)}
  .hero-sub{margin-top:24px}
  .introband .row{grid-template-columns:1fr;gap:30px}
  .introband .statement,.about-intro .statement,.introband .para,.about-intro .para,.lead-block h2,.perf .head h2,.caps h2{font-size:clamp(1.5rem,4.5vw,40px)}
  .introband .photo{max-width:320px}
  .stat-row{grid-template-columns:1fr;gap:8px;text-align:left}
  .stat-row .num,.stat-row .lbl{grid-column:1;text-align:left;justify-self:start;padding-left:0}
  .cards2,.perf .head,.about-intro .row,.band .overlay .in,.cform .row2{grid-template-columns:1fr;gap:30px}
  .about-intro .photo{grid-column:1}
  .caps .grid,.foot-grid{grid-template-columns:1fr}
  .tiles{grid-template-columns:1fr 1fr;gap:14px}
  .foot-brand{justify-self:start;text-align:left;align-items:flex-start}
  .help-social{align-items:flex-start}
  .band .overlay .in{bottom:30px}
  .about-band .bandpara{position:static;transform:none;width:auto;margin-top:20px}
  .about-band .bandtext{position:static;padding:40px var(--gutter)}
  .about-band{height:auto;background:var(--navy)}
  .about-band>img{height:60vw}
  .contact .union{opacity:.4}
  .cform{width:100%}
}
@media(max-width:560px){
  .tiles{grid-template-columns:1fr 1fr}
  .help-top{flex-direction:column}
}