/* ==========================================================================
   NorthInfra LLC — Site Design System v2
   Dark institutional. Navy / Slate / Silver / White + steel accent.
   Evolved from NorthInfra_Website_1.html
   ========================================================================== */

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

:root{
  /* Grounds */
  --bd:   #050D1F;
  --bdk:  #0A1628;
  --bdm:  #0F2044;
  --br:   #1A3567;
  --bblk: #030810;

  /* Steel accent — deliberately muted from the base file's #2563EB.
     Electric blue reads SaaS; this reads institutional. */
  --ac:   #3E6EA8;
  --acl:  #8FB2D8;

  /* Silvers + white */
  --sv:   #C8D6E8;
  --sd:   #8BA3C0;
  --sp:   #E8EFF8;
  --wh:   #FFFFFF;
  --sl:   rgba(200,214,232,.13);
  --sl2:  rgba(200,214,232,.07);

  /* Type */
  --fd: 'Playfair Display', 'Iowan Old Style', Georgia, serif;
  --fb: 'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;

  /* Metrics */
  --gut: clamp(24px, 4.4vw, 64px);
  --nav: 78px;
  --shell: 1380px;
}

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  font-family:var(--fb);
  font-weight:300;
  font-size:16px;
  line-height:1.75;
  background:var(--bd);
  color:var(--sd);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

::selection{ background:rgba(62,110,168,.4); color:var(--wh); }

/* --------------------------------------------------------------------------
   Type scale
   -------------------------------------------------------------------------- */

.d1,.d2,.d3{ font-family:var(--fd); font-weight:400; color:var(--wh); line-height:1.08; }
.d1{ font-size:clamp(38px, 4.9vw, 74px); letter-spacing:-.022em; }
.d2{ font-size:clamp(29px, 3.5vw, 50px); letter-spacing:-.018em; line-height:1.1; }
.d3{ font-size:clamp(21px, 1.7vw, 27px); letter-spacing:-.012em; line-height:1.22; }
.d1 em,.d2 em,.d3 em{ font-style:italic; color:var(--sv); }

.lead{ font-size:clamp(15px,1.13vw,17px); line-height:1.82; color:var(--sd); font-weight:300; }
.lead strong{ color:var(--sp); font-weight:500; }

.ey{ display:flex; align-items:center; gap:13px; margin-bottom:20px; }
.ey i{ width:26px; height:1px; background:var(--ac); flex:none; }
.ey span{
  font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--acl); font-weight:400;
}

.hair{ height:1px; background:var(--sl); border:0; }

/* --------------------------------------------------------------------------
   Layout
   -------------------------------------------------------------------------- */

.shell{ max-width:var(--shell); margin:0 auto; padding:0 var(--gut); }

section{ position:relative; }
.band{ padding:clamp(76px, 8.6vw, 132px) 0; }
.band--k{ background:var(--bdk); }
.band--d{ background:var(--bd); }
.band--top{ border-top:1px solid var(--sl); }

.g2{ display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:clamp(38px,5.6vw,88px); align-items:start; }
.g2--wide{ grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); }
.g2--end{ align-items:end; }
.stk > * + *{ margin-top:1.15rem; }
.stk-l > * + *{ margin-top:2.2rem; }

@media(max-width:940px){
  .g2,.g2--wide{ grid-template-columns:1fr; gap:2.4rem; }
}

/* --------------------------------------------------------------------------
   Nav
   -------------------------------------------------------------------------- */

.nv{
  position:fixed; top:0; left:0; right:0; z-index:200;
  height:var(--nav);
  display:flex; align-items:center;
  transition:background .4s ease, border-color .4s ease, backdrop-filter .4s ease;
  border-bottom:1px solid transparent;
}
.nv.op{
  background:rgba(5,13,31,.97);
  backdrop-filter:blur(22px) saturate(140%);
  -webkit-backdrop-filter:blur(22px) saturate(140%);
  border-bottom-color:transparent;
}
.nv.sc{
  background:rgba(5,13,31,.93);
  backdrop-filter:blur(22px) saturate(140%);
  -webkit-backdrop-filter:blur(22px) saturate(140%);
  border-bottom-color:var(--sl);
}
.nv__in{
  width:100%; max-width:var(--shell); margin:0 auto; padding:0 var(--gut);
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
}
.nv__logo img{ height:32px; width:auto; }
.nv__r{ display:flex; align-items:center; gap:clamp(20px,2.4vw,36px); }
.nv__r a{
  font-size:11.5px; letter-spacing:.11em; text-transform:uppercase;
  color:var(--sd); font-weight:400; position:relative; padding:6px 0;
  transition:color .22s ease; white-space:nowrap;
}
.nv__r a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--ac); transition:right .34s cubic-bezier(.22,1,.36,1);
}
.nv__r a:hover{ color:var(--wh); }
.nv__r a:hover::after{ right:0; }
.nv__r a.on{ color:var(--sp); }
.nv__r a.on::after{ right:0; background:var(--sl); }

