/* ============================================
   THE ARK — Bold Futuristic Cyberpunk Fintech
   ============================================ */
:root {
  --bg: #050810; --bg-2: #080C18; --bg-3: #0C1124;
  --surface: #0F1428; --surface-2: #131938;
  --line: rgba(59,130,246,0.15); --line-strong: rgba(59,130,246,0.3); --line-gold: rgba(240,192,90,0.25);
  --text: #F0F4FF; --text-dim: #A0AAC8; --text-mute: #6878A0;
  --gold: #F0C05A; --gold-bright: #FFD97A; --blue: #3B82F6; --blue-bright: #60A5FA; --green: #4ADE80;
  --display: 'Cormorant Garamond', Georgia, serif; --sans: 'Space Grotesk', system-ui, sans-serif; --mono: 'JetBrains Mono', monospace;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background: var(--bg); color: var(--text); font-family: var(--sans); font-weight: 500; line-height: 1.6; overflow-x: hidden; -webkit-font-smoothing: antialiased; background-image: radial-gradient(ellipse at 20% 0%, rgba(59,130,246,0.08) 0%, transparent 50%), radial-gradient(ellipse at 80% 100%, rgba(240,192,90,0.06) 0%, transparent 50%), linear-gradient(rgba(59,130,246,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(59,130,246,0.03) 1px, transparent 1px); background-size: 100% 100%, 100% 100%, 40px 40px, 40px 40px; background-attachment: fixed; }
img { max-width:100%; display:block; } a { color:inherit; text-decoration:none; }
h1,h2,h3 { font-family: var(--display); font-weight:700; line-height:1.05; letter-spacing:-0.02em; }
.gold { color: var(--gold-bright); text-shadow: 0 0 30px rgba(240,192,90,0.3); }
.blue { color: var(--blue-bright); text-shadow: 0 0 30px rgba(59,130,246,0.3); }
.container { max-width:1280px; margin:0 auto; padding:0 40px; }
.btn { display:inline-flex; align-items:center; gap:8px; padding:14px 28px; border-radius:6px; font-family: var(--sans); font-size:14px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; cursor:pointer; border:none; transition: all .25s ease; position:relative; }
.btn-primary { background: linear-gradient(135deg, var(--gold) 0%, #D4A535 100%); color:#0a0a0a; box-shadow: 0 4px 20px rgba(240,192,90,0.35), inset 0 1px 0 rgba(255,255,255,0.2); }
.btn-primary:hover { background: linear-gradient(135deg, var(--gold-bright) 0%, var(--gold) 100%); transform:translateY(-2px); box-shadow: 0 8px 30px rgba(240,192,90,0.5), inset 0 1px 0 rgba(255,255,255,0.3); }
.btn-ghost { background: rgba(59,130,246,0.08); color:var(--text); border:1px solid var(--line-strong); backdrop-filter: blur(4px); }
.btn-ghost:hover { border-color:var(--gold); color:var(--gold-bright); background: rgba(240,192,90,0.08); box-shadow: 0 0 20px rgba(240,192,90,0.15); }
.btn-lg { padding:18px 36px; font-size:15px; } .btn-xl { padding:22px 48px; font-size:17px; border-radius:8px; }
.nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:16px 0; transition: all .3s ease; background: rgba(5,8,16,0.7); backdrop-filter: blur(20px); border-bottom: 1px solid transparent; }
.nav.scrolled { background: rgba(5,8,16,0.95); border-bottom:1px solid var(--line); box-shadow: 0 4px 30px rgba(0,0,0,0.3); }
.nav-inner { max-width:1280px; margin:0 auto; padding:0 40px; display:flex; align-items:center; justify-content:space-between; }
.nav-logo { display:flex; align-items:center; gap:10px; font-family:var(--display); font-size:26px; font-weight:700; letter-spacing:0.04em; }
.nav-logo span { background: linear-gradient(135deg, var(--gold-bright), var(--gold)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.nav-mark { width:30px; height:30px; color:var(--gold); filter: drop-shadow(0 0 8px rgba(240,192,90,0.4)); }
.nav-links { display:flex; gap:32px; }
.nav-links a { font-size:14px; font-weight:700; color:var(--text-dim); letter-spacing:0.04em; transition:all .2s; text-transform:uppercase; }
.nav-links a:hover { color:var(--gold-bright); text-shadow: 0 0 12px rgba(240,192,90,0.3); }
.nav-cta { padding:10px 22px; font-size:12px; }
@media (max-width: 980px) { .nav-links { display:none; } }
.section { padding:140px 0; position:relative; } .section-alt { background: var(--bg-2); }
.section-head { max-width:800px; margin-bottom:72px; }
.section-eyebrow { font-family:var(--mono); font-size:16px; font-weight:700; letter-spacing:0.2em; color:var(--blue-bright); margin-bottom:20px; text-shadow: 0 0 15px rgba(59,130,246,0.3); text-transform:uppercase; }
.gold-eyebrow { color:var(--gold-bright); text-shadow: 0 0 18px rgba(240,192,90,0.4); font-size:17px; }
.section-title { font-size:clamp(40px, 6.5vw, 72px); margin-bottom:24px; font-weight:700; }
.section-lead { font-size:20px; color:var(--text-dim); line-height:1.6; font-weight:400; }
.body-copy { font-size:17px; color:var(--text-dim); margin-top:16px; line-height:1.7; font-weight:400; }
.hero { position:relative; min-height:100vh; display:flex; align-items:center; padding:160px 0 80px; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:0; } .hero-img { width:100%; height:100%; object-fit:cover; opacity:0.5; }
.hero-overlay { position:absolute; inset:0; background: linear-gradient(180deg, rgba(5,8,16,0.3) 0%, rgba(5,8,16,0.7) 55%, var(--bg) 100%), radial-gradient(ellipse at center, transparent 0%, rgba(5,8,16,0.4) 100%); }
.hero-content { position:relative; z-index:2; max-width:900px; padding:0 40px; margin:0 auto; }
.hero-eyebrow { font-family:var(--mono); font-size:15px; font-weight:700; letter-spacing:0.25em; color:var(--gold-bright); margin-bottom:32px; text-shadow: 0 0 20px rgba(240,192,90,0.4); text-transform:uppercase; }
.hero-title { font-size:clamp(56px, 9vw, 112px); font-weight:700; line-height:0.98; margin-bottom:32px; letter-spacing:-0.03em; }
.hero-sub { font-size:22px; color:var(--text-dim); max-width:700px; margin-bottom:44px; line-height:1.55; font-weight:400; }
.hero-cta { display:flex; gap:16px; flex-wrap:wrap; margin-bottom:64px; }
.trust-strip { display:flex; gap:36px; flex-wrap:wrap; }
.trust-item { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--text-mute); letter-spacing:0.03em; }
.trust-item .icon { width:20px; height:20px; color:var(--gold); filter: drop-shadow(0 0 6px rgba(240,192,90,0.3)); }
.pillar-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width: 980px) { .pillar-grid { grid-template-columns:1fr; } }
.pillar { background: var(--surface); border:1px solid var(--line); border-radius:12px; padding:44px 36px; transition: all .35s ease; position:relative; overflow:hidden; }
.pillar::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg, transparent, var(--gold), transparent); opacity:0; transition:opacity .3s; }
.pillar:hover { border-color: var(--line-gold); transform: translateY(-6px); box-shadow: 0 20px 60px rgba(59,130,246,0.1); }
.pillar:hover::before { opacity:1; }
.pillar-icon { width:56px; height:56px; color:var(--gold); margin-bottom:28px; filter: drop-shadow(0 0 12px rgba(240,192,90,0.2)); }
.pillar-icon svg { width:100%; height:100%; }
.pillar h3 { font-size:28px; margin-bottom:16px; font-weight:700; }
.pillar p { color:var(--text-dim); font-size:16px; line-height:1.65; font-weight:400; }
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
@media (max-width: 980px) { .two-col { grid-template-columns:1fr; gap:48px; } }
.col-text .section-title { margin-bottom:24px; }
.pullquote { font-family:var(--display); font-size:24px; font-style:italic; font-weight:600; color:var(--gold-bright); margin-top:36px; padding-left:24px; border-left: 3px solid var(--gold); text-shadow: 0 0 20px rgba(240,192,90,0.15); }
.pullquote-center { text-align:center; padding:36px 0 0; border:none; max-width:800px; margin:56px auto 0; }
.arkie-img { border-radius:12px; margin-bottom:36px; border:1px solid var(--line); box-shadow: 0 20px 60px rgba(59,130,246,0.1); }
.stage-flow { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.stage { font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:0.08em; padding:10px 16px; border:1px solid var(--line-strong); border-radius:99px; color:var(--text-dim); }
.stage-final { background: linear-gradient(135deg, var(--gold), #D4A535); color:#0a0a0a; border-color:var(--gold); font-weight:700; }
.layer-stack { max-width:800px; margin:0 auto; }
.layer { display:flex; align-items:flex-start; gap:36px; padding:36px; background:var(--surface); border:1px solid var(--line); border-radius:12px; margin-bottom:14px; transition:all .35s ease; position:relative; overflow:hidden; }
.layer::after { content:''; position:absolute; inset:0; background: linear-gradient(135deg, transparent 60%, rgba(59,130,246,0.04) 100%); pointer-events:none; }
.layer:hover { border-color:var(--line-strong); transform:translateX(8px); box-shadow: -8px 0 30px rgba(59,130,246,0.05); }
.layer-1 { border-left:5px solid var(--blue); box-shadow: -4px 0 20px rgba(59,130,246,0.08); }
.layer-2 { border-left:5px solid var(--gold); box-shadow: -4px 0 20px rgba(240,192,90,0.08); }
.layer-3 { border-left:5px solid var(--green); box-shadow: -4px 0 20px rgba(74,222,128,0.08); }
.layer-num { font-family:var(--mono); font-size:32px; font-weight:700; color:var(--text-mute); min-width:56px; }
.layer-body h3 { font-size:24px; margin-bottom:10px; font-weight:700; }
.layer-body p { color:var(--text-dim); font-size:16px; font-weight:400; }
.section-compound { position:relative; overflow:hidden; }
.compound-bg { position:absolute; inset:0; z-index:0; }
.compound-img { width:100%; height:100%; object-fit:cover; opacity:0.2; }
.compound-overlay { position:absolute; inset:0; background: radial-gradient(ellipse at center, rgba(5,8,16,0.3) 0%, var(--bg) 75%); }
.compound-content { position:relative; z-index:2; }
.compound-counter { background: linear-gradient(180deg, var(--surface), var(--surface-2)); border:1px solid var(--line-gold); border-radius:16px; padding:56px; margin:56px 0; text-align:center; box-shadow: 0 24px 80px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.05); }
.counter-label { font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:0.22em; color:var(--gold-bright); margin-bottom:36px; text-shadow: 0 0 15px rgba(240,192,90,0.3); }
.counter-track { display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:44px; flex-wrap:wrap; }
.counter-node { font-family:var(--mono); font-size:13px; font-weight:600; padding:10px 18px; border:1px solid var(--line-strong); border-radius:99px; color:var(--text-dim); }
.counter-node.done { color:var(--blue-bright); border-color:rgba(59,130,246,0.4); background: rgba(59,130,246,0.08); }
.counter-node.final { background: linear-gradient(135deg, var(--gold), #D4A535); color:#0a0a0a; border-color:var(--gold); font-weight:700; box-shadow: 0 0 20px rgba(240,192,90,0.3); }
.counter-line { width:48px; height:2px; background: linear-gradient(90deg, var(--line-strong), var(--line-gold)); }
.counter-figure { margin-top:28px; }
.counter-num { font-family:var(--display); font-size:clamp(64px, 11vw, 128px); font-weight:700; color:var(--gold-bright); line-height:1; text-shadow: 0 0 40px rgba(240,192,90,0.3); }
.counter-suffix { font-family:var(--display); font-size:56px; color:var(--gold-bright); font-weight:700; }
.counter-cap { font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:0.1em; color:var(--text-mute); margin-top:14px; }
.compound-note { max-width:720px; margin:0 auto; text-align:center; font-size:18px; color:var(--text-dim); line-height:1.65; font-weight:400; }
.compound-note strong { color:var(--gold-bright); font-weight:700; }
.compound-quote { max-width: 720px; margin: 48px auto 0; text-align: center; padding: 40px 48px; border-radius: 16px; background: linear-gradient(135deg, rgba(240,192,90,0.06), rgba(59,130,246,0.04)); border: 1px solid var(--line-gold); box-shadow: 0 16px 60px rgba(240,192,90,0.06), inset 0 1px 0 rgba(255,255,255,0.04); }
.compound-quote p { font-family: var(--display); font-size: 26px; font-weight: 700; line-height: 1.3; color: var(--gold-bright); text-shadow: 0 0 30px rgba(240,192,90,0.2); }
.compound-quote .compound-quote-cta { font-size: 22px; color: var(--blue-bright); margin-top: 16px; text-shadow: 0 0 30px rgba(59,130,246,0.2); }
.section-banner { width:100%; height:280px; object-fit:cover; border-radius:16px; border:1px solid var(--line); margin-bottom:48px; box-shadow: 0 20px 60px rgba(0,0,0,0.3); }
.bond-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width: 1100px) { .bond-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px) { .bond-grid { grid-template-columns:1fr; } }
.bond-card { position:relative; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:44px 32px; transition:all .35s ease; overflow:hidden; }
.bond-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg, transparent, var(--blue), transparent); opacity:0; transition:opacity .3s; }
.bond-card:hover { transform:translateY(-8px); border-color:var(--line-strong); box-shadow: 0 24px 60px rgba(0,0,0,0.3); }
.bond-card:hover::before { opacity:1; }
.bond-card-mid { border-color: rgba(59,130,246,0.25); } .bond-card-mid::before { background: linear-gradient(90deg, transparent, var(--blue), transparent); }
.bond-card-pro { border-color:var(--line-gold); background:linear-gradient(180deg, var(--surface), rgba(240,192,90,0.06)); box-shadow: 0 20px 60px rgba(240,192,90,0.08); }
.bond-card-pro::before { background: linear-gradient(90deg, transparent, var(--gold), transparent); opacity:1; }
.bond-card-pro:hover { box-shadow: 0 24px 80px rgba(240,192,90,0.15); }
.bond-card-elite { border:2px solid var(--gold); background:linear-gradient(180deg, var(--surface), rgba(240,192,90,0.08)); box-shadow: 0 24px 70px rgba(240,192,90,0.12); }
.bond-card-elite::before { background: linear-gradient(90deg, transparent, var(--gold-bright), transparent); opacity:1; height:4px; }
.bond-card-elite:hover { box-shadow: 0 28px 90px rgba(240,192,90,0.2); transform:translateY(-10px); }
.bond-tag { position:absolute; top:18px; right:18px; font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.15em; padding:6px 12px; border-radius:4px; background:rgba(59,130,246,0.12); color:var(--blue-bright); }
.bond-tag-gold { background: linear-gradient(135deg, var(--gold), #D4A535); color:#0a0a0a; }
.bond-tag-elite { background: linear-gradient(135deg, var(--gold-bright), var(--gold)); color:#0a0a0a; font-weight:700; }
.bond-lock { font-family:var(--mono); font-size:16px; font-weight:700; letter-spacing:0.1em; color:var(--text); margin-bottom:28px; }
.bond-yield { margin-bottom:24px; }
.bond-num { font-family:var(--display); font-size:44px; font-weight:700; color:var(--text); }
.bond-unit { font-family:var(--mono); font-size:16px; color:var(--text-dim); margin-left:4px; font-weight:500; }
.bond-cap { font-size:12px; color:var(--text-mute); margin-top:4px; letter-spacing:0.04em; font-weight:500; }
.bond-annual { padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:16px; }
.bond-annual-num { font-family:var(--display); font-size:36px; font-weight:700; color:var(--blue-bright); text-shadow: 0 0 20px rgba(59,130,246,0.2); }
.bond-annual-cap { font-size:11px; color:var(--text-mute); margin-top:4px; letter-spacing:0.06em; font-weight:500; }
.bond-discount { font-family:var(--mono); font-size:13px; font-weight:600; color:var(--text-dim); margin-bottom:16px; }
.bond-note { font-size:13px; color:var(--text-mute); line-height:1.55; font-weight:400; }
.bond-footnote { margin-top:36px; text-align:center; font-size:13px; color:var(--text-mute); max-width:720px; margin-left:auto; margin-right:auto; font-weight:400; }
.section-arkie-deep { background: linear-gradient(180deg, var(--bg-2) 0%, var(--bg) 50%, var(--bg-2) 100%); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.arkie-deep-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width: 980px) { .arkie-deep-grid { grid-template-columns:1fr; } }
.arkie-deep-card { background: var(--surface); border:1px solid var(--line); border-radius:14px; padding:44px 36px; transition:all .35s ease; position:relative; overflow:hidden; }
.arkie-deep-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg, transparent, var(--gold), transparent); opacity:0; transition:opacity .3s; }
.arkie-deep-card:hover { border-color: var(--line-gold); transform: translateY(-6px); box-shadow: 0 20px 60px rgba(240,192,90,0.08); }
.arkie-deep-card:hover::before { opacity:1; }
.arkie-deep-icon { width:56px; height:56px; color:var(--gold); margin-bottom:28px; filter: drop-shadow(0 0 12px rgba(240,192,90,0.2)); }
.arkie-deep-icon svg { width:100%; height:100%; }
.arkie-deep-card h3 { font-size:26px; margin-bottom:16px; font-weight:700; }
.arkie-deep-card > p { color:var(--text-dim); font-size:16px; line-height:1.65; font-weight:400; margin-bottom:24px; }
.arkie-deep-list { list-style:none; }
.arkie-deep-list li { padding:12px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--text-dim); line-height:1.6; font-weight:400; position:relative; padding-left:24px; }
.arkie-deep-list li:last-child { border-bottom:none; }
.arkie-deep-list li::before { content:''; position:absolute; left:0; top:18px; width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 8px rgba(240,192,90,0.4); }
.engines-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
@media (max-width: 980px) { .engines-grid { grid-template-columns:1fr; } }
.engine-block { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:44px 36px; position:relative; overflow:hidden; }
.engine-block::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg, transparent, var(--gold), transparent); opacity:0.6; }
.engine-header { display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.engine-tag { font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:0.1em; padding:6px 12px; border-radius:5px; }
.engine-block .engine-tag.gold { background:rgba(240,192,90,0.12); color:var(--gold-bright); }
.engine-block .engine-tag.blue { background:rgba(59,130,246,0.12); color:var(--blue-bright); }
.engine-header h3 { font-size:26px; font-weight:700; }
.game-list { list-style:none; margin-bottom:28px; }
.game-list li { padding:16px 0; border-bottom:1px solid var(--line); font-size:16px; color:var(--text-dim); font-weight:400; }
.game-list li:last-child { border-bottom:none; }
.game-list li strong { color:var(--text); display:block; margin-bottom:6px; font-weight:600; font-size:17px; }
.engine-foot { font-size:15px; color:var(--text-mute); line-height:1.6; font-weight:400; }
.section-final { text-align:center; padding:160px 0; background: radial-gradient(ellipse at top, var(--bg-2), var(--bg)); }
.final-cta { margin-top:52px; }
.final-cta-secondary { display:flex; justify-content:center; gap:16px; margin:24px 0 40px; flex-wrap:wrap; }
.section-contact { text-align:center; padding:160px 0; background: linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%); border-top:1px solid var(--line); }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:720px; margin:0 auto; }
@media (max-width: 880px) { .contact-grid { grid-template-columns:1fr; } }
.contact-card { display:flex; flex-direction:column; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:48px 36px; transition:all .35s ease; text-decoration:none; position:relative; overflow:hidden; }
.contact-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg, transparent, var(--gold), transparent); opacity:0; transition:opacity .3s; }
.contact-card:hover { border-color:var(--line-gold); transform:translateY(-6px); box-shadow: 0 20px 60px rgba(240,192,90,0.08); }
.contact-card:hover::before { opacity:1; }
.contact-icon { width:56px; height:56px; color:var(--gold); margin-bottom:12px; filter: drop-shadow(0 0 12px rgba(240,192,90,0.2)); }
.contact-icon svg { width:100%; height:100%; }
.contact-label { font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:0.15em; color:var(--text-mute); text-transform:uppercase; }
.contact-value { font-family:var(--display); font-size:28px; font-weight:700; color:var(--text); }
.contact-card:hover .contact-value { color:var(--gold-bright); }
.contact-sub { font-size:13px; color:var(--text-mute); font-weight:500; }
.board-cta { margin-top:64px; }
.board-sub { margin-top:24px; font-size:15px; color:var(--text-mute); font-weight:500; }
.board-link { color:var(--gold-bright); text-decoration:none; border-bottom:1px solid transparent; transition:all .2s; }
.board-link:hover { border-bottom-color:var(--gold); text-shadow: 0 0 12px rgba(240,192,90,0.2); }
.footer { background: var(--bg-2); padding:64px 0 44px; border-top:1px solid var(--line); }
.footer-inner { text-align:center; }
.footer-brand { display:inline-flex; align-items:center; gap:10px; font-family:var(--display); font-size:26px; font-weight:700; letter-spacing:0.04em; margin-bottom:10px; }
.footer-brand span { background: linear-gradient(135deg, var(--gold-bright), var(--gold)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.footer-tag { font-size:15px; color:var(--text-dim); margin-bottom:28px; font-weight:400; }
.footer-compliance { font-size:12px; color:var(--text-mute); max-width:760px; margin:0 auto 28px; line-height:1.6; font-weight:400; }
.footer-copy { font-family:var(--mono); font-size:12px; color:var(--text-mute); letter-spacing:0.08em; font-weight:500; }
.reveal { opacity:0; transform:translateY(30px); transition: opacity .8s cubic-bezier(0.16,1,0.3,1), transform .8s cubic-bezier(0.16,1,0.3,1); }
.reveal.visible { opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce) { .reveal { opacity:1 !important; transform:none !important; transition:none !important; } }