/* Bricolage Grotesque (SIL OFL 1.1), self-hosted – bez blokujícího CSS z Google Fonts. Variabilní font: jeden soubor = váhy 600–800. */
@font-face { font-family: "Bricolage Grotesque"; font-style: normal; font-weight: 600 800; font-display: swap; src: url("../fonts/bricolage-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Bricolage Grotesque"; font-style: normal; font-weight: 600 800; font-display: swap; src: url("../fonts/bricolage-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --bg: #080f14;
  --surface: #14232c;
  --surface-2: #1b3039;
  --border: #344b55;
  --text: #f0f6f6;
  --muted: #adbec6;
  --accent: #9bf4cf;
  --accent-ink: #09251d;
  --fee: #f3b493;
  --invested: #8ea6b6;
  --error: #FF8F7A;
  --radius: 28px;
  --glass: linear-gradient(135deg, #ffffff12, #ffffff02 45%, #a7e8ff08), #11212be8;
  --glass-shadow: inset 0 1px 0 #ffffff21, inset 0 -1px 0 #ffffff05, 0 24px 64px #00000035;
  --ease: cubic-bezier(.2,.7,.2,1);
  --duration: 180ms;
  --font-display: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-text: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-text);
  font-size: 1rem;
  line-height: 1.6;
  font-variant-numeric: tabular-nums;
}
h1, h2, h3 { font-family: var(--font-display); font-weight: 800; line-height: 1.15; margin: 0; letter-spacing: -0.01em; }
p { margin: 0; }
a { color: var(--accent); text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }

.wrap { width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 16px; }

/* Header */
.site-header { padding: 16px 0; }
.logo { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-family: var(--font-display); font-weight: 600; color: var(--text); text-decoration: none; font-size: 1.0625rem; }
.logo-mark { width: 24px; height: 24px; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--border); position: relative; }
.logo-mark::after { content: ""; position: absolute; left: 4px; right: 4px; bottom: 5px; height: 2px; background: var(--accent); transform: rotate(-30deg); transform-origin: left center; width: 16px; border-radius: 2px; }

/* Hero */
.hero { padding: 8px 0 24px; }
.eyebrow { color: var(--accent); font-weight: 600; font-size: 0.8125rem; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 8px; }
.hero h1 { font-size: clamp(1.875rem, 7.5vw, 3.5rem); max-width: 18ch; }
.sub { margin-top: 16px; font-size: 1.0625rem; color: var(--text); max-width: 56ch; }
.btn-hero { margin-top: 24px; }
.podtext { margin-top: 16px; font-size: 0.8125rem; color: var(--muted); max-width: 70ch; line-height: 1.5; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 24px;
  background: var(--accent); color: var(--accent-ink);
  font: 600 1rem var(--font-text); border: 0; border-radius: 12px;
  text-decoration: none; cursor: pointer;
  transition: transform .15s ease, filter .15s ease;
}
.btn:hover { filter: brightness(1.08); }
.btn:active { transform: translateY(1px); }
.btn[disabled] { opacity: .7; cursor: progress; }

/* Karty */
.wrap > .card, .wrap > .funds, .wrap > .section-head { margin-top: 0; }
section.wrap { margin-bottom: 24px; }
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 24px 20px; }
.lead { color: var(--muted); margin-top: 8px; }
.note { color: var(--muted); font-size: 0.8125rem; line-height: 1.5; margin-top: 16px; }
h2 { font-size: clamp(1.5rem, 5vw, 2.125rem); }

