/* =========================================================================
   GLIXI QUANT - MASTER DESIGN SYSTEM & STYLE SHEET
   ========================================================================= */

:root {
  --black:       #08080a;
  --rich:        #0e0f14;
  --char:        #15161d;
  --slate:       #1c1d27;
  --graphite:    #252633;
  --steel:       #383a4a;
  --silver:      #6b6e82;
  --ash:         #9598ab;
  --cloud:       #c8cbd8;
  --ivory:       #e8e9ef;
  --white:       #f4f4f8;
  --champagne:   #c9a96e;
  --gold:        #b8943f;
  --emerald:     #34d399;
  --serif:       'EB Garamond', Georgia, serif;
  --sans:        'Outfit', -apple-system, sans-serif;
  --mono:        'Space Mono', monospace;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background:var(--black); color:var(--ivory);
  font-family:var(--sans); font-size:16px; line-height:1.7;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
::selection { background:var(--champagne); color:var(--black); }

/* ═══ NAV ═══ */
.nav-wrap { position:fixed; top:0; left:0; right:0; z-index:100; transition:all .4s; }
.nav-wrap.scrolled {
  background:rgba(8,8,10,.9); backdrop-filter:blur(32px);
  border-bottom:1px solid rgba(255,255,255,.04);
}
nav {
  max-width:1400px; margin:0 auto; padding:28px 60px;
  display:flex; justify-content:space-between; align-items:center;
}
.logo {
  font-family:var(--sans); font-size:18px; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase;
  text-decoration:none; color:var(--white);
}
.logo span { color:var(--champagne); font-weight:300; }
.nav-links { display:flex; gap:0; list-style:none; align-items:center; }
.nav-links a {
  padding:10px 20px; color:var(--ash); text-decoration:none;
  font-size:12px; font-weight:400; letter-spacing:.08em;
  text-transform:uppercase; transition:color .3s;
}
.nav-links a:hover { color:var(--white); }
.nav-links a.active { color:var(--champagne)!important; font-weight:500; }
.nav-cta {
  margin-left:20px; padding:10px 28px!important;
  border:1px solid rgba(201,169,110,.35)!important;
  color:var(--champagne)!important; transition:all .3s!important;
}
.nav-cta:hover { background:var(--champagne)!important; color:var(--black)!important; }

/* ═══ HOMEPAGE HERO ═══ */
.hero {
  height:100vh; min-height:700px;
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 70% 50% at 25% 75%, rgba(201,169,110,.05) 0%, transparent 60%),
    radial-gradient(ellipse 50% 40% at 75% 25%, rgba(52,211,153,.02) 0%, transparent 50%),
    linear-gradient(180deg, var(--black) 0%, var(--rich) 60%, var(--char) 100%);
  z-index: 1;
}
.hero-grid {
  position:absolute; inset:0; opacity:.025;
  background-image:
    linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
  background-size:80px 80px;
  z-index: 1;
}
.hero-content {
  position:relative; z-index:2; text-align:center; padding:0 48px; max-width:960px;
}
.hero h1 {
  font-family:var(--serif);
  font-size:clamp(44px,7.5vw,88px);
  font-weight:400; line-height:1.06; letter-spacing:-.03em;
  color:var(--white);
  opacity:0; animation:up 1s .4s forwards;
}
.hero h1 em {
  font-style:italic;
  background:linear-gradient(135deg, var(--champagne), var(--gold));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero-sub {
  font-size:17px; line-height:1.85; color:var(--ash);
  max-width:520px; margin:44px auto 0; font-weight:300;
  opacity:0; animation:up 1s .7s forwards;
}
.scroll-hint {
  position:absolute; bottom:48px; left:50%; transform:translateX(-50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:12px;
  opacity:0; animation:up 1s 1.2s forwards;
}
.scroll-hint span { font-size:9px; letter-spacing:.35em; text-transform:uppercase; color:var(--steel); }
.scroll-line { width:1px; height:36px; background:var(--steel); position:relative; overflow:hidden; }
.scroll-line::after {
  content:''; position:absolute; top:-100%; left:0;
  width:1px; height:100%; background:var(--champagne);
  animation:sd 2.2s ease-in-out infinite;
}
@keyframes sd { 0%{top:-100%} 100%{top:100%} }
@keyframes up { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

/* ═══ SUBPAGE HERO ═══ */
.hero-subpage {
  height: auto!important; min-height: 440px!important;
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
  padding: 160px 60px 80px!important;
  text-align: center;
}
.hero-subpage .hero-bg {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 70% 50% at 25% 75%, rgba(201,169,110,.05) 0%, transparent 60%),
    radial-gradient(ellipse 50% 40% at 75% 25%, rgba(52,211,153,.02) 0%, transparent 50%),
    linear-gradient(180deg, var(--black) 0%, var(--rich) 60%, var(--char) 100%);
  z-index: 1;
}
.hero-subpage .hero-grid {
  position:absolute; inset:0; opacity:.025;
  background-image:
    linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
  background-size:80px 80px;
  z-index: 1;
}
.hero-subpage .hero-content {
  position:relative; z-index:2; text-align:center; padding:0 48px; max-width:960px; margin: 0 auto;
}

/* ═══ SECTION SYSTEM ═══ */
section { padding:140px 60px 80px; }
.container { max-width:1200px; margin:0 auto; }
.h-line {
  height:1px; max-width:1400px; margin:0 auto;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent);
  animation:line-expand 1.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  transform:scaleX(0);
}
@keyframes line-expand { to { transform:scaleX(1); } }
.stag { font-family:var(--mono); font-size:10px; letter-spacing:.35em; text-transform:uppercase; color:var(--champagne); margin-bottom:28px; }
.sh {
  font-family:var(--serif); font-size:clamp(30px,4vw,50px);
  font-weight:400; line-height:1.18; letter-spacing:-.02em;
  color:var(--white); max-width:660px; margin-bottom:28px;
}
.sh em { font-style:italic; }
.sp { font-size:17px; color:var(--ash); max-width:560px; line-height:1.85; font-weight:300; }

/* ═══ HOMEPAGE SECTIONS ═══ */
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; margin-top:80px; align-items:start; }
.about-col p { font-size:16px; color:var(--ash); line-height:1.9; font-weight:300; margin-bottom:24px; }
.about-col p strong { color:var(--cloud); font-weight:500; }