.nv__cta{
  border:1px solid var(--sl); color:var(--sv)!important;
  padding:10px 21px; transition:all .24s ease;
}
.nv__cta::after{ display:none!important; }
.nv__cta:hover{ background:var(--br); border-color:var(--ac); color:var(--wh)!important; }

.nv__tog{
  display:none; background:none; border:0; cursor:pointer;
  width:42px; height:42px; padding:11px 9px; color:var(--sv);
}
.nv__tog span{ display:block; height:1px; background:currentColor; transition:transform .32s ease, opacity .22s ease; }
.nv__tog span + span{ margin-top:6px; }
.nv.op .nv__tog span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nv.op .nv__tog span:nth-child(2){ opacity:0; }
.nv.op .nv__tog span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media(max-width:1080px){
  .nv__tog{ display:block; }
  .nv__r{
    position:fixed; top:var(--nav); left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:rgba(5,13,31,.985);
    backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
    border-bottom:1px solid var(--sl);
    padding:8px var(--gut) 26px;
    opacity:0; transform:translateY(-10px); pointer-events:none;
    transition:opacity .28s ease, transform .28s ease;
    max-height:calc(100vh - var(--nav)); overflow-y:auto;
  }
  .nv.op .nv__r{ opacity:1; transform:none; pointer-events:auto; }
  .nv__r a{ padding:17px 0; font-size:13px; border-bottom:1px solid var(--sl2); }
  .nv__r a::after{ display:none; }
  .nv__cta{ margin-top:18px; text-align:center; border-color:var(--ac); }
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.bp{
  display:inline-block; background:var(--ac); color:var(--wh);
  padding:14px 32px; font-size:11.5px; font-weight:500;
  letter-spacing:.11em; text-transform:uppercase;
  border:1px solid var(--ac); cursor:pointer; font-family:var(--fb);
  transition:background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.bp:hover{ background:#4A80BE; border-color:#4A80BE; transform:translateY(-2px); box-shadow:0 12px 30px -10px rgba(62,110,168,.55); }

.bo{
  display:inline-block; background:transparent; color:var(--sv);
  padding:14px 30px; font-size:11.5px; font-weight:400;
  letter-spacing:.11em; text-transform:uppercase;
  border:1px solid var(--sl); transition:all .25s ease;
}
.bo:hover{ border-color:var(--acl); color:var(--wh); background:rgba(62,110,168,.1); }

.bg{
  display:inline-flex; align-items:center; gap:9px;
  font-size:12.5px; color:var(--sd); letter-spacing:.05em;
  transition:color .22s ease;
}
.bg::after{ content:'→'; transition:transform .26s cubic-bezier(.22,1,.36,1); }
.bg:hover{ color:var(--wh); }
.bg:hover::after{ transform:translateX(6px); }

.acts{ display:flex; flex-wrap:wrap; gap:18px; align-items:center; }

/* --------------------------------------------------------------------------
   Hero — full-bleed photography
   -------------------------------------------------------------------------- */

.hero{
  position:relative;
  min-height:min(92vh, 900px);
  display:flex; align-items:flex-end;
  overflow:hidden;
  padding-top:calc(var(--nav) + 40px);
  padding-bottom:clamp(52px, 6vw, 92px);
}
.hero--tall{ min-height:min(100vh, 1000px); align-items:center; }
.hero--sub{ min-height:min(70vh, 700px); }

.hero__img{
  position:absolute; inset:0; z-index:0;
  width:100%; height:100%; max-width:none;
  object-fit:cover; object-position:center;
  will-change:transform;
}
.hero__scrim{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(5,13,31,.66) 0%, rgba(5,13,31,.34) 16%, rgba(5,13,31,.16) 34%, rgba(5,13,31,.30) 56%, rgba(5,13,31,.62) 80%, rgba(5,13,31,.95) 100%),
    linear-gradient(96deg, rgba(5,13,31,.84) 0%, rgba(5,13,31,.40) 42%, rgba(5,13,31,0) 78%);
}
.hero__grid{
  position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(rgba(200,214,232,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(200,214,232,.05) 1px, transparent 1px);
  background-size:70px 70px;
  mask-image:radial-gradient(ellipse 76% 84% at 46% 50%, black 30%, transparent 82%);
  -webkit-mask-image:radial-gradient(ellipse 76% 84% at 46% 50%, black 30%, transparent 82%);
}
.hero .shell{ position:relative; z-index:3; width:100%; }

.hero__con{ max-width:720px; }
.hero__sub{ margin-top:26px; max-width:520px; font-size:15px; line-height:1.84; color:var(--sv); font-weight:300; }
.hero__acts{ margin-top:42px; }

.hero__cap{
  position:absolute; right:var(--gut); bottom:clamp(20px,2.4vw,30px); z-index:3;
  font-size:9.5px; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(200,214,232,.42); text-align:right; line-height:1.7;
}

/* Floating metric cards (home only) */
.hmet{
  position:absolute; right:var(--gut); top:50%; transform:translateY(-50%);
  z-index:3; display:flex; flex-direction:column; gap:13px;
}
.mc{
  background:rgba(10,22,40,.62); border:1px solid var(--sl);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  padding:17px 26px; min-width:204px; position:relative; overflow:hidden;
}
.mc::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:2px;
  background:linear-gradient(to bottom, var(--ac), transparent);
}
.mc b{ font-family:var(--fd); font-size:33px; font-weight:400; color:var(--wh); line-height:1; letter-spacing:-.02em; display:block; }
.mc b i{ font-style:normal; font-size:18px; color:var(--sd); }
.mc > span{ display:block; font-size:9.5px; color:var(--sd); letter-spacing:.13em; text-transform:uppercase; margin-top:6px; }
.mc.ac b{ color:var(--acl); }
@media(max-width:1180px){ .hmet{ display:none; } }

/* Scroll hint */
.shi{ position:absolute; left:var(--gut); bottom:26px; z-index:3; display:flex; flex-direction:column; align-items:center; gap:9px; }
.shi i{ width:1px; height:46px; background:linear-gradient(to bottom, var(--acl), transparent); animation:sp 2.4s ease-in-out infinite; }
.shi span{ font-size:8.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--sd); writing-mode:vertical-rl; transform:rotate(180deg); }
@keyframes sp{ 0%,100%{opacity:.35;transform:scaleY(1)} 50%{opacity:1;transform:scaleY(.66)} }
@media(max-width:940px){ .shi{ display:none; } }

/* --------------------------------------------------------------------------
   Stat band
   -------------------------------------------------------------------------- */

.sband{
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--sl); border-bottom:1px solid var(--sl);
  background:rgba(10,22,40,.55);
}
.bs{ padding:clamp(26px,2.6vw,36px) clamp(22px,2.8vw,46px); border-right:1px solid var(--sl); }
.bs:last-child{ border-right:0; }
.bs b{ font-family:var(--fd); font-size:clamp(28px,2.7vw,38px); font-weight:400; color:var(--wh); line-height:1; letter-spacing:-.02em; display:block; }
.bs b i{ font-style:normal; color:var(--acl); }
.bs span{ display:block; font-size:9.5px; color:var(--sd); letter-spacing:.13em; text-transform:uppercase; margin-top:11px; line-height:1.6; }
@media(max-width:820px){
  .sband{ grid-template-columns:1fr 1fr; }
  .bs:nth-child(2){ border-right:0; }
  .bs:nth-child(1),.bs:nth-child(2){ border-bottom:1px solid var(--sl); }
}