/* Kalkulačka */
.calc-grid { display: grid; gap: 32px; }
.calc-inputs .field { margin-top: 24px; }
.calc-inputs .lead { margin-bottom: 8px; }
label, legend { font-size: 0.9375rem; font-weight: 600; }
.label-row { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.label-row output { font-family: var(--font-display); font-weight: 800; font-size: 1.25rem; color: var(--accent); }
.field > label { display: block; margin-bottom: 8px; }
.hint { color: var(--muted); font-size: 0.8125rem; margin-top: 8px; }
.num-row { display: grid; grid-template-columns: 1fr 112px; gap: 16px; align-items: center; }

input[type=number], input[type=email], input[type=text] {
  width: 100%; min-height: 48px; padding: 0 16px;
  background: var(--surface-2); color: var(--text);
  border: 1px solid var(--border); border-radius: 12px;
  font: 1rem var(--font-text); font-variant-numeric: tabular-nums;
}
input[type=number] { text-align: right; padding: 0 12px; }
input::placeholder { color: #737A80; }
input[aria-invalid=true] { border-color: var(--error); }

.range { -webkit-appearance: none; appearance: none; width: 100%; height: 44px; background: transparent; margin: 0; cursor: pointer; --pct: 0%; }
.range::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: linear-gradient(to right, var(--accent) var(--pct), var(--surface-2) var(--pct)); border: 1px solid var(--border); }
.range::-moz-range-track { height: 6px; border-radius: 3px; background: var(--surface-2); border: 1px solid var(--border); }
.range::-moz-range-progress { height: 6px; border-radius: 3px; background: var(--accent); }
.range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 24px; height: 24px; margin-top: -10px; border-radius: 50%; background: var(--accent); border: 3px solid var(--bg); box-shadow: 0 0 0 1px var(--accent); }
.range::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--accent); border: 3px solid var(--bg); box-shadow: 0 0 0 1px var(--accent); }
.range:focus-visible { outline: none; }
.range:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--text); outline-offset: 3px; }
.range:focus-visible::-moz-range-thumb { outline: 2px solid var(--text); outline-offset: 3px; }

fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { padding: 0; margin-bottom: 8px; }
.seg-row { display: grid; grid-template-columns: repeat(3, 1fr); background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 4px; gap: 4px; }
.seg-row input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.seg-row label { display: flex; align-items: center; justify-content: center; min-height: 44px; border-radius: 8px; cursor: pointer; color: var(--muted); font-family: var(--font-display); font-weight: 600; font-size: 1rem; transition: background .15s, color .15s; }
.seg-row label:hover { color: var(--text); }
.seg-row input:checked + label { background: var(--accent); color: var(--accent-ink); }
.seg-row input:focus-visible + label { outline: 2px solid var(--text); outline-offset: 2px; }

.calc-result { border-top: 1px solid var(--border); padding-top: 32px; min-width: 0; }
.result-title { font-family: var(--font-text); font-weight: 600; font-size: 0.9375rem; color: var(--muted); letter-spacing: 0; }
.big { font-family: var(--font-display); font-weight: 800; color: var(--accent); font-size: clamp(2.5rem, 9vw, 4.5rem); line-height: 1.05; margin-top: 8px; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.big .cur { font-size: 0.5em; font-weight: 600; color: var(--text); letter-spacing: 0; }
.stats { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 8px; }
.stats li { background: var(--surface-2); border-radius: 12px; padding: 12px 16px; font-size: 0.9375rem; line-height: 1.45; }
.stats strong { font-weight: 700; white-space: nowrap; }
.stats li.fee strong { color: var(--fee); }
.stats li.fx { border-left: 3px solid var(--invested); }

.chart-wrap { margin-top: 24px; }
#chart { display: block; width: 100%; height: auto; overflow: visible; }
#chart text { fill: var(--muted); font: 11px var(--font-text); }
#chart .grid { stroke: var(--border); stroke-width: 1; }
.legend { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 16px 0 0; padding: 0; font-size: 0.8125rem; color: var(--muted); }
.legend li { display: flex; align-items: center; gap: 8px; }
.sw { display: inline-block; width: 24px; height: 0; border-top: 3px solid var(--accent); }
.sw-fee { border-top: 3px dashed var(--fee); }
.sw-inv { border-top: 2px solid var(--invested); }
.method { margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.8125rem; line-height: 1.5; }

/* CTA */
.cta { display: grid; gap: 24px; }
.checks { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 8px; }
.checks li { position: relative; padding-left: 24px; font-size: 0.9375rem; }
.checks li::before { content: ""; position: absolute; left: 2px; top: 0.5em; width: 10px; height: 6px; border-left: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(-45deg); }
.lead-form { display: grid; gap: 16px; }
.lead-form .field > label { display: block; margin-bottom: 8px; }
.consent { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; }
.consent input { width: 24px; height: 24px; margin: 0; accent-color: var(--accent); }
.consent label { font-size: 0.8125rem; font-weight: 400; color: var(--muted); line-height: 1.5; }
.field-error, .form-error { color: var(--error); font-size: 0.875rem; margin-top: 8px; }
.form-error { margin-top: 0; }
.micro { color: var(--muted); font-size: 0.8125rem; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.lead-form .btn { width: 100%; }
.form-success { background: var(--surface-2); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: 12px; padding: 20px; }

/* SPIVA */
.bars { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 16px; }
.bars li { display: grid; grid-template-columns: 56px 1fr 64px; gap: 12px; align-items: center; font-size: 0.9375rem; }
.bar { height: 12px; background: var(--surface-2); border-radius: 6px; overflow: hidden; }
.bar-fill { display: block; height: 100%; background: var(--fee); border-radius: 6px; }
.w-79 { width: 78.78%; } .w-86 { width: 85.59%; } .w-90 { width: 89.93%; } .w-93 { width: 92.89%; }
.bar-val { text-align: right; font-weight: 700; }

/* Fondy */
.section-head { margin-bottom: 24px; }
.funds { display: grid; gap: 16px; }
.fund { display: flex; flex-direction: column; gap: 16px; }
.ticker { font-size: 2rem; color: var(--accent); }
.ucits { margin-top: auto; background: var(--surface-2); border-radius: 12px; padding: 16px; font-size: 0.9375rem; }
.ucits-label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; margin-bottom: 4px; }
.fund-note { margin-top: 16px; }

/* FAQ */
.faq h2 { margin-bottom: 16px; }
details { border-top: 1px solid var(--border); }
summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 56px; padding: 12px 0; font-weight: 600; }
summary::-webkit-details-marker { display: none; }
summary::after { content: ""; flex: none; width: 10px; height: 10px; border-right: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(45deg); transition: transform .2s ease; margin-right: 4px; }
details[open] > summary::after { transform: rotate(-135deg); }
details > p { padding: 0 0 20px; color: var(--muted); max-width: 70ch; }

