:root { --ink: #14251f; --sand: #efe9dd; --paper: #f7f3eb; --acid: #d9f05b; --muted: #668078; --line: rgba(20,37,31,.16); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Georgia, 'Times New Roman', serif; }
a { color: inherit; text-decoration: none; }
.grain { position: fixed; inset: 0; pointer-events: none; opacity: .16; z-index: 20; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E"); }
.site-header { height: 88px; padding: 0 6vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 2; }
.brand { display: inline-flex; align-items: center; gap: 10px; font: 700 12px/1 Arial, sans-serif; letter-spacing: .18em; }
.brand img { width: 30px; height: 30px; object-fit: contain; }
nav { display: flex; gap: clamp(16px, 2.4vw, 38px); font: 600 11px/1 Arial, sans-serif; text-transform: uppercase; letter-spacing: .12em; }
nav a:hover, footer a:hover { color: #637e00; }
.hero { min-height: 690px; padding: 10vw 6vw 8vw; display: grid; grid-template-columns: 1.04fr .96fr; gap: 6vw; overflow: hidden; background: var(--sand); }
.eyebrow, .section-number { margin: 0 0 22px; color: #647b00; font: 700 10px/1.3 Arial, sans-serif; letter-spacing: .16em; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 28px; font-size: clamp(52px, 7.2vw, 112px); line-height: .9; font-weight: 400; letter-spacing: -.065em; }
.lede { max-width: 520px; font-size: 19px; line-height: 1.5; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 42px; font: 700 11px/1 Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; }
.button { padding: 16px 20px; }
.button-primary { background: var(--ink); color: var(--acid); }
.button-primary:hover { background: #2f4c42; }
.text-link { border-bottom: 1px solid var(--ink); padding-bottom: 5px; }
.hero-art { position: relative; min-height: 440px; display: grid; place-items: center; }
.abstract-chart { width: min(96%, 500px); height: 400px; position: relative; overflow: hidden; background: linear-gradient(135deg, #d3dfc1, #a7c1aa); clip-path: polygon(8% 0,100% 8%,92% 100%,0 91%); box-shadow: inset 0 0 0 1px rgba(20,37,31,.18); }
.abstract-chart::before, .abstract-chart::after { content: ''; position: absolute; inset: 9%; background-image: linear-gradient(rgba(20,37,31,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(20,37,31,.13) 1px, transparent 1px); background-size: 20% 20%; }
.abstract-chart::after { inset: 0; background: linear-gradient(145deg, transparent 51%, rgba(217,240,91,.95) 51.2%, rgba(217,240,91,.95) 54%, transparent 54.2%); }
.chart-axis { position: absolute; z-index: 1; left: 11%; right: 9%; bottom: 13%; height: 1px; background: var(--ink); }.chart-path { position: absolute; z-index: 2; width: 86%; height: 55%; left: 9%; bottom: 13%; border-left: 3px solid var(--ink); border-bottom: 3px solid var(--ink); clip-path: polygon(0 100%,10% 68%,21% 78%,31% 42%,42% 63%,54% 26%,66% 43%,76% 16%,87% 28%,100% 0,100% 100%); background: var(--ink); }.chart-dot { position: absolute; z-index: 3; width: 11px; height: 11px; border-radius: 50%; background: var(--acid); border: 2px solid var(--ink); }.dot-one { left: 39%; top: 50%; }.dot-two { left: 64%; top: 37%; }.dot-three { right: 11%; top: 18%; }
.orbit { position: absolute; border: 1px solid rgba(20,37,31,.26); border-radius: 50%; }
.orbit-one { width: 445px; height: 445px; animation: spin 25s linear infinite; }
.orbit-two { width: 610px; height: 235px; transform: rotate(-32deg); }
.signal-card { position: absolute; z-index: 1; bottom: 15px; left: -15px; padding: 18px; width: 210px; color: var(--acid); background: var(--ink); transform: rotate(-3deg); font-family: Arial, sans-serif; }
.signal-card strong { display: block; margin: 9px 0; font-size: 25px; letter-spacing: .07em; }.signal-label, .signal-card small { font-size: 9px; letter-spacing: .08em; }.signal-line { display: block; height: 1px; margin: 14px 0; background: var(--acid); }
.statement, .grid-section, .platform-section, .principles, .contact { padding: 11vw 6vw; }.statement { background: var(--ink); color: var(--paper); }.statement h2, .section-intro h2, .contact h2 { max-width: 800px; margin-bottom: 32px; font-size: clamp(46px, 6.4vw, 96px); line-height: .9; font-weight: 400; letter-spacing: -.06em; }.statement > p:last-child { max-width: 650px; font-size: 20px; line-height: 1.55; }.grid-section { background: #cedcbc; }.section-intro { display: grid; grid-template-columns: .3fr 1fr; align-items: baseline; }.research-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); }.research-card { min-height: 260px; padding: 28px 28px 20px 0; border-right: 1px solid var(--line); }.research-card:not(:first-child) { padding-left: 28px; }.research-card:last-child { border-right: 0; }.research-card span, .principle span { color: #647b00; font: 700 11px Arial, sans-serif; }.research-card h3 { margin: 55px 0 16px; font-size: 35px; font-weight: 400; letter-spacing: -.04em; }.research-card p { max-width: 290px; color: #355246; font-size: 16px; line-height: 1.5; }.platform-section { color: var(--paper); background: #101313; }.platform-section .section-number { color: #ffb400; }.platform-lede { max-width: 650px; margin: 0 0 60px auto; color: #c6cbc7; font-size: 19px; line-height: 1.55; }.platform-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(34px, 7vw, 110px); align-items: center; }.feature-stack { display: grid; gap: 14px; }.feature-card { display: grid; grid-template-columns: 42px 1fr; gap: 15px; padding: 21px; border: 1px solid #2c3030; border-radius: 12px; background: #181b1c; }.feature-mark { color: #ffb400; font: 700 12px Arial, sans-serif; }.feature-card h3 { margin: 0 0 7px; font: 600 21px Georgia, serif; }.feature-card p { margin: 0; color: #aeb5b1; font-size: 15px; line-height: 1.45; }.dashboard-poster { min-height: 570px; padding: 30px; position: relative; overflow: hidden; color: #f6f0e8; border: 1px solid #333737; background: radial-gradient(circle at 88% 1%, rgba(255,180,0,.18), transparent 34%), linear-gradient(120deg, #121516, #090a0b); }.dashboard-poster::before { content: ''; position: absolute; inset: 0; opacity: .24; background-image: linear-gradient(#3e3830 1px, transparent 1px), linear-gradient(90deg, #3e3830 1px, transparent 1px); background-size: 58px 58px; }.dashboard-poster > * { position: relative; z-index: 1; }.poster-top { display: flex; align-items: center; gap: 8px; color: #ffb400; font: 700 11px Arial, sans-serif; letter-spacing: .12em; }.poster-top > span:last-child { margin-left: auto; color: #a69f95; font-weight: 400; }.poster-dot { width: 8px; height: 8px; display: inline-block; border-radius: 50%; background: #ffb400; box-shadow: 0 0 13px #ffb400; }.poster-tag { display: inline-block; margin: 62px 0 30px; padding: 8px 12px; color: #ffb400; border: 1px solid #805c0b; border-radius: 999px; font: 700 10px Arial, sans-serif; letter-spacing: .1em; }.dashboard-poster h3 { margin: 0; max-width: 600px; font-size: clamp(43px, 4vw, 68px); line-height: .92; letter-spacing: -.06em; font-weight: 400; }.dashboard-poster > p { max-width: 530px; margin: 25px 0 35px; color: #c4bdb2; font-size: 17px; line-height: 1.5; }.poster-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.poster-metrics div { min-height: 92px; padding: 15px; border: 1px solid #343535; background: rgba(26,28,29,.88); }.poster-metrics small, .poster-note { display: block; color: #aaa69e; font: 9px/1.4 Arial, sans-serif; letter-spacing: .09em; }.poster-metrics b { display: block; margin-top: 16px; color: #ffb400; font: 700 14px Arial, sans-serif; }.poster-bars { display: grid; gap: 12px; margin-top: 34px; }.poster-bars span { height: 9px; display: block; background: linear-gradient(90deg, #ffad00 0 82%, #2a2a29 82%); }.poster-bars span:nth-child(2) { background: linear-gradient(90deg, #ffd25a 0 74%, #2a2a29 74%); }.poster-bars span:nth-child(3) { background: linear-gradient(90deg, #ffad00 0 58%, #2a2a29 58%); }.poster-bars span:nth-child(4) { background: linear-gradient(90deg, #ffd25a 0 47%, #2a2a29 47%); }.poster-note { margin-top: 27px; }.availability-note { max-width: 900px; margin: 65px auto 0; padding-top: 20px; border-top: 1px solid #303333; color: #aeb5b1; font: 14px/1.5 Arial, sans-serif; }.image-band { min-height: 480px; display: grid; grid-template-columns: 1fr 1fr; background: #e5d1b5; }.image-band img { width: 100%; height: 100%; min-height: 420px; object-fit: cover; filter: sepia(.4) grayscale(.35); }.image-band div { padding: 9vw 6vw; }.image-band blockquote { margin: 0; font-size: clamp(34px,4vw,63px); line-height: .98; letter-spacing: -.055em; }.principles { background: var(--paper); }.principle-list { margin-top: 65px; border-top: 1px solid var(--line); }.principle { display: grid; grid-template-columns: 120px 1fr; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--line); }.principle p { margin: 0; font-size: clamp(25px,3.3vw,50px); letter-spacing: -.045em; }.contact { color: var(--paper); background: #60746b; }.contact h2 { max-width: 700px; }.contact p:last-child { max-width: 580px; font-size: 19px; line-height: 1.6; }.contact a { border-bottom: 1px solid var(--acid); color: var(--acid); }footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 30px 6vw; background: var(--ink); color: var(--paper); font: 11px Arial, sans-serif; }footer p { margin: 0; color: #aec0b6; }footer div { display: flex; gap: 18px; }.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }.reveal.is-visible { opacity: 1; transform: translateY(0); }.delay-1 { transition-delay: .14s; }.delay-2 { transition-delay: .28s; }@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 760px) { .site-header { height: 72px; padding: 0 22px; }.site-header nav { display: none; }.hero { min-height: auto; padding: 80px 22px 65px; grid-template-columns: 1fr; }.hero-art { min-height: 360px; }.orbit-one { width: 330px; height: 330px; }.orbit-two { width: 410px; height: 160px; }.signal-card { left: 0; }.statement, .grid-section, .platform-section, .principles, .contact { padding: 80px 22px; }.section-intro { display: block; }.research-grid, .image-band, .platform-layout { grid-template-columns: 1fr; }.research-card, .research-card:not(:first-child) { min-height: 210px; padding: 25px 0; border-right: 0; border-bottom: 1px solid var(--line); }.research-card:last-child { border-bottom: 0; }.platform-lede { margin: 0 0 40px; }.dashboard-poster { min-height: 570px; padding: 22px; }.poster-tag { margin-top: 43px; }.poster-metrics { grid-template-columns: 1fr; }.poster-metrics div { min-height: 66px; }.poster-metrics b { margin-top: 8px; }.image-band img { min-height: 300px; }.image-band div { padding: 70px 22px; }.principle { grid-template-columns: 58px 1fr; }.principle-list { margin-top: 40px; }footer { flex-direction: column; align-items: flex-start; padding: 30px 22px; } }