/* --------------------------------------------------------------------------
   Numbered steps
   -------------------------------------------------------------------------- */

.steps{ display:flex; flex-direction:column; }
.step{ display:grid; grid-template-columns:30px 1fr; gap:20px; padding:22px 0; border-bottom:1px solid var(--sl); }
.step:first-child{ border-top:1px solid var(--sl); }
.step > i{ font-family:var(--fd); font-style:normal; font-size:12px; color:var(--acl); font-weight:500; padding-top:4px; }
.step h4{ font-size:13px; font-weight:500; color:var(--sp); margin-bottom:6px; letter-spacing:.01em; font-family:var(--fb); }
.step p{ font-size:13px; color:var(--sd); line-height:1.72; }

/* --------------------------------------------------------------------------
   Vertical cards — photo led
   -------------------------------------------------------------------------- */

.vg{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--sl); border:1px solid var(--sl); }
.vc{ background:var(--bdk); position:relative; overflow:hidden; display:flex; flex-direction:column; }
.vc__ph{ position:relative; overflow:hidden; aspect-ratio:16/10; }
.vc__ph img{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.03); transition:transform 1.1s cubic-bezier(.22,1,.36,1), filter .5s ease;
  filter:brightness(.88);
}
.vc:hover .vc__ph img{ transform:scale(1.09); filter:brightness(1.02); }
.vc__ph::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(5,13,31,.10) 0%, rgba(10,22,40,.72) 78%, var(--bdk) 100%);
}
.vc__bd{ padding:26px 26px 30px; flex:1; display:flex; flex-direction:column; position:relative; }
.vc__wm{ height:30px; width:auto; align-self:flex-start; flex:none; margin-bottom:13px; }
.vc__k{ font-size:9px; color:var(--acl); letter-spacing:.14em; text-transform:uppercase; margin-bottom:13px; }
.vc__d{ font-size:12.5px; color:var(--sd); line-height:1.74; }
.vc__t{ display:flex; flex-wrap:wrap; gap:6px; margin-top:18px; }
.vc__t span{ font-size:9px; color:var(--sd); border:1px solid var(--sl2); padding:4px 9px; letter-spacing:.07em; }
.vc__go{ margin-top:auto; padding-top:20px; font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--sv); display:flex; align-items:center; gap:8px; }
.vc__go::after{ content:'→'; transition:transform .28s cubic-bezier(.22,1,.36,1); }
.vc:hover .vc__go::after{ transform:translateX(6px); }
.vc::after{
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, var(--ac), var(--acl));
  transform:scaleX(0); transform-origin:left; transition:transform .42s cubic-bezier(.22,1,.36,1);
}
.vc:hover::after{ transform:scaleX(1); }