/* Footer */
.site-footer { border-top: 1px solid var(--border); margin-top: 48px; padding: 40px 0 56px; color: var(--muted); font-size: 0.8125rem; line-height: 1.6; }
.site-footer p + p { margin-top: 8px; }
.foot-h { font-size: 1rem; color: var(--text); margin-bottom: 8px; }
.site-footer .warn { color: var(--text); }

/* Zásady */
.doc { max-width: 720px; }
.doc h1 { font-size: clamp(1.75rem, 6vw, 2.5rem); margin: 8px 0 24px; }
.doc p { margin-top: 16px; }
.back { display: inline-flex; align-items: center; min-height: 44px; }

/* Scroll-reveal */
/* Scroll-reveal je vypnutý (design Liquid Glass) – karty jsou vždy vidět; transform nechávám volný pro hover efekty. */
html.js .reveal, html.js .reveal.is-visible { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html.js .reveal { opacity: 1; transform: none; transition: none; }
  * { transition-duration: 0s !important; }
}

@media (min-width: 640px) {
  .card { padding: 28px; }
  .funds { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 900px) {
  .site-header { padding: 24px 0; }
  .hero { padding: 24px 0 40px; }
  section.wrap { margin-bottom: 32px; }
  .calc.card { padding: 40px; }
  .calc-grid { grid-template-columns: minmax(280px, 380px) 1fr; gap: 48px; align-items: start; }
  .calc-result { border-top: 0; padding-top: 0; border-left: 1px solid var(--border); padding-left: 48px; }
  .cta { grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: start; padding: 40px; }
  .site-footer .wrap { max-width: 1100px; }
}

/* Liquid market: static scenery, polished glass, no scroll entrances. */
body {
  background-image: radial-gradient(ellipse at 85% 3%, #1b655a38, transparent 34%), radial-gradient(ellipse at 0 28%, #285d7829, transparent 38%);
  background-size: 100% 1600px;
  background-repeat: no-repeat;
}
.wrap { max-width: 1200px; padding-inline: 20px; }
.site-header { position: relative; z-index: 1; }
.site-header .wrap { display: flex; align-items: center; }
.site-header .wrap::after { content: ''; height: 1px; flex: 1; margin-left: 28px; background: linear-gradient(90deg, #b1e4da30, transparent); }
.logo { gap: 12px; letter-spacing: -.03em; }
.logo-mark { width: 34px; height: 34px; border-radius: 11px; background: linear-gradient(140deg, #b0f8dc38, #c0efff08); box-shadow: inset 0 1px 0 #ffffff35; }
.logo-mark::after { left: 8px; bottom: 10px; }
.hero { position: relative; overflow: hidden; isolation: isolate; padding: 20px 0 32px; }
.hero::before { content: ''; position: absolute; z-index: -2; inset: 0; background-image: linear-gradient(#a1d5d309 1px, transparent 1px), linear-gradient(90deg, #a1d5d309 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg, transparent, #000); }
.market-art { position: absolute; z-index: -1; right: -160px; top: 0; width: 820px; height: 100%; color: var(--accent); opacity: .16; pointer-events: none; mask-image: linear-gradient(90deg, transparent, #000 40%); }
.hero .wrap { position: relative; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; border: 1px solid #b5eed32b; border-radius: 999px; background: #a4ebd00a; padding: 6px 12px; font-size: .6875rem; letter-spacing: .13em; margin-bottom: 18px; }
.eyebrow::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px #9bf4cf66; }
.hero h1 { font-size: clamp(2.2rem, 6vw, 4.6rem); letter-spacing: -.055em; max-width: 18ch; line-height: 1.04; text-wrap: balance; }
.sub { color: #c7d6dc; font-size: 1rem; max-width: 57ch; }
.podtext { font-size: .75rem; max-width: 83ch; }
.btn { border-radius: 999px; background: linear-gradient(160deg, #c2ffe6, #8cebc4); border: 1px solid #d1ffeb; box-shadow: inset 0 1px 0 #fff8, 0 5px 22px #64dcae15; min-height: 50px; transition: transform var(--duration) var(--ease); }
.btn-hero::after { content: '↗' / ''; margin-left: 20px; font-size: 1.2rem; }
.card { background: var(--glass); border: 1px solid #a9d6e12e; box-shadow: var(--glass-shadow); padding: 25px 20px; }
/* Small screens retain the glass highlights without costly backdrop compositing. */
@media (min-width: 900px) {
  @supports (backdrop-filter: blur(12px)) { .calc.card, .cta.card { background: linear-gradient(135deg, #ffffff0e, #ffffff02 45%, #a7e8ff07), #11212bd4; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); } }
}
section.wrap { margin-bottom: 24px; scroll-margin-top: 24px; }
h2 { letter-spacing: -.04em; font-size: clamp(1.6rem, 3vw, 2.2rem); }
.calc { position: relative; }
.calc-inputs h2 { max-width: 15ch; }
.calc-inputs .lead { font-size: .875rem; }
.calc-inputs .field { margin-top: 22px; }
.range::-webkit-slider-runnable-track { height: 5px; border: 0; background: linear-gradient(to right, var(--accent) var(--pct), #3d505b var(--pct)); }
.range::-webkit-slider-thumb { width: 25px; height: 25px; margin-top: -10px; border: 1px solid #eafff4; background: linear-gradient(145deg, #fff, #a1d8c5); box-shadow: 0 2px 8px #0008, inset 0 0 0 4px #f2fff933; }
.range::-moz-range-thumb { background: #d6fbe9; border: 1px solid #fff; box-shadow: 0 2px 8px #0008; }
input[type=number], input[type=email], input[type=text] { background: #07121980; border-color: #9cc4cf38; border-radius: 14px; box-shadow: inset 0 2px 6px #0002; }
input::placeholder { color: #a1b1bb; }
.seg-row { background: #07121980; border-radius: 18px; padding: 5px; }
.seg-row label { border-radius: 12px; }
.seg-row input:checked + label { background: linear-gradient(145deg, #cfffe722, #9bf4cf12); color: #c2ffe3; box-shadow: inset 0 0 0 1px #b8ffe459, 0 2px 6px #0003; }
.result-title { font-size: .8125rem; font-weight: 500; }
.big { color: #c6ffe6; letter-spacing: -.065em; font-size: clamp(2.5rem, 8.8vw, 4.4rem); text-shadow: 0 0 38px #9bf4cf15; margin-top: 12px; }
.big .cur { font-size: .36em; color: var(--muted); }
.stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 22px; }
.stats li { background: #d0edff05; border: 1px solid #b8d9e41a; border-radius: 16px; padding: 13px 12px; font-size: .8125rem; color: #b8cbd3; }
.stats strong { color: var(--text); }
.stats li.fx { border-left: 1px solid #b8d9e41a; }
.chart-wrap { padding: 18px 0 12px; border-top: 1px solid #b8d9e426; border-bottom: 1px solid #b8d9e426; background: radial-gradient(ellipse at 70% 10%, #93f9ce0c, transparent 65%); }
#chart .grid { stroke: #b4d8e31c; stroke-dasharray: 3 5; }
#chart path[stroke="var(--accent)"] { filter: drop-shadow(0 0 4px #9bf4cf55); stroke-width: 3; }
.legend { gap: 8px 16px; font-size: .6875rem; }
.sw { width: 16px; border-radius: 2px; }
.note, .method { font-size: .75rem; }
.method { margin-top: 26px; }
.cta { background: radial-gradient(ellipse at 0 0, #71c5a51c, transparent 60%), var(--glass); }
.cta-form { padding: 22px; border-radius: 22px; background: #070f164d; border: 1px solid #d2eeff1a; }
.cta .checks { gap: 12px; }
.checks li { font-size: .875rem; color: #c3d2d9; }
.consent { gap: 9px; }
.consent label { font-size: .75rem; overflow-wrap: anywhere; }
.spiva h2 { max-width: 23ch; }
.bars { gap: 20px; }
.bar { height: 9px; background: #b4d3e010; }
.bar-fill { background: linear-gradient(90deg, #839da7, #c7e7dc); box-shadow: inset 0 1px 0 #fff5; }
.bar-val { color: #deeee7; }
#fondy { padding-top: 30px; padding-bottom: 12px; }
.section-head { max-width: 780px; margin-bottom: 28px; }
.fund { position: relative; overflow: hidden; }
.fund::before { content: ''; position: absolute; top: 0; left: 28px; right: 28px; height: 1px; background: linear-gradient(90deg, transparent, #beffe09c, transparent); }
.ticker { font-size: 2.6rem; letter-spacing: -.055em; }
.fund > p { color: #c0d0d7; font-size: .875rem; }
.ucits { background: #06121a66; border: 1px solid #aad7e21a; font-size: .8125rem; border-radius: 18px; }
.ucits-label { color: var(--accent); font-size: .625rem; margin-bottom: 8px; }
.faq h2 { margin-bottom: 26px; }
summary { min-height: 68px; font-size: .9375rem; }
details[open] > summary { color: var(--accent); }
details > p { font-size: .875rem; }
.site-footer { background: #040a0e55; border-top-color: #aacbd91f; }
.doc { margin: 24px auto 64px; }
@media (hover: hover) {
  .btn:hover { transform: translateY(-2px); filter: none; }
  .fund:hover { border-color: #b8ffe46b; }
}
@media (max-width: 399px) {
  .wrap { padding-inline: 14px; }
  .card { padding: 22px 17px; border-radius: 24px; }
  .cta-form { padding: 16px; }
  .hero h1 { font-size: 2.15rem; }
  .stats li { padding: 11px 9px; }
}
@media (max-width: 899px) {
  #chart path[stroke="var(--accent)"] { filter: none; }
  .card { box-shadow: inset 0 1px 0 #ffffff21, inset 0 -1px 0 #ffffff05; }
  .big { text-shadow: none; }
}
@media (min-width: 640px) and (max-width: 899px) { .funds { grid-template-columns: 1fr; } }
@media (min-width: 900px) {
  .site-header { padding: 20px 0; }
  .hero { padding: 34px 0 48px; }
  .market-art { right: max(-120px, calc((100vw - 1450px) / 2)); opacity: .45; }
  .hero h1 { max-width: 16ch; }
  .hero .sub { margin-top: 22px; }
  .calc.card { padding: 34px; }
  .calc-grid { grid-template-columns: minmax(260px, .8fr) minmax(0, 1.3fr); gap: 36px; }
  .calc-inputs { padding: 10px 0; }
  .calc-result { padding: 26px; border: 1px solid #cceaff21; border-radius: 24px; background: linear-gradient(145deg, #9bf4cf08, #050e154d); box-shadow: inset 0 1px 0 #fff1; }
  section.wrap { margin-bottom: 32px; }
  .cta { grid-template-columns: 1.1fr 1fr; padding: 38px; gap: 48px; align-items: center; }
  .spiva { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 56px; padding: 38px; }
  .spiva .lead { grid-column: 1; margin-top: 0; font-size: .875rem; }
  .spiva .bars { grid-column: 2; grid-row: 1 / 3; margin: 8px 0; align-content: center; }
  .spiva .note { grid-column: 1 / -1; padding-top: 18px; border-top: 1px solid #b8d9e41a; }
  .fund { padding: 28px; }
  .faq { padding: 38px; }
  .site-footer .wrap { max-width: 1200px; }
}
@media (prefers-reduced-motion: reduce) { .btn:hover { transform: none; } }