:root {
  color-scheme: dark;
  --bg: #03070b;
  --surface: #071018;
  --surface-2: #0a141d;
  --text: #f4f8fb;
  --muted: #8b99a6;
  --line: #20303b;
  --line-strong: #36505e;
  --cyan: #18d8ff;
  --cyan-soft: rgba(24, 216, 255, 0.12);
  --positive: #65efb0;
  --negative: #ff7185;
  --max: 1320px;
  --gutter: clamp(1rem, 3vw, 2.5rem);
  --section: clamp(5rem, 10vw, 9rem);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 78% 3%, rgba(24,216,255,.11), transparent 31rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .22;
  background-image:
    linear-gradient(rgba(24,216,255,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24,216,255,.032) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black 0%, transparent 88%);
}

a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .2em; }
a:hover { color: var(--cyan); }
img, svg { max-width: 100%; }
button, input, textarea { font: inherit; }
button { color: inherit; }
::selection { background: var(--cyan); color: #001016; }

.skip-link {
  position: fixed; left: 1rem; top: -5rem; z-index: 200;
  padding: .75rem 1rem; background: var(--cyan); color: #001016; font-weight: 800;
}
.skip-link:focus { top: 1rem; }

.site-shell { width: calc(100% - var(--gutter) - var(--gutter)); max-width: var(--max); margin-inline: auto; }
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(3,7,11,.88); backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--line);
}
.header-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { display: inline-flex; align-items: center; color: var(--text); text-decoration: none; font-weight: 850; letter-spacing: -.035em; font-size: clamp(1rem, 2vw, 1.25rem); }
.site-nav { display: flex; align-items: center; gap: clamp(1rem, 2.5vw, 2.25rem); font-size: .82rem; }
.site-nav a { text-decoration: none; color: var(--muted); transition: color .2s ease; }
.site-nav a[aria-current="page"], .site-nav a:hover { color: var(--text); }
.nav-external { display: inline-flex; align-items: center; gap: .4rem; }
.menu-button { display: none; border: 0; background: transparent; width: 44px; height: 44px; cursor: pointer; }
.menu-button span, .menu-button::before, .menu-button::after { content:""; display:block; width:22px; height:1px; margin:6px auto; background:var(--text); transition:.2s ease; }
.menu-button[aria-expanded="true"] span { opacity:0; }
.menu-button[aria-expanded="true"]::before { transform: translateY(7px) rotate(45deg); }
.menu-button[aria-expanded="true"]::after { transform: translateY(-7px) rotate(-45deg); }