@media(max-width:1080px){ .vg{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .vg{ grid-template-columns:1fr; } }

/* --------------------------------------------------------------------------
   Full-bleed break
   -------------------------------------------------------------------------- */

.brk{ position:relative; overflow:hidden; min-height:clamp(380px, 52vw, 620px); display:flex; align-items:center; }
.brk__img{ position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; will-change:transform; filter:brightness(1.14); }
.brk__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(5,13,31,.92) 0%, rgba(5,13,31,.26) 22%, rgba(5,13,31,.20) 52%, rgba(5,13,31,.34) 74%, rgba(5,13,31,.90) 100%),
    linear-gradient(90deg, rgba(5,13,31,.74) 0%, rgba(5,13,31,.14) 56%, rgba(5,13,31,.34) 100%);
}
.brk .shell{ position:relative; z-index:2; }
.brk__q{ max-width:820px; }
.brk__q p{ margin-top:22px; max-width:560px; font-size:15px; line-height:1.82; color:var(--sv); }
.brk__cap{
  position:absolute; right:var(--gut); bottom:22px; z-index:2;
  font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:rgba(200,214,232,.4);
}

/* --------------------------------------------------------------------------
   Project gallery
   -------------------------------------------------------------------------- */

.pgal{ display:grid; grid-template-columns:repeat(auto-fit, minmax(268px,1fr)); gap:clamp(14px,1.5vw,22px); }
.pj{ position:relative; overflow:hidden; background:var(--bdk); border:1px solid var(--sl); }
.pj__ph{ position:relative; aspect-ratio:3/2; overflow:hidden; }
.pj__ph img{ width:100%; height:100%; object-fit:cover; filter:brightness(.92); transition:transform 1s cubic-bezier(.22,1,.36,1), filter .5s ease; }
.pj:hover .pj__ph img{ transform:scale(1.06); filter:brightness(1); }
.pj__ph::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 42%, rgba(5,13,31,.88) 100%); }
.pj__mw{
  position:absolute; left:18px; bottom:14px; z-index:2;
  font-family:var(--fd); font-size:24px; color:var(--wh); line-height:1; letter-spacing:-.02em;
}
.pj__mw i{ font-style:normal; font-size:12px; color:var(--sv); margin-left:3px; }
.pj__bd{ padding:18px 20px 20px; border-top:1px solid var(--sl); }
.pj__n{ font-size:13.5px; color:var(--sp); font-weight:400; line-height:1.4; }
.pj__r{ font-size:9px; color:var(--acl); letter-spacing:.14em; text-transform:uppercase; margin-top:8px; }