.principles-section { background:var(--rich); }
.principles-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:2px; margin-top:72px; }
.principle {
  background:rgba(255,255,255,.015); padding:56px 44px;
  border:1px solid rgba(255,255,255,.03);
  transition:all .5s cubic-bezier(0.16, 1, 0.3, 1);
}
.principle:hover {
  background:rgba(255,255,255,.03); border-color:rgba(201,169,110,.15);
  transform:translateY(-4px);
  box-shadow:0 24px 48px rgba(0,0,0,.25), 0 0 0 1px rgba(201,169,110,.08);
}
.principle-num {
  font-family:var(--serif); font-size:48px; color:rgba(201,169,110,.15);
  margin-bottom:28px; line-height:1;
}
.principle h3 {
  font-family:var(--serif); font-size:24px; font-weight:400;
  margin-bottom:16px; color:var(--white); letter-spacing:-.01em;
}
.principle p { font-size:14px; color:var(--silver); line-height:1.8; }

.quote-section { padding:140px 60px; text-align:center; }
.quote-text {
  font-family:var(--serif); font-size:clamp(22px,3.2vw,38px);
  font-weight:400; line-height:1.5; font-style:italic;
  color:rgba(240,239,233,.8); max-width:780px; margin:0 auto 36px;
  letter-spacing:-.01em;
}
.quote-attr {
  font-family:var(--mono); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--steel);
}

.approach-list { margin-top:72px; max-width:720px; }
.approach-item {
  display:grid; grid-template-columns:200px 1fr; gap:40px;
  padding:32px 0; border-bottom:1px solid rgba(255,255,255,.05);
  align-items:baseline;
}
.approach-item:first-child { border-top:1px solid rgba(255,255,255,.05); }
.ak { font-size:12px; text-transform:uppercase; letter-spacing:.12em; color:var(--silver); padding-top:2px; }
.av { font-size:15px; color:var(--cloud); line-height:1.75; }

