.projects-shell { max-width: 1480px; margin: 0 auto; overflow: hidden; }.projects-hero { position: relative; overflow: hidden; min-height: 465px; padding: 27px clamp(28px, 7vw, 120px) 70px; border: 1px solid var(--line); background: radial-gradient(circle at 84% 40%, rgba(255, 198, 90, 0.17), transparent 22rem), radial-gradient(circle at 44% 125%, rgba(53, 223, 207, 0.18), transparent 30rem), linear-gradient(125deg, #06131f 7%, #09202d 63%, #132a35 100%); }.projects-hero::after { position: absolute; inset: 0; content: ""; pointer-events: none; opacity: 0.36; background-image: linear-gradient(rgba(145, 255, 241, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(145, 255, 241, 0.08) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(90deg, transparent, #000 36%, #000 80%, transparent); }.projects-nav, .projects-heading, .project-stats { position: relative; z-index: 1; }.projects-nav { display: flex; justify-content: space-between; gap: 18px; color: var(--muted); font-size: 0.75rem; font-weight: 750; letter-spacing: 0.07em; text-transform: uppercase; }.projects-nav a { color: var(--muted); }.projects-nav a:hover { color: var(--cyan); }.projects-heading { max-width: 830px; padding-top: 83px; }.projects-heading h1 { margin-bottom: 18px; font-size: clamp(4rem, 8.3vw, 7.45rem); }.projects-heading h1 em { color: var(--amber); }.projects-heading > p:last-child { max-width: 660px; margin-bottom: 0; color: var(--muted); font-size: 1.02rem; }.project-stats { display: flex; flex-wrap: wrap; gap: 34px; margin: 51px 0 0; padding: 0; }.project-stats div { min-width: 83px; }.project-stats dt { color: var(--cyan-bright); font-family: Georgia, "Times New Roman", serif; font-size: 2rem; line-height: 1; }.project-stats dd { margin: 3px 0 0; color: var(--faint); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }

.projects-main { border-right: 1px solid var(--line); border-left: 1px solid var(--line); background: rgba(4, 17, 27, 0.64); }.projects-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }.project-column { min-width: 0; padding: 74px clamp(26px, 5.2vw, 82px) 88px; }.project-column + .project-column { border-left: 1px solid var(--line); }.vertical-column { background: linear-gradient(165deg, rgba(53, 223, 207, 0.055), transparent 42%); }.horizontal-column { background: linear-gradient(165deg, rgba(255, 198, 90, 0.055), transparent 42%); }.project-column-heading { min-height: 176px; margin-bottom: 31px; }.project-column-heading p { margin-bottom: 12px; color: var(--cyan); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }.horizontal-column .project-column-heading p { color: var(--amber); }.project-column-heading h2 { margin-bottom: 10px; font-size: clamp(2.35rem, 4vw, 3.85rem); line-height: 0.92; letter-spacing: -0.06em; }.project-column-heading span { color: var(--muted); font-size: 0.85rem; }.project-list { display: grid; gap: 14px; }.project-item { position: relative; min-height: 148px; padding: 21px 22px 22px; border: 1px solid rgba(145, 255, 241, 0.15); background: rgba(8, 31, 43, 0.62); transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease; }.project-item::before { position: absolute; top: 0; bottom: 0; left: 0; width: 3px; content: ""; background: var(--cyan); }.horizontal-column .project-item::before { background: var(--amber); }.project-item:hover { border-color: rgba(53, 223, 207, 0.55); background: rgba(13, 48, 59, 0.79); transform: translateY(-3px); }.horizontal-column .project-item:hover { border-color: rgba(255, 198, 90, 0.6); }.project-item-meta { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 16px; color: var(--faint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.68rem; font-weight: 750; letter-spacing: 0.08em; }.project-role { display: inline-flex; align-items: center; min-height: 20px; padding: 1px 7px; border: 1px solid rgba(87, 174, 233, 0.45); color: var(--blue); letter-spacing: 0.08em; }.project-role.lead { border-color: rgba(53, 223, 207, 0.56); color: var(--cyan-bright); }.horizontal-column .project-role.lead { border-color: rgba(255, 198, 90, 0.6); color: #ffe3a1; }.project-item h3 { margin-bottom: 8px; color: #efffff; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: clamp(1rem, 1.55vw, 1.23rem); font-weight: 760; letter-spacing: -0.022em; line-height: 1.45; }.project-funder { margin-bottom: 3px; color: var(--muted); font-size: 0.83rem; }.project-number { margin-bottom: 0; color: var(--cyan); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.74rem; font-weight: 700; letter-spacing: 0.02em; }.horizontal-column .project-number { color: var(--amber); }

.projects-footer { display: flex; justify-content: space-between; gap: 18px; padding: 27px clamp(28px, 7vw, 120px) 34px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); color: var(--faint); background: #05101a; font-size: 0.73rem; }.projects-footer p { margin: 0; }.projects-footer a { color: var(--muted); border-bottom: 1px solid rgba(159, 180, 188, 0.35); }.projects-footer a:hover { color: var(--cyan); border-color: var(--cyan); }

@media (max-width: 860px) { .projects-grid { grid-template-columns: 1fr; }.project-column + .project-column { border-top: 1px solid var(--line); border-left: 0; }.project-column-heading { min-height: 0; }.project-item { min-height: 0; } }
@media (max-width: 620px) { .projects-hero { min-height: 0; padding-top: 24px; padding-bottom: 56px; }.projects-nav { font-size: 0.67rem; }.projects-heading { padding-top: 69px; }.projects-heading h1 { font-size: clamp(3.4rem, 15vw, 5.2rem); }.projects-heading > p:last-child { font-size: 0.94rem; }.project-stats { gap: 24px; margin-top: 42px; }.project-column { padding-top: 58px; padding-bottom: 64px; }.project-column-heading h2 { font-size: 2.72rem; }.project-item { padding: 18px 18px 19px; }.projects-footer { flex-direction: column; } }