/* --------------------------------------------------------------------------
   Deal table
   -------------------------------------------------------------------------- */

.dtb{ border-top:1px solid rgba(200,214,232,.2); }
.dhr,.dr{ display:grid; grid-template-columns:76px 1fr 96px 132px; gap:16px; align-items:center; }
.dhr{ padding:12px 0; border-bottom:1px solid rgba(200,214,232,.2); }
.dhr span{ font-size:9px; color:var(--sd); letter-spacing:.15em; text-transform:uppercase; }
.dhr span:nth-child(3),.dhr span:nth-child(4){ text-align:right; }
.dr{ padding:12px 0; border-bottom:1px solid var(--sl); }
.dr__th{ width:76px; height:50px; overflow:hidden; background:var(--bdm); }
/* the card grade is tuned for large crops; at 76px it needs lifting hard */
.dr__th img{ width:100%; height:100%; object-fit:cover;
  filter:brightness(1.85) contrast(.92) saturate(1.5); }
.dr__th.none{ border:1px solid var(--sl2); background:transparent; }
.dr__n{ font-size:13px; color:var(--sp); }
.dr__mw{ font-family:var(--fd); font-size:17px; color:var(--sv); text-align:right; }
.dr__r{ font-size:9.5px; color:var(--acl); letter-spacing:.1em; text-transform:uppercase; text-align:right; }
@media(max-width:720px){
  .dhr{ display:none; }
  .dr{ grid-template-columns:76px 1fr auto; gap:14px; row-gap:4px; }
  .dr__mw{ text-align:right; font-size:15px; }
  .dr__r{ grid-column:2 / -1; text-align:left; }
}

/* Counterparty chips */
.cps{ display:flex; flex-wrap:wrap; gap:8px; }
.cp{ font-size:11px; color:var(--sd); border:1px solid var(--sl); padding:7px 14px; letter-spacing:.04em; transition:all .22s ease; }
.cp:hover{ border-color:rgba(200,214,232,.32); color:var(--sv); }

/* --------------------------------------------------------------------------
   Pillars
   -------------------------------------------------------------------------- */

.pg{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--sl); border:1px solid var(--sl); }
.pil{ background:var(--bdk); padding:clamp(32px,3.4vw,52px) clamp(28px,3vw,48px); transition:background .34s ease; }
.pil:hover{ background:rgba(26,53,103,.26); }
.pil > b{ display:block; font-family:var(--fd); font-size:clamp(38px,3.6vw,52px); font-weight:400; color:rgba(200,214,232,.07); line-height:1; margin-bottom:14px; }
.pil h3{ font-family:var(--fd); font-size:clamp(18px,1.5vw,22px); font-weight:500; color:var(--wh); margin-bottom:12px; letter-spacing:-.01em; }
.pil i{ display:block; width:26px; height:1px; background:var(--ac); margin-bottom:14px; }
.pil p{ font-size:13px; color:var(--sd); line-height:1.8; }
@media(max-width:820px){ .pg{ grid-template-columns:1fr; } }

/* --------------------------------------------------------------------------
   Tick list
   -------------------------------------------------------------------------- */

.tk{ list-style:none; }
.tk li{ position:relative; padding-left:22px; margin-bottom:13px; font-size:13.5px; line-height:1.74; color:var(--sd); }
.tk li:last-child{ margin-bottom:0; }
.tk li::before{ content:''; position:absolute; left:0; top:.72em; width:6px; height:6px; border:1px solid var(--ac); transform:rotate(45deg); }
.tk strong{ color:var(--sp); font-weight:500; }