/* ═══ REVEALS — Premium scroll animations ═══ */
.rv {
  opacity:0;
  transform:translateY(32px);
  filter:blur(4px);
  transition:
    opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}
.rv.vis {
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}

/* Staggered delays for sequential reveals */
.rv:nth-child(2) { transition-delay:.08s; }
.rv:nth-child(3) { transition-delay:.16s; }
.rv:nth-child(4) { transition-delay:.24s; }
.rv:nth-child(5) { transition-delay:.32s; }
.rv:nth-child(6) { transition-delay:.40s; }
.rv:nth-child(7) { transition-delay:.48s; }
.rv:nth-child(8) { transition-delay:.56s; }

/* Section headers get a subtle scale */
.sh.rv {
  transform:translateY(28px) scale(0.98);
}
.sh.rv.vis {
  transform:translateY(0) scale(1);
}

/* Principle cards slide from left */
.principle.rv {
  transform:translateX(-24px) translateY(16px);
}
.principle.rv.vis {
  transform:translateX(0) translateY(0);
}

/* Approach items slide in with a line wipe */
.approach-item.rv {
  transform:translateX(-16px);
  filter:blur(2px);
}
.approach-item.rv.vis {
  transform:translateX(0);
  filter:blur(0);
}

/* CTA cards scale up gently */
.cta-card.rv {
  transform:translateY(24px) scale(0.97);
  filter:blur(3px);
}
.cta-card.rv.vis {
  transform:translateY(0) scale(1);
  filter:blur(0);
}

/* Quote text fades in with letter-spacing */
.quote-text.rv {
  transform:translateY(20px);
  letter-spacing:0.02em;
}
.quote-text.rv.vis {
  transform:translateY(0);
  letter-spacing:-.01em;
}

/* ═══ PANELS & CARDS ═══ */
.tracking-panel, .positions-panel, .chart-panel, .card {
  background:rgba(255,255,255,.015); border:1px solid rgba(255,255,255,.04);
  padding:48px 40px; transition:all .4s; margin-bottom:48px; border-radius:4px;
}
.tracking-panel:hover, .positions-panel:hover, .chart-panel:hover, .card:hover {
  background:rgba(255,255,255,.03); border-color:rgba(201,169,110,.12);
}
.panel-header {
  display:flex; justify-content:space-between; align-items:flex-start;
  margin-bottom:36px; padding-bottom:20px; border-bottom:1px solid rgba(255,255,255,.04);
}
.panel-title-block { flex:1; }
.panel-title {
  font-family:var(--serif); font-size:26px; font-weight:400; color:var(--white); margin-bottom:6px;
}
.panel-desc { color:var(--ash); font-size:13px; font-weight:300; }

.section-block-head {
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:28px; border-bottom:1px solid rgba(255,255,255,.04); padding-bottom:16px;
}
.section-block-title { font-family:var(--serif); font-size:22px; color:var(--white); }
.section-block-meta { font-size:12px; color:var(--silver); font-family:var(--mono); }

/* ═══ SECTIONS FOR DISCLOSURES/RESEARCH ═══ */
.section { margin-bottom:56px; }
.section-title {
  font-family:var(--serif); font-size:28px; font-weight:400;
  letter-spacing:-.01em; margin-bottom:20px; color:var(--white);
}
.section p { color:var(--ash); margin-bottom:16px; font-weight:300; }
.section p strong { color:var(--white); font-weight:500; }
.section ul { margin:16px 0 16px 24px; color:var(--ash); }
.section ul li { margin-bottom:10px; font-size:15px; font-weight:300; }
.section ul li strong { color:var(--white); font-weight:500; }