main { overflow: hidden; }
.hero { min-height: min(880px, calc(100vh - 76px)); padding: clamp(4rem, 8vw, 7rem) 0 clamp(4rem, 7vw, 6rem); border-bottom: 1px solid var(--line); display: flex; align-items: flex-end; }
.hero-compact { min-height: auto; padding: clamp(4.5rem, 9vw, 8rem) 0 clamp(3.5rem, 7vw, 6rem); }
.eyebrow { display: inline-flex; align-items: center; gap: .65rem; margin: 0 0 1.5rem; color: var(--cyan); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .16em; }
.eyebrow::before { content:""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 18px rgba(24,216,255,.65); }
.display {
  margin: 0;
  max-width: 12ch;
  font-size: clamp(4.1rem, 11vw, 10rem);
  line-height: .83;
  letter-spacing: -.082em;
  font-weight: 780;
}
.display-wide { max-width: 14ch; }
.hero-copy-grid { display:grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.8fr); gap: clamp(2rem,6vw,6rem); align-items:end; margin-top: clamp(2.5rem,5vw,4.5rem); }
.lead { margin:0; max-width: 760px; font-size: clamp(1.15rem, 2.2vw, 1.75rem); line-height: 1.38; letter-spacing: -.025em; color: #c9d2d9; }
.small-note { color: var(--muted); font-size: .8rem; }
.updated-note { justify-self: end; align-self: end; text-align: right; color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .14em; }

.context-strip { padding: clamp(1.25rem, 3vw, 2rem) 0; border-bottom: 1px solid var(--line); background: rgba(7,16,24,.55); }
.context-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.context-item { min-width: 0; padding: 1.35rem 1.5rem 1.4rem; border-right: 1px solid var(--line); }
.context-item:first-child { padding-left: 0; }
.context-item:last-child { border-right: 0; padding-right: 0; }
.context-kicker { display: block; margin-bottom: .6rem; color: var(--cyan); font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; }
.context-item strong { display: block; font-size: 1rem; letter-spacing: -.02em; }
.context-item p { margin: .55rem 0 0; color: var(--muted); font-size: .78rem; }
.compliance-panel { margin-top: 1.5rem; padding: 1.25rem 1.35rem; border: 1px solid var(--line-strong); border-left: 3px solid var(--cyan); background: linear-gradient(135deg, rgba(24,216,255,.08), rgba(7,16,24,.68)); }
.compliance-panel strong { display: block; color: var(--text); font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; }
.compliance-panel p { max-width: 980px; margin: .65rem 0 0; color: #b9c5cc; font-size: .8rem; line-height: 1.65; }
.text-link { display: inline-block; margin-top: .8rem; color: var(--cyan); font-size: .72rem; font-weight: 800; text-decoration: none; text-transform: uppercase; letter-spacing: .09em; }
.text-link:hover { color: var(--text); }

.section { padding: var(--section) 0; border-bottom: 1px solid var(--line); }
.section-tight { padding: clamp(3rem,6vw,5rem) 0; }
.section-head { display:grid; grid-template-columns: minmax(0,1fr) minmax(260px,.42fr); gap:3rem; align-items:end; margin-bottom: clamp(2.5rem,6vw,5rem); }
.section-index { color:var(--cyan); font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.16em; }
.section-title { margin:.65rem 0 0; max-width: 12ch; font-size:clamp(3rem,7vw,7rem); line-height:.88; letter-spacing:-.068em; font-weight:760; }
.section-intro { margin:0; color:var(--muted); max-width: 520px; font-size: .98rem; }

.destination-list { border-top: 1px solid var(--line-strong); }
.destination {
  display:grid; grid-template-columns: 90px minmax(0,1fr) auto; gap:2rem; align-items:center;
  min-height: clamp(150px, 17vw, 230px); border-bottom:1px solid var(--line);
  text-decoration:none; transition: background .24s ease, color .24s ease, padding .24s ease;
}
.destination:hover { padding-inline:1.5rem; background:var(--cyan); color:#001016; }
.destination:hover .destination-copy, .destination:hover .destination-index { color:#17313a; }
.destination-index { color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; }
.destination-title { margin:0; font-size:clamp(2.4rem,5.2vw,5.7rem); line-height:.9; letter-spacing:-.064em; font-weight:760; }
.destination-copy { margin:.75rem 0 0; color:var(--muted); max-width:680px; }
.destination-arrow { font-size:clamp(2rem,4vw,4.2rem); font-weight:300; }

.metrics { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line-strong); }
.metric { padding:1.6rem 1.25rem 1.5rem 0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.metric:not(:nth-child(4n+1)) { padding-left:1.25rem; }
.metric:nth-child(4n) { border-right:0; }
.metric:nth-last-child(-n+4) { border-bottom:0; }
.metric-value { display:block; font-size:clamp(1.8rem,3.4vw,3.6rem); line-height:1; letter-spacing:-.055em; font-weight:760; font-variant-numeric:tabular-nums; }
.metric-value.accent { color:var(--cyan); }
.metric-value.positive { color:var(--positive); }
.metric-label { display:block; margin-top:.6rem; color:var(--muted); font-size:.66rem; text-transform:uppercase; letter-spacing:.13em; }

.editorial-list { border-top:1px solid var(--line-strong); }
.post-row { display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:2rem; align-items:center; padding:2rem 0; border-bottom:1px solid var(--line); text-decoration:none; }
.post-row:hover .post-title { color:var(--cyan); }
.post-meta { color:var(--muted); font-size:.7rem; text-transform:uppercase; letter-spacing:.11em; }
.post-title { margin:0; font-size:clamp(1.55rem,3vw,3.1rem); line-height:1.02; letter-spacing:-.045em; transition:color .2s ease; }
.post-excerpt { margin:.55rem 0 0; color:var(--muted); max-width:760px; font-size:.9rem; }
.post-arrow { font-size:2rem; }

.chart-panel { padding:clamp(1rem,3vw,2rem); border:1px solid var(--line); background:rgba(7,16,24,.78); }
.chart-toolbar { display:flex; align-items:flex-start; justify-content:space-between; gap:2rem; margin-bottom:1.5rem; }
.chart-title { margin:0 0 .65rem; font-size:1rem; text-transform:uppercase; letter-spacing:.1em; }
.chart-legend { display:flex; flex-wrap:wrap; gap:1.25rem; color:var(--muted); font-size:.72rem; }
.legend-item { display:inline-flex; align-items:center; gap:.55rem; }
.legend-line { width:1.6rem; height:2px; background:var(--cyan); }
.legend-line.benchmark { background:#74838d; }
.period-tabs { display:flex; border:1px solid var(--line); }
.period-tab { border:0; border-right:1px solid var(--line); background:transparent; color:var(--muted); padding:.65rem .9rem; font-size:.65rem; font-weight:800; text-transform:uppercase; letter-spacing:.11em; cursor:pointer; }
.period-tab:last-child { border-right:0; }
.period-tab[aria-pressed="true"] { background:var(--cyan); color:#001016; }
.performance-chart { min-height:420px; }
.performance-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.chart-summary { display:grid; grid-template-columns:repeat(3,1fr); margin-top:1.25rem; border-top:1px solid var(--line); }
.chart-summary-item { padding:1.15rem 1rem 0 0; }
.chart-summary-item + .chart-summary-item { padding-left:1rem; border-left:1px solid var(--line); }
.chart-summary-value { display:block; font-size:clamp(1.4rem,3vw,2.1rem); line-height:1; letter-spacing:-.05em; font-weight:800; }
.chart-summary-label { display:block; margin-top:.45rem; color:var(--muted); font-size:.62rem; text-transform:uppercase; letter-spacing:.11em; }
.chart-source { margin:1rem 0 0; color:var(--muted); font-size:.7rem; }

.table-wrap { overflow-x:auto; border-top:1px solid var(--line-strong); }
.portfolio-table { width:100%; min-width:970px; border-collapse:collapse; }
.portfolio-table th, .portfolio-table td { padding:1.1rem .8rem; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
.portfolio-table th { color:var(--muted); font-size:.63rem; text-transform:uppercase; letter-spacing:.12em; font-weight:700; }
.portfolio-table td { font-size:.88rem; font-variant-numeric:tabular-nums; }
.portfolio-table td:first-child { padding-left:0; color:var(--cyan); font-weight:850; }
.portfolio-table th:first-child { padding-left:0; }
.portfolio-table td:last-child, .portfolio-table th:last-child { text-align:right; padding-right:0; }
.gain-positive { color:var(--positive); }
.gain-negative { color:var(--negative); }
.company { color:var(--text); font-weight:700; }

.allocation-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); gap:clamp(2rem,5vw,5rem); }
.allocation-list { border-top:1px solid var(--line-strong); }
.allocation-row { display:grid; grid-template-columns:85px minmax(0,1fr) 60px; gap:1.25rem; align-items:center; min-height:64px; border-bottom:1px solid var(--line); }
.allocation-ticker { font-weight:850; }
.allocation-track { height:7px; background:#101c24; overflow:hidden; }
.allocation-fill { height:100%; background:var(--cyan); box-shadow:0 0 18px rgba(24,216,255,.28); }
.allocation-pct { text-align:right; color:var(--muted); font-variant-numeric:tabular-nums; }
.allocation-callout { align-self:start; padding:clamp(1.5rem,3vw,2.5rem); border:1px solid var(--line); background:linear-gradient(145deg,rgba(24,216,255,.1),rgba(7,16,24,.6)); }
.callout-value { margin:0; color:var(--cyan); font-size:clamp(4rem,8vw,8rem); line-height:.8; letter-spacing:-.075em; }
.callout-label { margin:1.5rem 0 .5rem; font-weight:800; }
.callout-copy { margin:0; color:var(--muted); }

.button { display:inline-flex; align-items:center; justify-content:center; gap:.7rem; min-height:48px; padding:.8rem 1.1rem; border:1px solid var(--cyan); background:var(--cyan); color:#001016; text-decoration:none; font-size:.72rem; font-weight:850; text-transform:uppercase; letter-spacing:.1em; transition:.2s ease; }
.button:hover { color:var(--text); background:transparent; }
.button-ghost { background:transparent; color:var(--text); border-color:var(--line-strong); }
.button-ghost:hover { border-color:var(--cyan); color:var(--cyan); }
.button-row { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }

.split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,7vw,7rem); }
.prose { max-width:780px; }
.prose h2 { margin:3rem 0 1rem; font-size:clamp(2rem,4vw,3.8rem); line-height:.96; letter-spacing:-.05em; }
.prose h3 { margin:2.3rem 0 .75rem; font-size:1.35rem; }
.prose p, .prose li { color:#c2ccd3; }
.prose ul { padding-left:1.1rem; }
.prose a { color:var(--cyan); }
.quote-block { margin:0; padding:clamp(1.5rem,4vw,3rem); border-left:3px solid var(--cyan); background:var(--surface); font-size:clamp(1.25rem,2.5vw,2rem); line-height:1.35; letter-spacing:-.025em; }

.contact-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-strong); }
.contact-link { min-height:200px; padding:1.5rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); text-decoration:none; display:flex; flex-direction:column; justify-content:space-between; }
.contact-link:last-child { border-right:0; }
.contact-link:hover { background:var(--cyan); color:#001016; }
.contact-link small { color:var(--muted); text-transform:uppercase; letter-spacing:.12em; }
.contact-link:hover small { color:#1d3b44; }
.contact-link strong { font-size:clamp(1.5rem,3vw,2.8rem); line-height:1; letter-spacing:-.045em; }

.search-form { display:flex; gap:.75rem; max-width:850px; }
.search-input { width:100%; min-height:56px; padding:0 1rem; border:1px solid var(--line-strong); background:var(--surface); color:var(--text); outline:none; }
.search-input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px var(--cyan-soft); }
.search-results { margin-top:3rem; border-top:1px solid var(--line-strong); }
.search-empty { color:var(--muted); padding:2rem 0; }

.technical-cta { background:radial-gradient(circle at 76% 50%,rgba(24,216,255,.16),transparent 24rem),#010305; }
.technical-grid { display:grid; grid-template-columns:.55fr 1.45fr; gap:clamp(2rem,6vw,6rem); align-items:end; }
.technical-title { margin:0; max-width:10ch; font-size:clamp(3.3rem,8vw,8rem); line-height:.84; letter-spacing:-.075em; }

.site-footer { padding:clamp(3rem,6vw,5rem) 0; }
.footer-top { display:flex; justify-content:space-between; gap:3rem; align-items:flex-start; padding-bottom:2rem; border-bottom:1px solid var(--line); }
.footer-links { display:flex; flex-wrap:wrap; gap:1.25rem; color:var(--muted); font-size:.75rem; }
.footer-links a { text-decoration:none; }
.disclaimer-copy { max-width:1050px; margin:2rem 0 0; color:var(--muted); font-size:.72rem; }
.footer-bottom { display:flex; justify-content:space-between; gap:2rem; margin-top:2rem; color:#60717d; font-size:.68rem; }

.notice { padding:1.2rem 1.35rem; border:1px solid var(--line); background:var(--surface); color:var(--muted); font-size:.8rem; }
.notice strong { color:var(--text); }

@media (max-width: 960px) {
  .site-nav { display:none; position:absolute; left:0; right:0; top:76px; padding:1.25rem var(--gutter) 1.75rem; background:#03070b; border-bottom:1px solid var(--line); flex-direction:column; align-items:flex-start; gap:1rem; font-size:1rem; }
  .site-nav[data-open="true"] { display:flex; }
  .menu-button { display:block; }
  .hero { min-height:auto; }
  .hero-copy-grid, .section-head, .split, .allocation-layout, .technical-grid, .context-grid { grid-template-columns:1fr; }
  .context-item, .context-item:first-child, .context-item:last-child { padding:1.15rem 0; border-right:0; border-bottom:1px solid var(--line); }
  .context-item:last-child { border-bottom:0; }
  .updated-note { justify-self:start; text-align:left; }
  .metrics { grid-template-columns:repeat(2,1fr); }
  .metric:nth-child(2n) { border-right:0; }
  .metric:nth-child(2n+1) { border-right:1px solid var(--line); }
  .metric:nth-last-child(-n+4) { border-bottom:1px solid var(--line); }
  .metric:nth-last-child(-n+2) { border-bottom:0; }
  .destination { grid-template-columns:60px minmax(0,1fr) auto; gap:1rem; }
  .post-row { grid-template-columns:110px minmax(0,1fr) auto; }
  .contact-grid { grid-template-columns:1fr; }
  .contact-link { border-right:0; }
}

@media (max-width: 640px) {
  :root { --gutter: .85rem; }
  .header-inner { min-height:68px; }
  .site-nav { top:68px; }
  .display { font-size:clamp(3.8rem,20vw,6.5rem); }
  .hero-copy-grid { margin-top:2rem; }
  .lead { font-size:1.05rem; }
  .metrics { grid-template-columns:1fr; }
  .metric, .metric:not(:nth-child(4n+1)) { padding:1.25rem 0; border-right:0!important; border-bottom:1px solid var(--line)!important; }
  .metric:last-child { border-bottom:0!important; }
  .destination { grid-template-columns:1fr auto; min-height:170px; padding:1.35rem 0; }
  .destination-index { grid-column:1/-1; }
  .destination-copy { font-size:.82rem; }
  .destination:hover { padding-inline:.75rem; }
  .post-row { grid-template-columns:1fr auto; gap:.8rem; padding:1.5rem 0; }
  .post-meta { grid-column:1/-1; }
  .post-excerpt { font-size:.82rem; }
  .chart-toolbar { display:block; }
  .period-tabs { margin-top:1.25rem; width:max-content; }
  .performance-chart { min-height:300px; margin-inline:-.4rem; }
  .chart-summary { grid-template-columns:1fr; }
  .chart-summary-item, .chart-summary-item + .chart-summary-item { padding:1rem 0; border-left:0; border-bottom:1px solid var(--line); }
  .chart-summary-item:last-child { border-bottom:0; }
  .allocation-row { grid-template-columns:60px minmax(0,1fr) 45px; gap:.7rem; }
  .footer-top, .footer-bottom { flex-direction:column; }
  .search-form { flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; }
}