/* --------------------------------------------------------------------------
   Mosaic (vertical detail pages)
   -------------------------------------------------------------------------- */

.mos{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--sl); border:1px solid var(--sl); }
.mos figure{ position:relative; overflow:hidden; aspect-ratio:4/3; background:var(--bdk); }
.mos img{ width:100%; height:100%; object-fit:cover; filter:brightness(.9); transition:transform 1s cubic-bezier(.22,1,.36,1), filter .5s ease; }
.mos figure:hover img{ transform:scale(1.07); filter:brightness(1); }
.mos figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:14px 16px;
  background:linear-gradient(180deg, transparent, rgba(5,13,31,.9));
  font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--sv);
}
.mos figure.wide{ grid-column:span 2; aspect-ratio:8/3; }
@media(max-width:900px){
  .mos{ grid-template-columns:1fr 1fr; }
  .mos figure.wide{ grid-column:span 2; }
}

/* --------------------------------------------------------------------------
   Focus cards
   -------------------------------------------------------------------------- */

.fc{ display:grid; grid-template-columns:repeat(auto-fit, minmax(286px,1fr)); gap:1px; background:var(--sl); border:1px solid var(--sl); }
.fcc{ background:var(--bdk); padding:clamp(26px,2.6vw,36px); transition:background .3s ease; }
.fcc:hover{ background:rgba(26,53,103,.24); }
.fcc span{ font-size:9px; color:var(--acl); letter-spacing:.15em; text-transform:uppercase; }
.fcc h3{ font-family:var(--fd); font-size:19px; font-weight:500; color:var(--wh); margin:12px 0 12px; line-height:1.24; }
.fcc p{ font-size:12.5px; color:var(--sd); line-height:1.76; }

/* --------------------------------------------------------------------------
   People
   -------------------------------------------------------------------------- */

.ppl{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--sl); border:1px solid var(--sl); }
.prs{ background:var(--bdk); padding:clamp(30px,3.2vw,50px); }
.prs__i{
  width:58px; height:58px; display:grid; place-items:center;
  border:1px solid var(--sl); font-family:var(--fd); font-size:17px; color:var(--sv);
  margin-bottom:24px;
}
.prs__n{ font-family:var(--fd); font-size:clamp(21px,1.9vw,27px); font-weight:500; color:var(--wh); letter-spacing:-.012em; }
.prs__r{ font-size:9.5px; color:var(--acl); letter-spacing:.15em; text-transform:uppercase; margin-top:9px; }
.prs__s{ display:flex; gap:38px; margin:26px 0; padding:18px 0; border-top:1px solid var(--sl); border-bottom:1px solid var(--sl); }
.prs__s div b{ display:block; font-family:var(--fd); font-size:26px; font-weight:400; color:var(--wh); line-height:1; }
.prs__s div span{ display:block; font-size:9px; color:var(--sd); letter-spacing:.13em; text-transform:uppercase; margin-top:8px; }
.prs p{ font-size:13.5px; color:var(--sd); line-height:1.82; }
.prs p + p{ margin-top:14px; }
.prs p + p.prs__rr{ margin-top:18px; }
@media(max-width:820px){ .ppl{ grid-template-columns:1fr; } }

/* --------------------------------------------------------------------------
   Table
   -------------------------------------------------------------------------- */

.tw{ overflow-x:auto; border:1px solid var(--sl); }
table.tb{ width:100%; border-collapse:collapse; font-size:13px; min-width:620px; }
table.tb th{
  background:rgba(26,53,103,.5); color:var(--sp); text-align:left;
  font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:500;
  padding:15px 20px; border-bottom:1px solid var(--sl); white-space:nowrap;
}
table.tb td{ padding:17px 20px; border-bottom:1px solid var(--sl); color:var(--sd); vertical-align:top; line-height:1.7; }
table.tb tbody tr:nth-child(even){ background:rgba(10,22,40,.5); }
table.tb tbody tr:last-child td{ border-bottom:0; }
table.tb td:first-child{ color:var(--sp); white-space:nowrap; }

/* --------------------------------------------------------------------------
   Note
   -------------------------------------------------------------------------- */

.note{
  font-size:12px; line-height:1.78; color:var(--sd);
  padding:18px 22px; background:rgba(10,22,40,.72);
  border-left:2px solid var(--ac);
}