/* ═══ METRICS GRID ═══ */
.metric-section { display:grid; grid-template-columns:1.4fr 1fr; gap:24px; margin-bottom:48px; }
.metric-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,.04); border-radius:4px; overflow:hidden; margin-bottom:32px; }
.metric-cell { background:var(--char); padding:24px; transition:background .3s; }
.metric-cell:hover { background:var(--slate); }
.metric-label { font-size:10px; text-transform:uppercase; letter-spacing:0.1em; color:var(--silver); font-weight:500; margin-bottom:8px; }
.metric-value { font-family:var(--mono); font-size:26px; font-weight:400; color:var(--white); margin-bottom:4px; }
.metric-value.gold { color:var(--champagne); }
.metric-value.green { color:var(--emerald); }
.metric-value.red { color:#f87171; }
.metric-sub { font-size:11px; color:var(--silver); font-family:var(--mono); }

/* ═══ TABLES ═══ */
table { width:100%; border-collapse:collapse; margin: 16px 0; }
th {
  padding:12px 16px; text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:0.1em; color:var(--champagne); border-bottom:1px solid rgba(255,255,255,.05); font-weight:500;
}
td {
  padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.03); font-size:14px; color:var(--cloud);
}
tbody tr:last-child td { border-bottom:none; }
tr:hover td { color:var(--white); }
.num { text-align:right; font-family:var(--mono); font-size:13px; }
.value-good { color:var(--emerald); font-weight:500; }
.value-warn { color:var(--champagne); font-weight:500; }
.value-bad { color:#f87171; font-weight:500; }

/* ═══ STATUS BANNER & BADGES ═══ */
.status-banner {
  display:flex; align-items:center; gap:20px; background:var(--rich); border:1px solid rgba(255,255,255,0.04); border-left:4px solid var(--champagne); padding:24px 32px; margin-bottom:48px; border-radius:4px;
}
.status-banner-icon {
  width:44px; height:44px; border-radius:50%; background:rgba(201,169,110,0.08); display:grid; place-items:center; font-size:20px; color:var(--champagne); flex-shrink:0; border:1px solid rgba(201,169,110,0.15);
}
.status-banner-title { font-family:var(--serif); font-size:20px; font-weight:400; color:var(--white); margin-bottom:4px; }
.status-banner-detail { color:var(--ash); font-size:14px; font-weight:300; }

.panel-status {
  display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:100px; font-family:var(--mono); font-size:10px; font-weight:500; letter-spacing:0.1em; text-transform:uppercase;
}
.panel-status.gray { background:rgba(255,255,255,.03); color:var(--silver); border:1px solid rgba(255,255,255,.05); }
.panel-status.green { background:rgba(52, 211, 153, 0.08); color:var(--emerald); border:1px solid rgba(52, 211, 153, 0.15); }
.panel-status.gold { background:rgba(201, 169, 110, 0.08); color:var(--champagne); border:1px solid rgba(201, 169, 110, 0.15); }
.panel-status .dot { width:6px; height:6px; border-radius:50%; }
.panel-status.gray .dot { background:var(--silver); }
.panel-status.green .dot { background:var(--emerald); box-shadow:0 0 8px var(--emerald); }
.panel-status.gold .dot { background:var(--champagne); box-shadow:0 0 8px var(--champagne); }

.status-pill {
  display:inline-block; padding:4px 10px; border-radius:100px; font-size:11px; font-weight:500; margin-left:8px; font-family:var(--mono); text-transform:uppercase; letter-spacing:0.05em;
}
.status-pill.amber { background:rgba(201, 169, 110, 0.08); color:var(--champagne); border:1px solid rgba(201, 169, 110, 0.15); }
.status-pill.gray { background:rgba(255, 255, 255, 0.03); color:var(--silver); border:1px solid rgba(255, 255, 255, 0.05); }

/* ═══ ROADMAP ═══ */
.roadmap-row { display:flex; justify-content:space-between; align-items:center; padding:16px 0; border-bottom:1px solid rgba(255,255,255,.04); font-size:14px; }
.roadmap-row:last-child { border-bottom:none; }
.roadmap-label { display:flex; align-items:center; gap:12px; color:var(--cloud); }
.roadmap-status { color:var(--ash); font-family:var(--mono); font-size:12px; }
.roadmap-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.roadmap-dot.done { background:var(--emerald); box-shadow:0 0 10px rgba(52, 211, 153, 0.4); }
.roadmap-dot.progress { background:var(--champagne); box-shadow:0 0 10px rgba(201, 169, 110, 0.4); }
.roadmap-dot.pending { background:var(--steel); }

/* ═══ DRIFT METHODOLOGY ═══ */
.method-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; margin-top:24px; }
.method-card { background:var(--char); border:1px solid rgba(255,255,255,.03); padding:24px 20px; border-radius:4px; transition:all .3s; }
.method-card:hover { border-color:rgba(255,255,255,0.08); background:var(--slate); }
.method-zscore { font-family:var(--mono); font-size:14px; font-weight:700; color:var(--white); margin-bottom:8px; }
.method-label { font-size:10px; text-transform:uppercase; letter-spacing:0.1em; color:var(--silver); margin-bottom:12px; font-weight:600; }
.method-label.green { color:var(--emerald); }
.method-label.amber { color:var(--champagne); }
.method-label.red { color:#f87171; }
.method-meaning { font-size:13px; color:var(--ash); line-height:1.6; margin-bottom:16px; font-weight:300; }
.method-action { font-size:12px; color:var(--cloud); }
.method-action strong { color:var(--white); font-weight:500; }

/* ═══ ALERTS & CALLOUTS ═══ */
.alert, .callout {
  background:rgba(255,255,255,.01); border-left:3px solid var(--steel);
  padding:24px 32px; border-radius:4px; margin:28px 0;
}
.alert-title, .callout-title { font-family:var(--mono); font-weight:600; margin-bottom:6px; color:var(--white); font-size:11px; text-transform:uppercase; letter-spacing:0.08em; }
.alert-title { color: var(--champagne); }
.alert p, .callout-text { color:var(--ash); font-size:14px; font-weight:300; line-height:1.7; }
.alert { background:rgba(201, 169, 110, 0.03); border-left-color:var(--champagne); }
.callout.green { background:rgba(52, 211, 153, 0.03); border-left-color:var(--emerald); }
.callout.green .callout-title { color:var(--emerald); }
.callout.amber { background:rgba(201, 169, 110, 0.03); border-left-color:var(--champagne); }
.callout.amber .callout-title { color:var(--champagne); }

/* ═══ RESPONSIVE GRIDS ═══ */
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
@media (max-width: 768px) {
  .two-col { grid-template-columns:1fr; }
}

/* ═══ RESEARCH HERO STATS ═══ */
.hero-stats { display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; margin:40px 0 56px; }
@media (max-width: 768px) {
  .hero-stats { grid-template-columns:1fr 1fr; }
}
.hero-stat {
  background:rgba(255,255,255,.015); border:1px solid rgba(255,255,255,.04);
  padding:24px 20px; border-radius:4px; transition:all .3s;
}
.hero-stat:hover { background:rgba(255,255,255,.03); border-color:rgba(201,169,110,.12); }
.hero-stat-label { font-size:10px; color:var(--silver); text-transform:uppercase; letter-spacing:0.08em; font-weight:500; margin-bottom:8px; }
.hero-stat-value { font-family:var(--mono); font-size:26px; font-weight:400; line-height:1; color:var(--white); }
.hero-stat-value.green { color:var(--emerald); }
.hero-stat-sub { font-size:11px; color:var(--silver); margin-top:6px; font-weight:300; }
.section-eyebrow { font-family:var(--mono); font-size:10px; font-weight:500; color:var(--champagne); text-transform:uppercase; letter-spacing:0.12em; margin-bottom:10px; }
.section-lead { font-size:16px; color:var(--ash); margin-bottom:28px; max-width:800px; font-weight:300; }

/* ═══ METHODOLOGY SYSTEM ═══ */
.toc {
  background:var(--rich); border:1px solid rgba(255,255,255,.04);
  padding:28px; margin-bottom:56px; border-radius:4px;
}
.toc-title { font-family:var(--mono); font-size:11px; font-weight:600; color:var(--champagne); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:16px; }
.toc ol { padding-left:20px; }
.toc li { padding:6px 0; font-size:14px; color:var(--ash); }
.toc a { color:var(--cloud); text-decoration:none; transition:color .2s; }
.toc a:hover { color:var(--champagne); }
.section-num { font-family:var(--mono); font-size:11px; color:var(--champagne); font-weight:600; margin-bottom:8px; }

/* ═══ FORMULAS (ACADEMIC SERIF STYLING) ═══ */
.formula {
  background: transparent;
  color: var(--white);
  padding: 16px 0;
  font-family: var(--serif);
  font-size: 22px;
  font-style: italic;
  text-align: center;
  line-height: 1.6;
  margin: 24px 0;
}
.citation { font-size:13px; color:var(--silver); font-style:italic; margin:16px 0; padding-left:16px; border-left:2px solid rgba(255,255,255,.08); }
.params-table { width:100%; border-collapse:collapse; font-size:14px; margin:24px 0; }
.params-table th {
  padding:12px 16px; text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:0.1em; color:var(--champagne); border-bottom:1px solid rgba(255,255,255,.05); font-weight:500;
}
.params-table td {
  padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.03); font-size:14px; color:var(--cloud);
}
.params-table tr:last-child td { border-bottom:none; }
.params-table td.num { font-family:var(--mono); text-align:right; }
.pipeline { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:28px 0; }
@media (max-width: 768px) {
  .pipeline { grid-template-columns:1fr; }
}
.pipeline-step {
  background:rgba(255,255,255,.015); border:1px solid rgba(255,255,255,.04);
  border-left:3px solid var(--champagne); padding:24px; transition:all .3s;
}
.pipeline-step:hover { background:rgba(255,255,255,.03); border-color:rgba(201,169,110,.12); }
.pipeline-step-num { font-family:var(--mono); font-size:11px; color:var(--silver); font-weight:500; }
.pipeline-step-title { font-family:var(--serif); font-size:18px; font-weight:400; margin:8px 0; color:var(--white); }
.pipeline-step-desc { font-size:13px; color:var(--ash); line-height:1.6; font-weight:300; }

