:root {
  --ink: #1e252b;
  --soft-ink: #4e5960;
  --paper: #fcfbf8;
  --cream: #f6f1e8;
  --line: #d9d9d2;
  --accent: #ed7049;
  --accent-dark: #a83d2a;
  --gold: #e6ab4d;
  --blue: #3e7fba;
  --shell: min(1160px, calc(100vw - 64px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body::before { content: ""; position: fixed; z-index: -1; inset: 0; pointer-events: none; opacity: .32; background-image: radial-gradient(#99978e 0.45px, transparent .45px); background-size: 5px 5px; mask-image: linear-gradient(to bottom, #0002 0, transparent 47%); }
a { color: inherit; text-decoration: none; }.shell { width: var(--shell); margin-inline: auto; }.section { padding: 122px 0; }img { max-width: 100%; display: block; }

.site-header { height: 77px; border-bottom: 1px solid var(--line); background: #fcfbf8e8; backdrop-filter: blur(12px); position: sticky; top: 0; z-index: 30; }.nav-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 22px; }.brand { display: inline-flex; align-items: center; gap: 9px; font-weight: 770; font-size: 16px; letter-spacing: -.052em; white-space: nowrap; }.brand img { width: 39px; height: 35px; object-fit: cover; object-position: center 47%; mix-blend-mode: multiply; }.brand b { color: var(--accent); font-family: Georgia, serif; font-style: italic; font-size: 1.05em; font-weight: 400; }.site-header nav { display: flex; align-items: center; gap: 27px; margin-left: auto; }.site-header nav a { color: #51585d; font-size: 12px; font-weight: 660; transition: color .18s ease; }.site-header nav a:hover { color: var(--accent-dark); }.release-links { display: flex; gap: 7px; }.release-links span, .release-links a { padding: 7px 9px; border: 1px solid var(--line); border-radius: 5px; color: #777c7d; font-size: 10px; font-weight: 680; }.release-links a { color: var(--ink); transition: color .18s ease, border-color .18s ease; }.release-links a:hover { color: var(--accent-dark); border-color: var(--accent-dark); }.release-links i { color: var(--accent-dark); font-size: 9px; font-style: normal; margin-left: 3px; }

.hero { min-height: 527px; padding: 78px 55px 62px; display: grid; grid-template-columns: 1.18fr .82fr; align-items: center; gap: 34px; position: relative; overflow: hidden; border-bottom: 1px solid var(--line); }.hero::before { content: ""; position: absolute; right: -155px; top: -216px; width: 530px; height: 530px; border-radius: 50%; border: 1px solid #eda45f3f; box-shadow: 0 0 0 42px #eda45f0a, 0 0 0 91px #eda45f08; pointer-events: none; }.hero-copy { position: relative; z-index: 1; }.overline { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; color: #765e53; font-size: 10px; font-weight: 780; letter-spacing: .13em; text-transform: uppercase; }.overline span { width: 23px; height: 1px; background: var(--accent); }.hero h1, h2 { font-size: clamp(47px, 5.4vw, 76px); letter-spacing: -.02em; line-height: .94; margin: 0; font-weight: 740; }.hero h1 em, h2 em { color: var(--accent); font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-style: italic; }.hero-title { max-width: 630px; margin: 21px 0 0; font: 400 clamp(19px, 2.1vw, 29px)/1.17 Georgia, "Times New Roman", serif; letter-spacing: -.01em; }.hero-abstract { max-width: 635px; margin: 21px 0 0; color: var(--soft-ink); font-size: 14px; line-height: 1.65; }.hero-actions { display: flex; gap: 10px; margin-top: 28px; }.action { display: inline-flex; align-items: center; gap: 22px; padding: 12px 15px; font-size: 12px; font-weight: 750; border-radius: 4px; transition: transform .2s ease, background .2s ease; }.action:hover { transform: translateY(-2px); }.action-dark { background: var(--ink); color: #fff; }.action-light { border: 1px solid #bfc1bd; color: var(--ink); }.hero-logo-wrap { position: relative; align-self: stretch; display: flex; flex-direction: column; align-items: center; justify-content: center; }.hero-logo { width: min(315px, 100%); aspect-ratio: 1; object-fit: contain; mix-blend-mode: multiply; position: relative; z-index: 1; }.hero-logo-wrap::after { content: ""; position: absolute; inset: 27% 10% 15%; border-radius: 50%; background: radial-gradient(circle, #f8d47a92, #f0835740 48%, transparent 69%); filter: blur(10px); }.hero-logo-wrap p { position: relative; z-index: 2; color: #956653; margin: -7px 0 0; font-size: 10px; letter-spacing: .11em; text-transform: uppercase; }

.teaser { padding: 44px 0 20px; }.figure-frame { background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 13px; box-shadow: 0 13px 28px #33231a0a; }.figure-frame img { width: 100%; border-radius: 4px; }.teaser figcaption, figure figcaption { color: #737774; font-size: 11px; line-height: 1.5; margin: 11px 3px 0; }.teaser figcaption b, figure figcaption b { color: #353c3e; }

.section-heading { margin-bottom: 47px; }.results-note { margin: 12px 0 0; color: var(--soft-ink); font-size: 15px; }.split-heading { display: grid; grid-template-columns: 1.14fr .86fr; gap: 8vw; align-items: end; }.split-heading > p { color: var(--soft-ink); max-width: 430px; margin: 0 0 4px; line-height: 1.65; font-size: 14px; }.metric-strip { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); margin-bottom: 26px; }.metric-strip article { min-height: 101px; padding: 17px 21px; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid var(--line); }.metric-strip article:last-child { border-right: 0; }.metric-strip strong { color: var(--accent-dark); font: 400 clamp(25px, 3vw, 38px)/1 Georgia, serif; letter-spacing: -.06em; white-space: nowrap; }.metric-strip span { margin-top: 8px; color: #687075; font-size: 10px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }.table-scroll { overflow: auto; border: 1px solid var(--line); background: #fff; }.benchmark-table { border-collapse: collapse; width: 100%; min-width: 830px; font-size: 12px; }.benchmark-table th { padding: 14px 13px; color: #5d6568; background: #f3f1eb; font-size: 10px; font-weight: 760; letter-spacing: .065em; text-align: center; text-transform: uppercase; border-bottom: 1px solid var(--line); }.benchmark-table th:first-child, .benchmark-table th:nth-child(2), .benchmark-table td:first-child, .benchmark-table td:nth-child(2) { text-align: left; }.benchmark-table td { padding: 12px 13px; color: #535b5f; text-align: center; border-bottom: 1px solid #e9e8e4; }.benchmark-table tbody tr:last-child td { border-bottom: 0; }.benchmark-table .table-group td { padding: 9px 13px; color: #866957; background: #fbf5ed; font-size: 9px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }.benchmark-table td.ours { color: #a83d2a; font-weight: 800; background: #fff7f1; }.results-footer { display: flex; align-items: center; justify-content: space-between; gap: 25px; color: #737a7b; font-size: 11px; margin-top: 14px; }.results-footer p { margin: 0; }.results-footer p a { text-decoration: underline; text-underline-offset: 2px; color: #545d60; }.text-link { color: var(--accent-dark); font-size: 12px; font-weight: 730; white-space: nowrap; }.text-link span { margin-left: 5px; }

.method { border-top: 1px solid var(--line); }.method-overview { margin: 0; padding: 11px; background: #141416; border-radius: 8px; }.method-overview img { width: 100%; border-radius: 4px; }.method-overview figcaption { color: #b7b7b5; margin: 11px 4px 4px; }.method-overview figcaption b { color: #fff; }.method-notes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; padding: 43px 0 54px; }.method-notes article { padding-top: 16px; border-top: 2px solid var(--accent); }.method-notes span { color: var(--accent-dark); font: 400 17px Georgia, serif; }.method-notes h3 { font-size: 16px; letter-spacing: -.035em; margin: 18px 0 9px; }.method-notes p { color: var(--soft-ink); font-size: 13px; line-height: 1.58; margin: 0; }.representation-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.representation-grid figure { margin: 0; padding: 9px; border: 1px solid var(--line); background: white; border-radius: 7px; }.representation-grid img { width: 100%; border-radius: 3px; }.representation-grid figcaption { margin: 9px 2px 2px; }

.gallery { padding-top: 116px; padding-bottom: 120px; background: #202426; color: #f7f4ee; }.gallery .overline { color: #e9cbb9; }.gallery .overline span { background: #f19872; }.gallery h2 em { color: #ff9671; }.gallery .split-heading > p { color: #bec2bd; }.case-study { display: grid; grid-template-columns: .88fr 1.12fr; gap: clamp(26px, 6vw, 88px); align-items: center; margin-top: 56px; padding: 18px; background: #2a3032; border: 1px solid #ffffff24; }.case-study figure { margin: 0; padding: 8px; background: #fff; }.case-study img { width: 100%; max-height: 610px; object-fit: cover; object-position: top; }.case-label { margin: 0 0 12px; color: #ef9b7c; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.case-study h3 { font: 400 clamp(32px, 4vw, 52px)/.95 Georgia, serif; letter-spacing: -.06em; margin: 0 0 21px; }.case-study > div > p:not(.case-label) { max-width: 480px; color: #c7cbc6; font-size: 14px; line-height: 1.65; }.case-study ul { padding: 0; margin: 24px 0 0; list-style: none; }.case-study li { color: #efede7; font-size: 12px; line-height: 1.5; padding: 9px 0 9px 18px; border-top: 1px solid #ffffff1c; position: relative; }.case-study li::before { content: "✦"; position: absolute; left: 0; color: #f3a67f; }.gallery-rails { margin-top: 93px; }.task-rail { padding: 34px 0; border-top: 1px solid #ffffff27; }.task-rail:last-child { border-bottom: 1px solid #ffffff27; }.task-head { display: flex; align-items: center; gap: 14px; margin-bottom: 17px; }.task-head > div { display: flex; align-items: baseline; gap: 12px; }.task-head span { color: #e48868; font: 400 19px Georgia, serif; }.task-head h3 { font-size: 21px; letter-spacing: -.04em; margin: 0; }.task-head p { margin: 0 0 0 auto; color: #b6bbb5; font-size: 11px; }.scroll-control { width: 31px; height: 31px; color: #fff; background: transparent; border: 1px solid #ffffff65; border-radius: 50%; cursor: pointer; transition: .2s ease; }.scroll-control:hover { background: #e27856; border-color: #e27856; }.example-rail { display: flex; gap: 11px; overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x mandatory; cursor: grab; scrollbar-color: #807e7a transparent; scrollbar-width: thin; }.example-rail:active { cursor: grabbing; }.example-card { flex: 0 0 227px; min-height: 145px; padding: 13px; scroll-snap-align: start; border: 1px solid #ffffff36; background: #282e30; position: relative; overflow: hidden; }.example-card::after { content: ""; position: absolute; right: -25px; bottom: -28px; width: 93px; height: 93px; border: 1px solid var(--card-accent); border-radius: 50%; opacity: .55; box-shadow: 0 0 0 12px #ffffff09; }.example-top { display: flex; justify-content: space-between; gap: 9px; position: relative; z-index: 1; color: #e2e4df; font-size: 9px; font-weight: 800; letter-spacing: .075em; text-transform: uppercase; }.example-top span:last-child { color: var(--card-accent); }.example-card h4 { position: relative; z-index: 1; max-width: 164px; margin: 28px 0 6px; color: #fff; font-size: 13px; letter-spacing: -.025em; }.example-card p { position: relative; z-index: 1; max-width: 168px; margin: 0; color: #b7bdb9; font-size: 10px; line-height: 1.4; }.empty-tile { position: absolute; right: 18px; top: 43px; z-index: 1; width: 26px; height: 26px; border: 1px dashed #ffffff7d; display: grid; place-items: center; color: #fff; font-size: 12px; }

.citation { display: grid; grid-template-columns: 1fr 1fr; gap: 9vw; align-items: center; }.citation h2 { font-size: clamp(40px, 4.6vw, 63px); }.citation > div > p:last-child { color: var(--soft-ink); font-size: 14px; line-height: 1.6; max-width: 420px; }.citation pre { margin: 0; padding: 24px; overflow: auto; border-radius: 7px; color: #d9dce2; background: #22272a; box-shadow: 8px 8px 0 #e6e0d7; font: 11px/1.6 "SFMono-Regular", Consolas, monospace; }.citation code { white-space: pre; }footer { border-top: 1px solid var(--line); }.footer-inner { min-height: 97px; display: flex; align-items: center; justify-content: space-between; gap: 25px; }.footer-inner p { color: #777c7b; margin: 0; font-size: 11px; }

@media (max-width: 820px) { :root { --shell: min(100% - 38px, 1160px); }.site-header nav { display: none; }.release-links { margin-left: auto; }.hero { grid-template-columns: 1fr; min-height: 0; padding: 61px 16px 42px; }.hero-logo-wrap { display: none; }.teaser { padding-top: 29px; }.split-heading, .citation { grid-template-columns: 1fr; gap: 24px; }.method-notes { gap: 14px; }.case-study { grid-template-columns: 1fr; }.case-study figure { max-width: 525px; }.representation-grid { gap: 10px; }.footer-inner { min-height: 80px; } }
@media (max-width: 540px) { :root { --shell: calc(100% - 28px); }.site-header { height: 64px; }.brand { font-size: 14px; }.brand img { width: 34px; height: 31px; }.release-links span, .release-links a { padding: 6px 7px; font-size: 9px; }.section { padding: 77px 0; }.hero { padding: 46px 3px 39px; }.overline { font-size: 9px; }.hero h1 { font-size: 53px; }.hero-title { font-size: 21px; }.hero-abstract { font-size: 13px; }.hero-actions { margin-top: 23px; }.action { padding: 11px 12px; gap: 13px; font-size: 11px; }.teaser { padding-bottom: 5px; }.figure-frame { padding: 6px; }.section-heading { margin-bottom: 31px; }.split-heading > p { font-size: 13px; }.metric-strip { grid-template-columns: 1fr 1fr; }.metric-strip article { min-height: 86px; padding: 15px 13px; }.metric-strip article:nth-child(2) { border-right: 0; }.metric-strip article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.metric-strip strong { font-size: 25px; }.results-footer { align-items: flex-start; flex-direction: column; gap: 8px; }.method-notes { grid-template-columns: 1fr; padding: 32px 0; gap: 25px; }.representation-grid { grid-template-columns: 1fr; gap: 14px; }.gallery { padding-top: 77px; padding-bottom: 74px; }.case-study { padding: 9px; margin-top: 35px; }.case-study > div { padding: 12px 10px 14px; }.case-study h3 { font-size: 35px; }.gallery-rails { margin-top: 56px; }.task-rail { padding: 25px 0; }.task-head { flex-wrap: wrap; margin-bottom: 15px; }.task-head p { width: calc(100% - 47px); margin-left: 0; order: 3; }.example-card { flex-basis: 74vw; }.citation { gap: 33px; }.citation pre { padding: 16px; font-size: 9px; }.footer-inner { flex-wrap: wrap; padding: 20px 0; gap: 12px; }.footer-inner .text-link { margin-left: auto; } }