/* --------------------------------------------------------------------------
   Form
   -------------------------------------------------------------------------- */

.fld{ margin-bottom:22px; }
.fld label{ display:block; font-size:9.5px; letter-spacing:.15em; text-transform:uppercase; color:var(--sd); margin-bottom:9px; }
.fld input,.fld select,.fld textarea{
  width:100%; font-family:var(--fb); font-size:14px; font-weight:300; color:var(--sp);
  background:rgba(10,22,40,.68); border:1px solid var(--sl);
  padding:13px 15px; border-radius:0;
  transition:border-color .22s ease, box-shadow .22s ease, background .22s ease;
}
.fld select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--sd) 50%),linear-gradient(135deg,var(--sd) 50%,transparent 50%); background-position:calc(100% - 19px) 50%,calc(100% - 14px) 50%; background-size:5px 5px,5px 5px; background-repeat:no-repeat; }
.fld select option{ background:var(--bdk); color:var(--sp); }
.fld textarea{ min-height:136px; resize:vertical; line-height:1.7; }
.fld input:focus,.fld select:focus,.fld textarea:focus{
  outline:none; border-color:var(--ac); background:rgba(15,32,68,.8);
  box-shadow:0 0 0 3px rgba(62,110,168,.16);
}
.fld input::placeholder,.fld textarea::placeholder{ color:rgba(139,163,192,.5); }
.fr2{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
@media(max-width:640px){ .fr2{ grid-template-columns:1fr; } }

/* --------------------------------------------------------------------------
   CTA + footer
   -------------------------------------------------------------------------- */

.cta{ position:relative; background:var(--bd); text-align:center; padding:clamp(84px,9vw,140px) 0; overflow:hidden; }
.cta__glow{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:min(760px,92vw); height:420px; pointer-events:none;
  background:radial-gradient(ellipse, rgba(62,110,168,.16) 0%, transparent 68%);
}
.cta .shell{ position:relative; z-index:2; }
.cta p{ max-width:520px; margin:22px auto 44px; font-size:14.5px; line-height:1.8; color:var(--sd); }
.cta .acts{ justify-content:center; }
.cta__em{ font-size:12.5px; color:var(--sd); letter-spacing:.04em; }

.ft{ background:var(--bblk); border-top:1px solid var(--sl); padding:clamp(52px,5.6vw,76px) 0 26px; }
.ft__t{ display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3, minmax(0,.85fr)); gap:clamp(28px,3.4vw,52px); padding-bottom:40px; border-bottom:1px solid var(--sl); }
.ft__lg img{ height:27px; width:auto; }
.ft__bl{ margin-top:18px; max-width:36ch; font-size:12.5px; line-height:1.78; color:var(--sd); }
.ft h4{ font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:rgba(200,214,232,.4); font-weight:500; font-family:var(--fb); margin-bottom:16px; }
.ft ul{ list-style:none; }
.ft li{ margin-bottom:11px; }
.ft li a{ font-size:12.5px; color:var(--sd); transition:color .2s ease; }
.ft li a:hover{ color:var(--wh); }
.ft__b{ padding-top:26px; display:grid; grid-template-columns:auto 1fr; gap:14px 40px; align-items:start; }
.ft__c{ font-size:10.5px; color:rgba(139,163,192,.44); white-space:nowrap; }
.ft__lgl{ font-size:10.5px; line-height:1.75; color:rgba(139,163,192,.4); max-width:96ch; }
@media(max-width:940px){ .ft__t{ grid-template-columns:1fr 1fr; } .ft__b{ grid-template-columns:1fr; } }
@media(max-width:560px){ .ft__t{ grid-template-columns:1fr; } }

/* --------------------------------------------------------------------------
   Reveal + motion
   -------------------------------------------------------------------------- */

.rv{ opacity:0; transform:translateY(26px); transition:opacity .85s cubic-bezier(.22,1,.36,1), transform .85s cubic-bezier(.22,1,.36,1); transition-delay:var(--d,0ms); }
.rv.vi{ opacity:1; transform:none; }

.fi{ opacity:0; animation:fadein 1.3s ease .35s forwards; }
.fu{ opacity:0; animation:fadeup .9s cubic-bezier(.22,1,.36,1) forwards; }
@keyframes fadein{ to{opacity:1} }
@keyframes fadeup{ from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:none} }