/* ═══ QUANT DASHBOARD SYSTEM ═══ */
.funds-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:48px; }
@media (max-width: 768px) {
  .funds-grid { grid-template-columns:1fr; }
}
.fund-card {
  background:rgba(255,255,255,.015); border:1px solid rgba(255,255,255,.04);
  padding:36px; position:relative; transition:all 0.3s; border-radius:4px;
}
.fund-card:hover { border-color:rgba(201,169,110,.15); background:rgba(255,255,255,.03); }
.fund-card.institutional { border-top:3px solid var(--steel); }
.fund-card.aggressive { border-top:3px solid var(--champagne); }
.fund-tag {
  display:inline-block; padding:4px 10px; border-radius:100px;
  font-size:11px; font-weight:500; letter-spacing:0.05em;
  text-transform:uppercase; margin-bottom:16px; font-family:var(--mono);
}
.fund-tag.inst { background:rgba(255, 255, 255, 0.04); color:var(--cloud); border:1px solid rgba(255, 255, 255, 0.08); }
.fund-tag.agg { background:rgba(201, 169, 110, 0.08); color:var(--champagne); border:1px solid rgba(201, 169, 110, 0.15); }
.fund-name { font-family:var(--serif); font-size:24px; font-weight:400; margin-bottom:6px; color:var(--white); }
.fund-desc { font-size:14px; color:var(--ash); margin-bottom:28px; font-weight:300; }
.fund-metrics { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,.04); overflow:hidden; margin-bottom:28px; border-radius:4px; }
.fund-metric { background:var(--char); padding:18px; text-align:center; }
.fund-metric-value { font-family:var(--mono); font-size:24px; font-weight:400; color:var(--white); }
.fund-metric-label { font-size:10px; color:var(--silver); text-transform:uppercase; letter-spacing:0.06em; margin-top:6px; font-weight:500; }
.fund-details { border-top:1px solid rgba(255,255,255,.04); padding-top:20px; }
.fund-detail-row { display:flex; justify-content:space-between; padding:8px 0; font-size:13px; border-bottom:1px solid rgba(255,255,255,.02); }
.fund-detail-row:last-child { border-bottom:none; }
.fund-detail-label { color:var(--silver); }
.fund-detail-value { font-family:var(--mono); font-weight:400; color:var(--white); }
.weight-row { display:grid; grid-template-columns:180px 1fr 60px; gap:16px; align-items:center; padding:6px 0; }
@media (max-width: 640px) {
  .weight-row { grid-template-columns:120px 1fr 50px; }
}
.weight-name { font-size:13px; font-weight:400; color:var(--cloud); }
.weight-bar-bg { background:rgba(255,255,255,.05); border-radius:2px; height:6px; position:relative; overflow:hidden; }
.weight-bar-fill { height:100%; background:var(--gold); border-radius:2px; transition:width 0.4s ease; }
.weight-bar-fill.inst { background:var(--steel); }
.weight-pct { font-family:var(--mono); font-size:12px; font-weight:400; text-align:right; color:var(--white); }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.grid-3 { display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; }
@media (max-width: 768px) {
  .grid-2, .grid-3 { grid-template-columns:1fr; }
}
.stat-small { background:var(--char); border:1px solid rgba(255,255,255,.03); padding:16px; border-radius:4px; text-align:center; }
.stat-small-label { font-size:11px; color:var(--silver); margin-bottom:6px; text-transform:uppercase; letter-spacing:0.05em; }
.stat-small-value { font-family:var(--mono); font-size:18px; font-weight:400; color:var(--white); }