@media(prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .rv,.fi,.fu{ opacity:1!important; transform:none!important; animation:none!important; transition:none!important; }
  .hero__img,.brk__img{ transform:none!important; }
  .shi i{ animation:none; }
}

:focus-visible{ outline:2px solid var(--acl); outline-offset:3px; }

.skip{ position:absolute; left:-9999px; background:var(--ac); color:#fff; padding:12px 20px; z-index:400; font-size:12px; }
.skip:focus{ left:var(--gut); top:8px; }

/* ==========================================================================
   Regulatory disclosure block — footer (every page) + Legal & Disclosures
   Added v3, 2026-08-31.
   ========================================================================== */
.ft__d{ padding-top:28px; border-bottom:1px solid var(--sl); padding-bottom:26px; }
.ft__d h4{ margin-bottom:14px; }
.dsc{ max-width:104ch; }
.dsc p{
  font-size:11px; line-height:1.82; color:rgba(180,198,220,.62);
  font-family:var(--fb); margin-bottom:12px;
}
.dsc p:last-child{ margin-bottom:0; }
.dsc a{
  color:rgba(214,228,244,.88); text-decoration:underline;
  text-decoration-color:rgba(200,214,232,.34); text-underline-offset:2px;
  transition:color .2s ease, text-decoration-color .2s ease;
}
.dsc a:hover{ color:var(--wh); text-decoration-color:var(--ac); }
.dsc .dsc__lk{ color:rgba(180,198,220,.5); }
.dsc .dsc__lk a{ white-space:nowrap; }

/* Legal & Disclosures page */
.lgl{ max-width:88ch; }
.lgl__s{ padding:clamp(30px,3.4vw,44px) 0; border-bottom:1px solid var(--sl2); }
.lgl__s:last-child{ border-bottom:0; padding-bottom:0; }
.lgl__s .d3{ margin-top:14px; }
.lgl__s p{
  margin-top:18px; font-size:13.5px; line-height:1.85; color:var(--sd);
  font-family:var(--fb);
}
.lgl__s p.dsc__lk{ line-height:2.1; }
.lgl__s a{
  color:var(--sv); text-decoration:underline;
  text-decoration-color:rgba(200,214,232,.28); text-underline-offset:3px;
  transition:color .2s ease, text-decoration-color .2s ease;
}
.lgl__s a:hover{ color:var(--wh); text-decoration-color:var(--ac); }
.lgl__s a.bg{ text-decoration:none; }
@media(max-width:560px){
  .dsc p{ font-size:10px; line-height:1.85; }
  .dsc .dsc__lk a{ white-space:normal; }
}

/* ==========================================================================
   Contact panel — replaces the unwired form. Added v14, 2026-09-08.
   ========================================================================== */
.cpanel{
  background:var(--bdk); border:1px solid var(--sl);
  padding:clamp(28px,3.2vw,44px);
}
.cpanel .d3{ margin-top:14px; }
.cpanel p{
  margin-top:16px; font-size:14px; line-height:1.8; color:var(--sd);
  font-family:var(--fb);
}
.cpanel__em{ margin-top:24px !important; }
.cpanel__em a{
  font-family:var(--fd); font-size:clamp(22px,2.4vw,30px); color:var(--sp);
  text-decoration:none; border-bottom:1px solid var(--ac); padding-bottom:4px;
  transition:color .2s ease, border-color .2s ease;
}
.cpanel__em a:hover{ color:var(--wh); border-color:var(--acl); }
.cpanel__nb{
  font-size:11.5px !important; line-height:1.75 !important;
  color:rgba(139,163,192,.62) !important;
}

/* Registered-representative disclosure inside a principal card. v15, 2026-09-08. */
.prs__rr{
  margin-top:18px; padding-top:16px; border-top:1px solid var(--sl2);
  font-size:11.5px; line-height:1.7; color:rgba(139,163,192,.66);
  font-family:var(--fb);
}

/* v16 — Finalis OSJ supervision line, footer identity block */
.ft__osj{
  margin-top:14px; font-size:12.5px; line-height:1.6;
  color:var(--sv); font-family:var(--fb); letter-spacing:.01em;
}