/* ═══ CHART CANVAS WRAP ═══ */
.chart-canvas-wrap { position:relative; height:360px; margin-top:24px; }

/* ═══ PAGE HEADER & LAYOUT ═══ */
.page-header-section { padding: 140px 60px 40px; text-align: center; }
.page-header { display: flex; justify-content: space-between; align-items: baseline; margin: 56px 0 28px; border-bottom: 1px solid rgba(255,255,255,.04); padding-bottom: 16px; }
.page-title { font-family: var(--serif); font-size: clamp(28px, 4vw, 44px); font-weight: 400; color: var(--white); }
.page-sub { font-size: 15px; color: var(--ash); margin-top: 8px; }

/* ═══ CTA & FOOTER CARDS ═══ */
.cta-section { background:linear-gradient(180deg, var(--black), var(--char)); }
.cta-grid { display:grid; grid-template-columns:1fr 1fr; gap:2px; margin-top:72px; }
.cta-card {
  background:rgba(255,255,255,.015); border:1px solid rgba(255,255,255,.04);
  padding:60px 52px; transition:all .4s;
}
.cta-card:hover { background:rgba(255,255,255,.03); border-color:rgba(201,169,110,.15); }
.cta-label { font-family:var(--mono); font-size:10px; letter-spacing:.3em; text-transform:uppercase; color:var(--champagne); margin-bottom:32px; }
.cta-card h3 { font-family:var(--serif); font-size:28px; font-weight:400; margin-bottom:20px; color:var(--white); }
.cta-card p { font-size:14px; color:var(--ash); line-height:1.8; margin-bottom:36px; font-weight:300; }
.cta-list { list-style:none; margin-bottom:40px; }
.cta-list li {
  padding:11px 0; font-size:13px; color:var(--cloud);
  border-bottom:1px solid rgba(255,255,255,.03);
  display:flex; align-items:center; gap:14px;
}
.cta-list li:last-child { border-bottom:none; }
.cta-list li::before { content:''; width:14px; height:1px; background:var(--champagne); flex-shrink:0; }
.btn { display:inline-flex; align-items:center; gap:12px; padding:15px 36px; font-size:12px; font-weight:500; text-decoration:none; text-transform:uppercase; letter-spacing:.12em; transition:all .35s; cursor:pointer; }
.btn-gold { background:var(--champagne); color:var(--black); border:none; }
.btn-gold:hover { background:var(--white); transform:translateY(-2px); box-shadow:0 16px 48px rgba(201,169,110,.2); }
.btn-ghost { background:transparent; color:var(--cloud); border:1px solid var(--steel); }
.btn-ghost:hover { border-color:var(--champagne); color:var(--champagne); }

/* ========== FOOTER ========== */
footer { padding:80px 60px 48px; border-top:1px solid rgba(255,255,255,.04); }
.footer-inner { max-width:1400px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; }
.footer-brand { font-family:var(--sans); font-size:14px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; margin-bottom:16px; color:var(--cloud); }
.footer-brand span { color:var(--champagne); font-weight:300; }
.footer-tagline { font-size:13px; color:var(--silver); line-height:1.7; max-width:260px; }
.footer-col h4 { font-size:10px; text-transform:uppercase; letter-spacing:.2em; color:var(--champagne); margin-bottom:20px; font-weight:500; }
.footer-col a { display:block; color:var(--silver); text-decoration:none; font-size:13px; padding:4px 0; transition:color .2s; }
.footer-col a:hover { color:var(--champagne); }
.footer-bottom {
  max-width:1400px; margin:48px auto 0; padding-top:32px;
  border-top:1px solid rgba(255,255,255,.04);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;
  font-size:10px; color:var(--steel);
}
.footer-disclaimer { max-width:1400px; margin:28px auto 0; font-size:10px; color:var(--steel); line-height:1.8; }

/* ═══ RESPONSIVE ═══ */
@media(max-width:1024px) {
  section { padding:100px 40px; }
  nav { padding:20px 32px; }
  .about-grid { grid-template-columns:1fr; gap:48px; }
  .principles-grid { grid-template-columns:1fr; }
  .approach-item { grid-template-columns:1fr; gap:8px; }
  .cta-grid { grid-template-columns:1fr; }
  .footer-inner { grid-template-columns:1fr 1fr; }
}
@media(max-width:640px) {
  section { padding:80px 24px; }
  nav { padding:16px 24px; }
  .nav-links a:not(.nav-cta) { display:none; }
  .hero-content { padding:0 24px; }
  .principle { padding:40px 28px; }
  .cta-card { padding:44px 28px; }
  .footer-inner { grid-template-columns:1fr; }
  .scroll-hint { display:none; }
  .quote-section { padding:100px 24px; }
}

/* ═══ CHART TOGGLE BUTTONS ═══ */
.chart-toggles {
  display: flex;
  gap: 8px;
}
.chart-toggle {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.05);
  color: var(--silver);
  padding: 6px 14px;
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  border-radius: 3px;
}
.chart-toggle:hover {
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.15);
}
.chart-toggle.active {
  background: rgba(201, 169, 110, 0.08);
  border-color: var(--champagne);
  color: var(--champagne);
}

/* ═══ ACCESS MODAL SYSTEM ═══ */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(8, 8, 10, 0.75);
  backdrop-filter: blur(12px);
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 24px;
  animation: fadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.modal-content {
  background: rgba(21, 22, 29, 0.85);
  border: 1px solid rgba(201, 169, 110, 0.15);
  box-shadow: 0 48px 96px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.02);
  width: 100%;
  max-width: 480px;
  border-radius: 6px;
  padding: 40px;
  position: relative;
  animation: scaleUp 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.modal-close {
  position: absolute;
  top: 20px;
  right: 20px;
  background: transparent;
  border: none;
  color: var(--silver);
  font-size: 24px;
  cursor: pointer;
  line-height: 1;
  transition: color 0.2s;
}
.modal-close:hover {
  color: var(--white);
}
.modal-desc {
  font-size: 13px;
  color: var(--ash);
  margin-bottom: 24px;
}
.form-group {
  margin-bottom: 20px;
}
.form-group label {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--champagne);
  margin-bottom: 8px;
}
.form-group input, .form-group textarea {
  width: 100%;
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 3px;
  padding: 12px 16px;
  color: var(--white);
  font-family: var(--sans);
  font-size: 14px;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.form-group input:focus, .form-group textarea:focus {
  outline: none;
  border-color: var(--champagne);
  background: rgba(0, 0, 0, 0.4);
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleUp { from { transform: scale(0.95); opacity: 0; } to { transform: scale(1); opacity: 1; } }

